﻿/* alternative clearing method */
.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
  }
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end - alternative clearing method */

html, body {
  background: #6F8E9B url( '../images/tlo.jpg' ) 50% 0 no-repeat;
  color: #333;
  font-family: Helvetica, Arial, sans-serif;
  }
.container {
  }

#wstep img#monitor,
#wstep ul.bonusy li,
.buy,
#ulotki,
a.btSmall span, .przycisk-w-budowie span,
.opinia-klient,
.opinia,
.opinia blockquote,
#wybrane-przyklady blockquote,
.wrap_tp, .wrap, .wrap_in, .haslo,
#chat, #chat p.top,
.sprawdz, .sprawdz p,
#hd, #hd h1 {
    behavior: url('/frontend/ccDesign/css/iepngfix.htc');
  }

a {
  color: #2E81CD;
  text-decoration: none;
  }
a:hover {
  color: #2E81CD;
  text-decoration: underline;
  }
p.between {
  margin: 1em;
  color: #FFF;
  text-align: right;
  }
.right {
  float: right;
  margin-left: 1em;
  }

h2,
#argumenty h3,
#wybrane-przyklady h3 {
  color: #999;
  font-weight: bolder;
  font-family: Helvetica, Arial, sans-serif ;
  letter-spacing: -1px;
  font-size: 2em;
  }
#hd {
  position: relative;
  background: transparent url( '../images/logo_lapka.png' ) 0 50px no-repeat;
  padding-bottom: 10px;
  }
#hd h1,
#hd h1 a {
  width: 617px;
  height: 70px;
  line-height: 100px;
  }
#hd h1 {
  background: transparent url( '../images/naglowek_strony_www.png' ) 0 0 no-repeat;
  float: left;
  color: #222;
  margin: 40px 0 0 80px;
  font-weight: bolder;
  font-family: Helvetica, Arial, sans-serif;
  letter-spacing: -2px;
  font-size: 2.5em;
  }
#hd h1 span {
  display: none;
  }
#hd h1 a {
  display: block;
  color: #222;
  text-decoration: none;
  }
#hd p.tagline {
  position: absolute;
  left: 400px; top: 40px;
  margin: 50px 0 0 15px;
  color: #202020;
  font-size: 1em;
  font-weight: bold;
  width: 250px; height: 46px;
  background: transparent url('../images/tak_to_mozliwe.png') right bottom no-repeat;
  }
#ft {
  height: 75px;
  line-height: 75px;
  }

.nav {
  float: right;
  list-style: none;
  display: block;
  margin: 30px 10px 0 0;
  }
.nav li {
  border-right: 1px solid #333;
  display: inline;
  padding: 0 12px 0 10px;
  font-size: .9em;
  }
.nav li.last {
  border: 0px;
  }
.nav a {
  color: #333;
  }
.nav a:hover {
  text-decoration: underline;
  }
.nav li.current a,
.nav li.current a:hover {
  color: #2D80CC;
  }

.wrap_tp{
  display: block;
  height: 3px;
  background: url('../images/bg_narrow_wrap3.png') no-repeat top center;
}
.wrap {
  background: url('../images/bg_narrow_wrap4.png') repeat-y top center;
  }
.wrap_in{
  background: url('../images/bg_wrapin.gif') repeat-x bottom center;
  margin: 0 4px;
}
.span-7 .content {
  padding: 30px 15px;
  }
.span-7 .content.first {
  padding-left: 30px;
  }
.content {
  padding: 35px;
  }
.wrap_bt{
  display: block;
  height: 5px;
  background: url('../images/bg_narrow_wrap5.png') no-repeat bottom center;
}

#wstep {
  position: relative;
  display: block;
  height: 550px;
  background: url('../images/bg_narrow_tall_wrap1.png') no-repeat top left;
  padding-top: 25px;
  padding-bottom: 25px;
  }
#wstep h3 {
  margin: 0;
  }
#wstep img#monitor {
  float: right;
  position: relative;
  top: -20px;
  }
#wstep #slogan {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 2em;
  margin: 0;
  }
#wstep #slogan strong {
  display: block;
  font-size: 1.2em;
  line-height: 1em;
  font-weight: bolder;
  }
#wstep ul.bonusy {
  margin: 30px 0 0 40px;
  padding: 0;
  }
#wstep ul.bonusy li {
  list-style: none;
  padding-left: 70px;
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 5px;
  height: 65px;
  }
#wstep ul.bonusy li .info {
  display: block;
  font-size: .7em;
  font-weight: normal;
  line-height: 1em;
  color: #666;
  }
#wstep ul.bonusy li .cena {
  font-size: 1.5em;
  line-height: 1em;
  color: #FF0000;
  }
#wstep ul.bonusy li.www .cena {
  color: #000;
  }
#wstep ul.bonusy li.www {
  background: url('../images/ico_www.png') left top no-repeat;
  height: 100px;
  }
#wstep ul.bonusy li.hosting {
  background: url('../images/ico_host.png') left top no-repeat;
  }
#wstep ul.bonusy li.email {
  background: url('../images/ico_email.png') left top no-repeat;
  }
#wstep ul.bonusy li.domena {
  background: url('../images/ico_domain.png') left top no-repeat;
  }
#wstep ul.bonusy li.doradztwo {
  background: url('../images/ico_doradztwo.png') left top no-repeat;
  }

#argumenty ul {
  margin: 0;
  padding-left: 0;
  }

#argumenty h3 {
  color: #999;
  font-weight: bolder;
  font-family: Helvetica, Arial, sans-serif ;
  letter-spacing: -1px;
  font-size: 2em;
  }
#argumenty h3 em {
  display: block;
  color: #2C78BB;
  font-size: .8em;
  font-weight: normal;
  margin-top: .5em;
  }
#argumenty li {
  background: url('../images/bullet_blue.png') 0 5px no-repeat;
  list-style: none;
  padding-left: 15px;
  }

.buy {
  width: 168px;
  height: 41px;
  background: url('../images/bt_buy.png') no-repeat top left;
  display: block;
  font-weight: bolder;
  font-family: Lucida Sans, Helvetica, Arial, sans-serif;
  line-height: 40px;
  margin: 10px 40px 0 250px;
  }
.buy img {
  margin: 8px 8px 8px 16px;
  float: left;
  }
.buy a {
  color: #FFF !important;
  }

#ulotki {
  position: absolute;
  bottom: 20px; right: -18px;
  width: 380px; height: 212px;
  background: transparent url('../images/bg_ulotki.png') right top no-repeat;
  }
#ulotki p {
  font-weight: bold;
  color: #999;
  font-size: 1.5em;
  line-height: 1.3em;
  margin: 10px 50px 0 0;
  }
#ulotki strong {
  color: #000;
  }

.haslo {
  display: block;
  height: 84px;
  background: url('../images/bg_narrow_wrap0.png') no-repeat top left;
  }
.haslo p {
  font-size: 2.5em;
  color: #FFF;
  line-height: 75px;
  letter-spacing: -1px;
  }
.haslo a {
  color: #FFF;
  border-bottom: 2px dotted #FFF;
  font-weight: normal;
  }
.haslo a:hover {
  text-decoration: none;
  border-bottom: none;
  }
#sb {
  background: #F3F9FC url('../images/bg_sidebar.gif') repeat-x bottom;
  }
#sb h3 {
  color: #000;
  border-bottom: 1px solid #E0E0E0;
  font: normal 1.35em Helvetica, Arial, sans-serif;
  padding: 0 0 5px 0;
  margin: 0 0 10px 0;
  letter-spacing: normal;
}
#sb h4 {
  margin-bottom: 4px;
  margin-top: 1em;
  font-weight: bold;
}
#sb .adres {
  color: #666;
  font-style: italic;
  }

#sb #dyzur {
  background: #E1F0F7 url('../images/krzysztof.jpg') 20px 60px no-repeat;
  border-bottom: 2px solid #FFF;
  height: 230px;
  }
#sb #dyzur h3 {
  background: transparent url('../images/ico_ludzik.png')  left top no-repeat;
  padding-left: 35px;
  border-bottom: none;
  height: 30px;
  }
#chat {
  background: transparent url('../images/chat_kontakt_bottom.png') center bottom no-repeat;
  width: 689px;
  position: relative;
  left: -150px;
  padding-bottom: 25px;
  margin-bottom: 25px;
  }
#chat p {
  color: #FFF;
  font-size: 1.2em;
  padding: 0 25px 0 60px;
  }
#chat p.top {
  background: transparent url('../images/chat_kontakt_top.png') center top no-repeat;
  padding-top: 25px;
  }
#kontakt .form_row,
#kontakt p {
  margin-bottom: 1em;
  }
#kontakt .req label {
  font-weight: bold;
  }
#kontakt input[type=text],
#kontakt textarea {
  background-color: #F9F9F9;
  border: 1px solid #DCDCDC;
  color: #404040;
  font-family: Arial,Verdana,sans-serif;
  text-indent: 8px;
  width: 280px;
  }
#kontakt input[type=text] {
  height: 20px;
  margin: 5px 0;
  padding-top: 4px;
  width: 300px;
  }
#kontakt textarea {
  height: 200px;
  line-height: 18px;
  margin-top: 5px;
  padding-top: 5px;
  width: 450px;
  }
#kontakt input[type=text]:focus,
#kontakt textarea:focus {
  background-color: #FFF;
  border-color: #DCDCDC;
  }
#kontakt input[type=submit] {
  background-color: #2C79BC;
  border: 5px solid #2C79BC;
  color: #FFF;
  cursor:pointer;
  font-weight:bold;
  margin:10px 0 0;
  padding:5px;
  }
#kontakt input[type=submit]:hover {
  background-color: #052E4F;
  }

#przyklady h3 {
  color: #999;
  font-size: 1.5em;
  padding-bottom: .4em;
  }
#przyklady h3 strong {
  color: #000;
  font-weight: bold;
  display: block;
  }

#przyklady .opis {
  float: left;
  width: 260px;
  margin: 0px 30px 1.45em 0;
  font-size: .9em;
  }
#przyklady .opis a.adres {
  position: relative;
  color: #999;
  top: -2em;
  }
#przyklady .zrzut {
  float: left;
  margin: 0 0 1.45em 0;
  position: relative;
  }
#przyklady .premium {
  position: absolute;
  left: -17px; top: -8px;
  background: transparent url( '../images/ramka_projekt_premium.png' ) 0 0 no-repeat;
  width: 545px;
  height: 210px;
  }
#przyklady .premium span {
  display: none;
  }
#przyklady .zrzut img {
  border: 1px solid #E4E4E4;
  padding: 5px;
  background-color: #FFF;
  }
a.btSmall,
.przycisk-w-budowie {
  color: #FFF;
  display: block;
  height: 30px;
  padding-left: 30px;
  text-decoration: none;
  float: left;
  margin: 4px 0;
  }
a.btSmall {
  background: transparent url('../images/bt_small_left.png') no-repeat scroll left top;
  }
.przycisk-w-budowie {
  color: #BFBFBF;
  background: transparent url('../images/bt_w_budowie_left.png') no-repeat scroll left top;
}
a.btSmall:hover {
  color: #FFF;
  text-decoration: underline;
  }
a.btSmall span,
.przycisk-w-budowie span {
  display: block;
  height: 30px;
  padding-right: 14px;
  line-height: 25px;
  cursor: pointer;
  }
a.btSmall span {
  background: transparent url('../images/bt_small_right.png') no-repeat scroll right top;
  }
.przycisk-w-budowie span {
  background: transparent url('../images/bt_w_budowie_right.png') no-repeat scroll right top;
  }

/* -- opinia -- */
.opinia-klienta.darek {
  background: transparent url('../images/portret_darek.png') left 90% no-repeat;
  }
.opinia-klienta.damian {
  background: transparent url('../images/portret_damian.png') -40px 90% no-repeat;
  }
.opinia {
  position: relative;
  left: 50px; top: -10px;
  width: 240px;
  background: transparent url('../images/comment_bottom.png') center bottom no-repeat;
  padding-bottom: 20px;
  }
.opinia blockquote {
  width: 240px;
  background: transparent url('../images/comment_top.png') center top no-repeat;
  margin: 0;
  }
.opinia blockquote p {
  padding: 20px 20px 0 50px;
  color: #FFF; 
  }
.opinia .podpis {
  text-align: right;
  padding-right: 20px;
  }
.opinia .podpis a {
  color: #D1E735;
  font-size: .9em;
  }
#wybrane-przyklady .content {
  height: 254px;
  }
#wybrane-przyklady .content.poczta {
  background: transparent url('../images/przyklad_poczta.jpg') left 50px no-repeat;
  }
#wybrane-przyklady .content.chlopy {
  background: transparent url('../images/przyklad_chlopy.jpg') left 50px no-repeat;
  }
#wybrane-przyklady .content.termi {
  background: transparent url('../images/przyklad_termi.jpg') left 50px no-repeat;
  }
#wybrane-przyklady .content.abklima {
  background: transparent url('../images/przyklad_abklima.jpg') left 50px no-repeat;
  }
#wybrane-przyklady .content.damian {
  background: transparent url('../images/przyklad_damian.png') left 50px no-repeat;
  }
#wybrane-przyklady .content.lukasz {
  background: transparent url('../images/przyklad_lukasz.png') left 50px no-repeat;
  }
#wybrane-przyklady .content.beauty-art {
  background: transparent url('../images/przyklad_beauty_art.jpg') left 50px no-repeat;
  }
#wybrane-przyklady .content.ats-auto {
  background: transparent url('../images/przyklad_ats_auto.jpg') left 50px no-repeat;
  }
#wybrane-przyklady h3 {
  margin-bottom: 25px;
  }
#wybrane-przyklady blockquote {
  width: 370px;
  background: transparent url('../images/quote.png') left top no-repeat;
  padding-left: 50px;
  margin-left: 0;
  margin-bottom: 0;
  }
#wybrane-przyklady .chlopy blockquote,
#wybrane-przyklady .poczta blockquote {
  width: 480px;
  }
#wybrane-przyklady blockquote p {
  margin: 0;
  }
#wybrane-przyklady .podpis {
  width: 410px;
  text-align: right;
  margin-bottom: 50px;
  }
#wybrane-przyklady .poczta .podpis {
  width: 530px;
  }
#wybrane-przyklady .podpis cite {
  display: block;
  font-style: normal;
  }
#wybrane-przyklady .podpis a {
  font-size: .9em;
  }

#wybrane-przyklady .damian blockquote,
#wybrane-przyklady .chlopy .podpis a,
#wybrane-przyklady .abklima .podpis a,
#wybrane-przyklady .termi .podpis a,
#wybrane-przyklady .damian .podpis,
#wybrane-przyklady .poczta .podpis a,
#wybrane-przyklady .ats-auto .podpis a {
    color: #EDEDED;
  }
#wybrane-przyklady .damian .podpis a {
  color: #EBAD93;
 }
#wybrane-przyklady .beauty-art .podpis a {
  color: #F9EED2;
 }
#wybrane-przyklady .lukasz blockquote,
#wybrane-przyklady .lukasz .podpis {
  color: #493224;
  }
#wybrane-przyklady .lukasz .podpis a {
  color: #665555;
  }

#wybrane-przyklady .beauty-art blockquote,
#wybrane-przyklady .beauty-art .podpis,
#wybrane-przyklady .chlopy blockquote,
#wybrane-przyklady .chlopy .podpis,
#wybrane-przyklady .abklima blockquote,
#wybrane-przyklady .abklima .podpis,
#wybrane-przyklady .termi blockquote,
#wybrane-przyklady .termi .podpis,
#wybrane-przyklady .poczta blockquote,
#wybrane-przyklady .poczta .podpis,
#wybrane-przyklady .ats-auto blockquote,
#wybrane-przyklady .ats-auto .podpis {
  color: #FFF;
  }
#wybrane-przyklady .chlopy blockquote,
#wybrane-przyklady .chlopy .podpis,
#wybrane-przyklady .chlopy h3,
#wybrane-przyklady .chlopy .wiecej-przykladow,
#wybrane-przyklady .abklima blockquote,
#wybrane-przyklady .abklima .podpis,
#wybrane-przyklady .abklima h3,
#wybrane-przyklady .abklima .wiecej-przykladow {
  margin-left: 230px;
  }
#wybrane-przyklady .termi blockquote,
#wybrane-przyklady .termi .podpis,
#wybrane-przyklady .termi h3,
#wybrane-przyklady .termi .wiecej-przykladow {
  margin-left: 340px;
  }
.stepcarousel {
  position: relative; /*leave this value alone*/
  border: 0px;
  overflow: scroll; /*leave this value alone*/
  width: 862px; /*Width of Carousel Viewer itself*/
  height: 318px; /*Height should enough to fit largest content's height*/
  }
.stepcarousel .stepcarousel-belt {
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
  }
.stepcarousel .stepcarousel-panel {
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 0px; /*margin around each panel*/
  width: 792px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  }

#www-czy-marketing h2 {
  color: #999;
  font-weight: bold;
  letter-spacing: -1px;
  margin-bottom: .2em;
  }
#www-czy-marketing .content {
  padding: 15px;
  }
.sprawdz {
  padding-bottom: 25px;
  height: 300px;
  position: relative;
  }
#wejscie-www .sprawdz {
  background: transparent url( '../images/strony_www_za_600zl.png' ) 50% 50% no-repeat;
  }
#wejscie-marketing .sprawdz {
  background: transparent url( '../images/kampania_adwords_za_300zl.png' ) 50% 50% no-repeat;
  }
.sprawdz h3 {
  display: none;
  }
.sprawdz p {
  position: absolute;
  bottom: 80px;
  width: 340px;
  background: transparent url( '../images/tlo_reklama_wybor.png' ) 50% 0 no-repeat;
  text-align: center;
  padding: 7px;
  }
#wejscie-www .sprawdz p {
  background-image: none;
  width: 160px;
  text-align: right;
  }
.sprawdz p a {
  display: block;
  }

.linki-sponsorowane-pakiety.wrap_tp {
  margin-top: 3em;
  }
.linki-sponsorowane-pakiety.wrap_bt {
  margin-bottom: 2em;
  }
.pakiet {
  margin: 10px;
  margin-right: 0;
  background: transparent url( '../images/tlo_pakiet.jpg' ) 0 0 no-repeat;
  padding: 15px;
  position: relative;
  }
.pakiet.wyrozniony {
  background-image: url( '../images/tlo_pakiet_wyrozniony.jpg' );
  top: 30px; left: 20px;
  margin-top: -50px;
  }
#pakiet-zloty {
  left: 10px;
  }
.pakiet h3 {
  height: 31px;
  }
#pakiet-probny.pakiet h3 {
  background: transparent url( '../images/naglowek_pakiet_probny.png' ) 50% 0 no-repeat;
  }
#pakiet-zloty.pakiet h3 {
  background: transparent url( '../images/naglowek_pakiet_zloty.png' ) 50% 0 no-repeat;
  }
#pakiet-srebrny.pakiet h3 {
  background: transparent url( '../images/naglowek_pakiet_srebrny.png' ) 50% 0 no-repeat;
  font-size: 1.1em;
  font-style: italic;
  font-weight: bold;
  text-align: center;
  padding-top: 40px;
  height: auto;
  letter-spacing: 0;
  margin-bottom: 2em;
  }
#pakiet-srebrny.pakiet h3 strong {
  color: #9D0A0E;
  }
.pakiet h3 span {
  display: none;
  }
.pakiet ul {
  margin: 0; padding: 0;
  list-style: none;
  margin-bottom: 15px;
  }
.pakiet ul li {
  background: transparent url( '../images/li_pakiet.png' ) 0 3px no-repeat;
  padding-left: 25px;
  }
.pakiet ul li.wazne {
  font-size: 1.3em;
  background-position: 0 10px;
  }
#pakiet-probny strong {
  color: #007F3B;
  }
#pakiet-srebrny strong {
  color: #B7B7B7;
}
#pakiet-srebrny del {
  color: #9D0A0E;
  font-weight: bold;
  }
#pakiet-zloty strong {
  color: #D3C700;
}
.pakiet .cena {
  height: 66px;
  margin: 0 -15px -15px -15px;
  font-weight: bold;
  font-style: italic;
  text-align: right;
  padding: 2px 10px;
  }
#pakiet-probny.pakiet .cena {
  background: transparent url( '../images/tlo_cena_pakiet_probny.jpg' ) 0 0 no-repeat;
  color: #EAEAEA;
  }
#pakiet-srebrny.pakiet .cena {
  background: transparent url( '../images/tlo_cena_pakiet_srebrny.jpg' ) 0 0 no-repeat;
  color: #B4B4B4;
  height: 80px;
  padding: 6px 10px;
  }
#pakiet-zloty.pakiet .cena {
  background: transparent url( '../images/tlo_cena_pakiet_zloty.jpg' ) 0 0 no-repeat;
  color: #ACA100;
  }
.pakiet .cena strong {
  display: block;
  height: 40px;
  }
#pakiet-probny.pakiet .cena strong {
  background: transparent url( '../images/cena_300zl.png' ) 100% 0 no-repeat;
  }
#pakiet-srebrny.pakiet .cena strong {
  height: 56px;
  background: transparent url( '../images/cena_300zl_zamiast_550zl.png' ) 100% 0 no-repeat;
  }
#pakiet-zloty.pakiet .cena strong {
  background: transparent url( '../images/cena_900zl.png' ) 100% 0 no-repeat;
  }
.pakiet .cena strong span {
  display: none;
  }
#pakiet-srebrny.pakiet .cena {
  background-image: url( '../images/tlo_cena_pakiet_srebrny.jpg' );
  }
.pakiet .gwiazdka {
  color: #9D0A0E;
  font-size: .9em;
  text-align: right;
  }

#tekst-o-stronach h2,
#tekst-o-stronach h3,
#tekst-o-linkach h2,
#tekst-o-linkach h3 {
  margin-bottom: 0;
  }
#tekst-o-linkach .wazne {
  font-size: 1.2em;
  border-top: 5px solid #790000;
  border-bottom: 5px solid #790000;
  padding: 1em;
  }
