@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,100,700,100italic,300italic,400italic,700italic);

/*************************
*******Typography******
**************************/
html {overflow-y: scroll}
body {
  /*padding-top: 100px;*/
  background: #fff;
  
  font-family: 'Roboto',sans-serif;
  font-size:16px;
  font-weight: 400;
  color: #444;
  line-height: 26px;
}
body.page {
    background:url('/_www2/images/Hydrostop-bg-shad.jpg') center top #fff no-repeat;
}
table {line-height:26px;}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  font-family: 'Roboto', sans-serif;
  color: #272727;
}

a {
  color: #2e82b8;/*#45aed6;*/
  -webkit-transition: color 400ms, background-color 400ms;
  -moz-transition: color 400ms, background-color 400ms;
  -o-transition: color 400ms, background-color 400ms;
  transition: color 400ms, background-color 400ms;
}
a:hover,
a:focus {
  text-decoration: none;
  /*color: #ff9933;#2a95be;*/
}
label {font-weight:normal;cursor:pointer}
hr {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #fff;
}
.button,
a.button,
.btn.btn-primary,
button,
.form-line input.button {
        /*color:#022f60;*/
        color:#fff;
        background:#ff7800;border:none;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        padding:6px 12px;
        font-size:120%;
        font-weight:bold;
        margin:4px 0px;
        display:inline-block;
        -webkit-transition: color 400ms, background-color .5s;
        -moz-transition: color 400ms, background-color .5s;
        -o-transition: color 400ms, background-color .5s;
        transition: color 400ms, background-color .5s;
}
button.off{background:#aaa}
button.spinned {padding:6px 35px;position:relative}
button:disabled,
button.disabled{
    background:#999;
}
.button.sm1,
button.sm1 {
    font-size:100%;
    color:white;
}
.button.sm2,
button.sm2 {
    font-size:80%;
    color:white;
}

a.button:hover {
    background:#84beff;
}

.transition4s {
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.transition0-5s {
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}


.gradiant {
  background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
}
.gradiant-horizontal {
  background-image: -moz-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -webkit-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -ms-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
}
.section-header {
  margin-bottom: 30px;
}
.section-header .section-title {
  font-size: 27px;
  color: #05366b;
  text-transform: uppercase;
  position: relative;
  padding-bottom: 20px;
  margin: 0px 0 20px;
  border-bottom:1px solid #b4c2d2;
}
@media screen and (max-width: 1200px) { 
    .section-header .section-title {
  font-size: 25px;
    }
}
.r {text-align:right}
.c {text-align:center}

.btn {
  border-width: 0;
  border-bottom-width: 3px;
  border-radius: 3px;
}
/*.btn.btn-primary {
  background: #45aed6;
  border-color: #2a95be;
}*/
.btn.btn-primary:hover,
.btn.btn-primary:focus {
  background: #2a95be;
}
.column-title {
  margin-top: 0;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
  margin-bottom: 15px;
  position: relative;
}
.column-title:after {
  /*content: " ";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 40%;
  border-bottom: 1px solid #45aed6;*/
}
ul.nostyle {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}
ul.nostyle i {
  color: #45aed6;
}
.scaleIn {
  -webkit-animation-name: scaleIn;
  animation-name: scaleIn;
}
@-webkit-keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}


.c {text-align:center}
/*************************
*******Header******
**************************/


header {height:60px;display:block;}
header p {text-align:right;padding-top:30px;color:#333;font-size:110%;padding-right:0}

header #user_nav {text-align:right;padding-top:30px;margin-right:-15px}
header #user_nav a {padding:0px 10px}
header #user_nav a i{color:#aaa;margin-right:3px}
/*******************************************************************************
******************************* TOP NAVIGATION**********************************
********************************************************************************/

#topnav {
    z-index:210;
    position:absolute;
    width:100%;
}
#topnav .container {text-align:left;position:relative}
#topnav #navcontainer{
    padding-left:140px;
    width:100%;
    background:url('../images/bg-nav-grad.jpg') no-repeat center center #0a3565; 
    text-align: left;
    position:relative;
    -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
}

/*search form =========*/
#search_form {
    position:absolute;    
            left:0px;top:100px;
            width:100%;
            text-align:center;
}

#search_form_div {
    position:relative;
            margin:0 auto;
            text-align:center;
            background:rgba(10,53,101,.9);
            padding:30px;
            display:inline-block;
            width:60%;
            border-radius: 5px;
    -webkit-box-shadow: 9px 11px 70px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 9px 11px 70px 0px rgba(0,0,0,0.5);
    box-shadow: 9px 11px 70px 0px rgba(0,0,0,0.5);
}
@media (max-width:1200px) {     #search_form_div {width:70%;}}
@media (max-width:990px) {     #search_form_div {width:95%;}}
@media (max-width:990px) {    #search_form_div {width:95%;padding:30px 15px;}}


#search_kom {color:white;padding-top:4px}
#search_field {
    width:calc(100% - 100px);
    padding:7px;
    font-size:130%;
    margin-right:5px;
    background-image:url('/_www2/images/icons/icon_lupa_blue.png');
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:7px center;
    padding-left:32px;
}
.search_link_blank {margin-left:5px;color:#ccc}
#search_form input[type=submit] {
    
}
#search_close {
   position: absolute;
    display: block;
    width: 21px;
    height: 21px;
    top: 0px;
    right: 3px;
    color: rgba(255,255,255,.5);
    font-size: 113%;
}
#search_close:hover {
    color:#fff;
}
#topnav ul {
    -webkit-transition:  height .35s ease-in-out; /* Safari */
    transition: height .35s ease-in-out;
}
#topnav ul.nav li {
    /*float:left;  */
    display:inline-block;
    padding:7px 0px;
   
}
nav#topnav.nav-up {
    top: -80px;
}
#topnav ul.nav li > a {
    padding: 6px 10px;
    color:white;
    font-size:90%;text-transform: uppercase;font-weight:bold;
    border-left:1px solid #8cafd6;
    cursor:pointer;
  }
  #topnav ul.nav li > a:hover {background:transparent;color:#96d1fc}
#topnav ul.nav li:first-child > a {border:none}
#topnav ul.nav li > a.no-border {border:none}
#topnav ul.nav li > a.log {background:url('../images/icons/icon_login.png') left center no-repeat;padding-left:31px;}
#topnav ul.nav li > a.koszyk {background:url('../images/icons/icon_koszyk.png') left center no-repeat;padding-left:31px;}  
#topnav ul.nav li > a.lupa {background:url('../images/icons/icon_lupa.png') left center no-repeat;padding-left:31px;}  

#topnav ul.nav li > a.opt2.log {background-image:url('../images/icons/icon_login_blue.png')}
#topnav ul.nav li > a.opt2.koszyk {background-image:url('../images/icons/icon_koszyk_blue.png')}  
#topnav ul.nav li > a.opt2.lupa {background-image:url('../images/icons/icon_lupa_blue.png')}  

#topnav ul.nav li > a.lupa {display:inline-block;width:36px;border-radius:6px;background-position: 5px 5px}
#topnav ul.nav li > a.lupa:hover {background-color:#ff7800}

#topnav ul.nav1 {   display:inline-block    }
#topnav ul.nav2 {   display:inline-block    }

#topnav a.toggle-icon {  display: none;    }

#topnav .container {
        padding-right: 0px;
        padding-left: 0px;
}

#topnav ul.nav2 li.responsive {display:none;}

@media screen and (max-width: 1200px) {  
    #topnav #navcontainer {
        padding-top:6px;
        padding-left:0px;
        padding-bottom:6px;
        background-image:none;
    }
    
    #topnav ul.nav li > a.toggle-icon {
        font-size:130%;
        
        padding:6px 13px 0 6px;   
        
       display:inline-block
    }  
    
    #topnav ul.nav li > a.thumb_toggle {font-size:130%;background:#888;margin:4px}
    
    #topnav ul.nav1 {display:block;margin-top:45px}
    #topnav ul.nav1 li {display: none;}
    
    #topnav ul.nav2 {        
        position:absolute;
        right:0;top:0px;
    }
    #topnav ul.nav2 li.responsive {display:inline-block;}
    #topnav ul.nav2 li.anti-responsive {display:none;}
        
    /* Responsive - when toggle icon is clicked to show menu down*/
    #topnav.responsive {position: relative;}
    #topnav.responsive ul.nav1 li:first-child > a {border-top:1px solid #8cafd6;}
    #topnav.responsive ul.nav1 li {
      float: none;
      display: block;
      text-align: center;
      margin:0px;padding:0px
    }
    #topnav.responsive ul.nav1 li a {
        border-left:none;
        border-bottom:1px solid #8cafd6;
    }
    
    
}


#topnav .brand  {
    width:144px;
    position:absolute;
    z-index:300;
    top:-40px;
    left:-12px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

#topnav .brand img {
    width:100%;
    
}

/* STICKNESS   ========================  */
#topnav.sticky  {
    background:#0a3565;
    
}
#topnav.sticky {
    position: fixed;
    width:100%;
    top: 0px;        
  }
#topnav.sticky + #main-slider {
  /*padding-top: 50px;*/
}
#topnav.sticky .brand  {
    width:110px;
    top:0px;
    left:-3px;
        
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}
#topnav.sticky.nav-up .brand {
    width:70px;
}
/* STICKNESS   ========================  */

@media screen and (max-width: 600px) {  
    header {
        display:none;
    }
    #topnav .brand {
        top:0px;
        left:-2px
    }
    #topnav .brand,
    #topnav.sticky .brand  {
        width:70px;
    }
    #topnav ul.nav2 li a {
        font-size:80%;
    }
}





/*************************************************
*************** TOP NAVIGATION END ****************
**************************************************/


#main-slider {
    overflow: hidden;
    margin-top:20px;
    height:400px;
    position:relative;
    /*background:#e2f1fc;*/
   /* position:absolute;
    top:120px;*/
  }
  #main-slider .head {
      position:absolute;
      width:100%;height:100%;z-index:10;
      pointer-events:none;
      background: rgba(10,53,101,0.3);
      
      
  }
  
  #main-slider .head h1 {
      
      color:white;
      font-weight:bold;
      font-size:46px;
      text-shadow: 2px 2px 10px #000000;
      text-transform: uppercase;
  }
  @media (max-width:800px){
      #main-slider .head h1 {font-size:30px;}
  }
  
  
  #main-slider .item {
    height: 558px;
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
  }
  #page #main-slider .item {
    height: 400px;

  }
  .carousel-content {
      text-align:right;
      height:100%;
  }
  .carousel-content button {

  }
  #main-slider .slider-inner {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    color: #fff;
  }
  #main-slider .slider-inner  {
      position:absolute;

  }
  #main-slider .container.slider,
  #main-slider .row.slider,
  #main-slider .container .col-slider
  {
      height:100%
  }
  #main-slider a.button {
      position:absolute;
      bottom:-50px;
      right:10px;
      /*visibility:hidden;opacity: 0;*/
       -webkit-transition: visibility 0s, opacity 0.5s linear, bottom 0.5s,background-color .5s;;
      -moz-transition: visibility 0s, opacity 0.5s linear, bottom 0.5s,background-color .5s;;
      -o-transition: visibility 0s, opacity 0.5s linear, bottom 0.5s,background-color .5s;;
      transition: visibility 0s, opacity 0.5s linear, bottom 0.5s,background-color .5s;;
  }
  #main-slider:hover a.button {
      bottom:20px;
      /*visibility:visible;opacity: 1;*/
  }
  #main-slider .slider-inner h2 {
    margin-top: 180px;
    font-size: 36px;
    line-height: 1;
    text-transform: uppercase;
    color: #fff;
  }
  #main-slider .slider-inner h2 > span {
    color: #45aed6;
  }
  #main-slider .slider-inner .btn {
    margin-top: 10px;
  }
  #main-slider .owl-prev,
  #main-slider .owl-next {
    position: absolute;
    top: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 30px;
    display: inline-block;
    margin-top: -35px;
    height: 70px;
    width: 70px;
    line-height: 70px;
    text-align: center;
    border-radius: 100px;
    z-index: 5;
    -webkit-transition: background-color 400ms;
    transition: background-color 400ms;
  }
  #main-slider .owl-prev:hover,
  #main-slider .owl-next:hover {
    background-color: #45aed6;
  }
  #main-slider .owl-prev {
    left: -35px;
    text-indent: 14px;
  }
#main-slider .owl-next {
  right: -35px;
  text-indent: -14px;
}
#bar {
  width: 0%;
  max-width: 100%;
  height: 4px;
  background: #45aed6;
}
#progressBar {
    display:none;
  margin-top: -4px;
  position: relative;
  z-index: 999;
  width: 100%;
  background: rgba(0, 0, 0, 0.1);
}

.owl-pagination { /*PW*/
     position:absolute;
        bottom:0px;
        left: 0;
        right: 0;
        text-align: center;
}


/***********************
********* DLA KOGO ******
************************/

#dla_kogo {padding-top:50px;
           padding-bottom:20px}
.box-for {background-position: center center;
          background-size: cover;
         min-height:170px;
         margin-bottom:30px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        border-radius: 8px;}

.box-for .wrap  {text-align:center;position:relative;top:-20px;font-size:24px;}
.box-for .wrap span {background:#0451a5;
                  margin:0 auto;
                  padding:8px 14px;
                 color:white;
                 font-weight:bold;
                 font-size:80%;
                 text-transform:uppercase;
                 display:inline-block;
                 -webkit-border-radius: 4px;
                 -moz-border-radius: 4px;
                 border-radius: 4px;}
.projektanci {background-image:url('../images/dla-kogo-projektanci.jpg');}
.wykonawcy {background-image:url('../images/dla-kogo-wykonawcy.jpg');}
.uslugi {background-image:url('../images/dla-kogo-uslugi.jpg');}

/***********************
********* JAK DZIALA ******
************************/

#jak-dziala {
padding-top:65px;padding-bottom:65px}
p.jak-dziala {font-size:130%;color:#333;;line-height:1.3em;}

#jak-dziala h2.column-title{font-weight:bold;font-size:200%;color:#05366b;border:none;padding-bottom:3px}

.jak-dziala-thumb {margin-bottom:30px;
   -webkit-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);}
.jak-dziala-thumb:hover {
    scale-webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);    
}
.porady-col-pic:hover  {
    display:inline-block;
    scale-webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);   
}
.jak-dziala-thumb img {width:100%}
#jak-dziala button {font-size:150%;
padding:10px 20px;}
@media screen and (max-width: 768px) { 
    #jak-dziala button {margin-bottom:40px;}
    #jak-dziala div {text-align:center}
    .jak-dziala-thumb img {width:80%}
}

.light-box {
    border:1px solid #ddd;  
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
.light-box:hover {
    border:1px solid #b4c2d2;
    background:#fff;    
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    z-index:200;
    -webkit-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    -moz-transform: scale(1.04);
-webkit-transform: scale(1.04);
-o-transform: scale(1.04);
-ms-transform: scale(1.04);
transform: scale(1.04);
}

/***********************
********* PRODUKTY KAT #111111111111******
************************/

.kat-wrap1 {    
    border:1px solid #eee;  
    float:left;
    width:20%;
    min-height:270px;   
}

.kat-nazwa1 { -webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.kategorie_wrap {visibility:hidden}

/* #222*/

.kat-wrap2 {    
   
    min-height:314px;   
}

.kat-wrap2 span {
    font-weight:normal;
    text-align: center;
    display:block;
    font-size:120%;
    margin-bottom:10px;
    padding:0px 5px;
}
@media (max-width:700px) {
    .kat-wrap2 span {font-size:115%;}
}
.kat-box2 {
    padding-bottom:15px;
    padding-left:0px;
}

h4.kategoria_nazwa {color:#f3871e;font-size:140%;text-transform:uppercase;
padding-bottom: 20px;
margin: 0px 0 20px;
border-bottom: 1px solid #b4c2d2;}
.produkty-grid {
    padding-bottom:50px;
}

.kat-pic {
    text-align:center
}
.kat-pic img {
    display: inline;
    width:94%;
    max-width:450px;
}

/***********************
********* PRODUKTY ******
************************/


#produkty {  padding: 60px 0; }
.section-header {position:relative; }


#produkty .section-header {margin-bottom:0px }
.lista-produktow {display:none;}
#produkty .produkt-item {
  width: 20%;
  float: left;
  padding: 10px 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  border-left:1px solid #ccc;
  /*min-height:430px*/
}

@media screen and (max-width:1000px) {
    #produkty .produkt-item { width:24.9%}
}
@media screen and (max-width:768px) {
    #produkty .produkt-item { width:33.3%}
}
@media screen and (max-width:600px) {
    #produkty .produkt-item { width:50%}
}


#produkty .produkt-item,
.produkt-member {
    padding-top:10px;
   
    padding-left:12px;
    margin-bottom:15px;
}
#produkty .produkt-item.first {
    /*border-left-color:#fff*/
}
#produkty .produkt-item:hover,
.produkt-member:hover {
    border:1px solid #b4c2d2;
    background:#fff;
    /*background:#efefef;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;*/
    z-index:200;
    -webkit-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    box-shadow: 6px 11px 20px 0px rgba(0,0,0,0.2);
    margin-top:-1px;
    margin-left:0px;
    margin-right:0px;
}



#produkty .row .prod {
    margin-bottom:22px
}
#prod-filtry {
    
}
#prod-filtry a {
    padding:4px 8px;
    color:#05366b;
    font-weight:bold;
    font-size:15px;
    display:inline-block
    
}
#prod-filtry a.active {
    color:#fff;
    background:#0451a5;
    
}
.prod-img {text-align:center;height:280px;display:table-cell;vertical-align:middle}
@media screen and (max-width:900px) {
    .prod-img {height:170px;}
}
@media screen and (max-width:700px) {
    .prod-img {eight:150px;}
}
.prod-img .img-responsive {max-width:80%;display:inline}


#content #produkty {padding-bottom:40px}

#content #produkty h3 {color:#05366b;font-size:30px;margin-top:0 }

#content #produkty .produkt-info .ceny {margin-top:5px}
#content #produkty .produkt-info .cena_netto {
    padding-top:6px;margin:0;font-size:140%;font-weight:600;color:#05366b
}
.net-brut {color:#999;font-weight:normal}
.cena_brutto {font-size:120%;font-weight:600;color:#05366b}

#content #produkty .produkt-info {line-height:1.4em;min-height:175px}

.produkt-info a  {
    font-size:108%;    
    color:#333;
}
.produkt-info a:hover  {
    color:#2a95be;
}



.prod-more {display:none}
.produkt-item:hover .prod-more {display:block}
/* TABS */ 

div.tabs_wrap {margin-left:-1px; margin-right:-1px;}
ul.tabs_btns {display:table;margin:0;padding:0;width:100%;list-style: none;}
ul.tabs_btns li {
	display:table-cell;
	border:1px solid transparent;
	border-bottom-color:#b4c2d2;
	text-align:center;
	margin:0;padding:10px 5px;
	cursor:pointer;
	font-size:108%;
        font-family:'Roboto';
	font-weight:normal;
        color:#222;
        -webkit-border-radius: 4px 4px 0 0 ;
        -moz-border-radius: 4px 4px 0 0 ;
        border-radius: 4px 4px 0 0 ;
	/*background:#f3f5fb*/
	}
        ul.tabs_btns li:hover {color:#2e82b8}
ul.tabs_btns li.active {border:1px solid #b4c2d2;border-bottom-color:transparent;background:#fff}
div.tabs_contents {border:1px solid #b4c2d2;border-top:none;margin-left:-1px; margin-right:-1px;}
div.tabs_contents2 {}
div.tab_content {display:none;padding:20px}
div.tab_content.active {display:block}
.nothing {display:none;text-align:center;padding:100px}
.loading {text-align:center;padding:100px}

.nagrody {
    
    margin-bottom:10px;padding:12px 0;
    
    -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        color:#fff;
        background:url('../images/bg-nav-grad.jpg') no-repeat center center #0a3565; 
        background-size: cover
}
.prod_nr {backgroundX:#ccc;color:#888;;font-weight:normal;font-size:60%;text-transform:uppercase }
#zalaczniki {
    
    padding:10px;
}
div.block-right {
    float: right;
        width: 240px;
         margin-left: 10px;
     margin-bottom:300px;
}
div.quota,
.product-information p {
   
    /*font-weight:bold;*/
    /*background: #e5efff;*/
    /*font-size:120%;*/
    line-height: 1.6em;
    color: #102d6d;
    margin-top:0px;
    margin-bottom: 15px;
    border-top: 0px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px 0px;
    padding-top:0px;
}
div.quota2 {
    
   font-size:90%;
    background: #fff;
    
    line-height: 20px;
    color: #102d6d;
   
    margin-bottom: 15px;
    border: 1px
    solid #ccc;
    padding: 10px
}
#content #produkty div.quota2 h3 {
    margin:0px;
    padding-bottom:10px;
    font-size:130%
}
div.underlined {
    border-bottom: 1px solid #c7d9f5;
    margin-bottom: 3px;
    padding:8px 2px;
    clear:both;
}

/********************************
********* PRODUKTY FILRY ******
*********************************/
#produkty .produkty-filter-wrap {
     position:absolute;right:0px;top:0px;
      z-index:200;
}

#produkty .produkty-filter {
   
  list-style: none;
  padding: 0;
  margin: 0 0 50px;
  display: inline;
 
}
@media screen and (max-width:768px) {
    #produkty .produkty-filter-wrap {
        position:relative;
        display:block;
        margin-bottom:15px
    }
    #produkty .produkty-filter {
    
    margin:0 auto;
    text-align:center;
    padding-bottom:30px;
    }
    
}
#produkty .produkty-filter > li {
  float: left;
  display: block;
}
#produkty .produkty-filter > li a {
  display: block;
  padding: 7px 15px;
  background: #e5e5e5;
  color: #64686d;
  position: relative;
  font-weight:bold;
    font-size:15px;
}
@media screen and (max-width:768px) {  
    #produkty .produkty-filter > li a {    
        padding: 7px 7px;    
        /*font-size:13px;*/
  }
}

#produkty .produkty-filter > li a:hover,
#produkty .produkty-filter > li a.active {
  background: #0451a5;
  color: #fff;
  box-shadow: 0 -3px 0 0 #0451a5 inset;
  -webkit-box-shadow: 0 -3px 0 0 #0451a5 inset;
}
#produkty .produkty-filter > li a.active:after {
  content: " ";
  position: absolute;
  bottom: -17px;
  left: 50%;
  margin-left: -10px;
  border-width: 10px;
  border-style: solid;
  border-color: #0451a5 transparent transparent transparent;
}
#produkty .produkty-filter > li:first-child a {
  border-radius: 4px 0 0 4px;
  
}
#produkty .produkty-filter > li:last-child a {
  border-radius: 0 4px 4px 0;
}
#produkty .produkty-filter > li:only-child a {
  border-radius: 4px 4px 4px 4px;
}


.row.vidivide [class*='col-']:not(:last-child) :after {
    background:#444;
    width:1px;
    content:'';
    display:block;
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    min-height:70px;
}

#produkty-more {
    padding:50px 0px;
    background: #efefef
}


.prod-special {padding:4px 9px;background:#035896;text-transform: uppercase;margin-right:5px;color:#fff;font-size:14px;font-weight:bold}
.prod-special.p {background:#ff6633}
/***********************
********* PORADY ******
************************/


#porady {
    background:#0451a5;
    padding:50px 0px;
    padding-bottom:40px;
    color:white
}
#porady .section-header {
    padding-bottom:0px;
    margin-bottom:40px;
}
#porady  h3 {color:#fff;}

#porady h2.section-title {color:white;padding-bottom:10px}

.porady-col {
    text-align:left
}
@media screen and (max-width: 768px) {  
    .porady-col {
        text-align:center
    }
}
.porady-col p {line-height: 1.5em}
#porady img {max-width:300px;margin:0 auto}

.porady-blok {
    padding:0 10px
}
.porady-blok div {
    background-color:#5ebbff;
    color:black;
   padding:30px 20px;
   line-height:1.4em;
   -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.porady-blok h2 a {color:white}
.porady-blok a div {transition: background-color 400ms, background-color 400ms;}
.porady-blok a:hover div {background-color:#05366b;color:white}
.porady-blok h2 {
    display:block;
    font-size:130%;
    font-weight:normal;
    color:#fff;
    margin:0;
    margin-bottom:10px;
    /*padding-bottom:10px;*/
    line-height:1.3em;
    /*border-bottom:1px solid #c5e3f0;*/  
}
.porady-blok a.button {
    display:inline-block
}
.przypisy {font-size:80%}


/***********************
********* POBIERZ ******
************************/
.pobierz-blok {
     background-color:#5ebbff;
    color:black;
   padding:20px 20px;
   line-height:1.4em;
   -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-position:left bottom;
    background-repeat:no-repeat;
    background-size:60%;
    padding-bottom:150px;
    margin-bottom:20px;
    position:relative;
}
.pobierz-blok.inside {
    padding:25px 10px;margin:0px;
    background-size:130px;
}
.pobierz-blok.dwg {
    background-image:url('/_www2/images/porady_porady-dwg.png')
}
.pobierz-blok.specyfikacje {
    background-image:url('/_www2/images/porady_porady-specyfikacje.png') 
}
.pobierz-blok.karty {
    background-image:url('/_www2/images/porady_porady-karty.png')
}


.pobierz-blok h2 {
    display:block;
    font-size:25px;
    font-weight:normal;
    color:#fff;
    margin:0;
    margin-bottom:10px;
    /*padding-bottom:10px;*/
    line-height:1.3em;
    /*border-bottom:1px solid #c5e3f0;*/  
    /*background:url('/_www2/images/porady_download_arrow2.png') no-repeat left top ;*/
    background-size:25px;
    /*padding-left:30px;*/
}
.pobierz-blok.inside h2 {padding-left:115px;margin:0px;font-size:210%}
a .pobierz-blok  {
    color:white;    
    transition: all 0.2s;}
a:hover .pobierz-blok  {
    background-color:#0a3565;
transform:scale(1.06); -webkit-transform:scale(1.06); 
-moz-transform:scale(1.06); -o-transform:scale(1.06);}

.pobierz-blok .arrow {
    background:url('/_www2/images/porady_download_arrow2.png') no-repeat;
    background-size:25px;
    width:25px;height:25px;
    position:absolute;right:10px;bottom:10px;
    display:none;
}
.pobierz-blok button{
    font-size:90%;
    background-size:25px;
    background:#4f85c1;
    position:absolute;right:10px;bottom:10px;
}

/***********************
********* ZALETY ******
************************/

#zalety {
    padding:50px 0px
}
.zalety-icon {
    
     
    text-align:center;
    margin:0 auto;
}
.zalety-icon img {
    width:60%;
    max-width:130px;
    background:#0451a5;
    padding: 12px;
    -webkit-border-radius: 180px;
    -moz-border-radius: 180px;
    border-radius: 180px;
}
#zalety h3 {color:#05366b;font-size:150%;text-align:center}
#zalety p {text-align:center;line-height: 1.6em;color:#222;font-size:90%}
#zalety p.short {max-height:160px;overflow:hidden;}
#zalety p.full {display:none}
#zalety .more {bottom:20px;   }
/***********************
********* KONTAKT ******
************************/


#kontakt {
    padding:50px 0;
    
}
#kontakt .section-header { margin-bottom:0px;}
#kontakt .section-header h2 {border-bottom:none;padding-bottom:0px}
#kontakt input {padding:5px 10px;width:100%;}
#kontakt button {
    font-size:140%;padding:5px 14px
}
#kontakt p {
    color:black;
    line-height: 1.6em;
}
.kontakt-col {margin-bottom:15px}

.full-width {width:100%;}



.media.service-box {
  margin: 25px 0;
}
.media.service-box .pull-left {
  margin-right: 20px;
}
.media.service-box .pull-left > i {
  font-size: 24px;
  height: 64px;
  line-height: 64px;
  text-align: center;
  width: 64px;
  border-radius: 100%;
  color: #45aed6;
  box-shadow: inset 0 0 0 1px #d7d7d7;
  -webkit-box-shadow: inset 0 0 0 1px #d7d7d7;
  transition: background-color 400ms, background-color 400ms;
  position: relative;
}
.media.service-box .pull-left > i:after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  top: 50%;
  margin-top: -10px;
  right: -10px;
  border: 4px solid #fff;
  border-radius: 20px;
  background: #45aed6;
}
.media.service-box:hover .pull-left > i {
  background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -webkit-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -ms-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%);
  color: #fff;
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
  -webkit-box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.8);
}

/* Start: Recommended Isotope styles */
/**** Isotope Filtering ****/
.isotope-item {
  z-index: 2;
}
.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}
/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.notransit .isotope,
.notransit .isotope .isotope-item {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}
.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;
}
.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}
/* End: Recommended Isotope styles */
/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

.divider2 {
  margin-top: 15px;
  margin-bottom: 15px;
  background:#ccc;
  width: 100%;
  height: 1px;
}

.divider {
  margin-top: 50px;
  margin-bottom: 50px;
  background-image: -moz-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
  background-image: -webkit-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
  background-image: -ms-linear-gradient(180deg, #ffffff 0%, #e3e3e3 49%, #ffffff 100%);
  width: 95%;
  height: 1px;
}
.progress {
  -webkit-box-shadow: none;
  box-shadow: none;
  background: #eeeeee;
}
.progress .progress-bar.progress-bar-primary {
  background-image: -moz-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -webkit-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
  background-image: -ms-linear-gradient(4deg, #2caab3 0%, #2c8cb3 100%);
  -webkit-box-shadow: none;
  box-shadow: none;
}
.nav.main-tab {
  background: #eee;
  border-bottom: 3px solid #222534;
  border-radius: 3px 3px 0 0;
}
.nav.main-tab > li > a {
  color: #272727;
}
.nav.main-tab > li.active > a {
  background: #222534;
  color: #45aed6;
}
.nav.main-tab > li:first-child > a {
  border-radius: 3px 0 0 0;
}
.nav.main-tab > li:last-child > a {
  border-radius: 0 3px 0 0;
}
.tab-content {
  border: 1px solid #eee;
  border-top: 0;
  padding: 20px 20px 10px;
  border-radius: 0 0 3px 3px;
}
.panel-default {
  border-color: #eee;
}
.panel-default > .panel-heading {
  background-color: #fff;
  border-color: #eee;
}
.panel-default > .panel-heading .panel-title {
  font-size: 14px;
  font-weight: normal;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #eee;
}
#animated-number {
  padding: 100px 0 70px;
  background: #132125 url(../images/animated-number/bg.jpg) no-repeat 0 0;
  background-size: cover;
  color: #fff;
}
#animated-number h1,
#animated-number h2,
#animated-number h3,
#animated-number h4 {
  color: #fff;
}
#animated-number strong {
  display: block;
  margin-bottom: 30px;
}
.animated-number {
  display: inline-block;
  width: 140px;
  height: 140px;
  font-size: 24px;
  line-height: 140px;
  border: 3px solid #fff;
  border-radius: 100px;
  margin-bottom: 20px;
}

#contact {
  position: relative;
  overflow: hidden;
}
#contact .container-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(69, 174, 214, 0.3);
  z-index: 1;
}
#contact .contact-form {
  background: rgba(255, 255, 255, 0.8);
  padding: 20px;
  margin-top: 50px;
}
#contact .contact-form h3 {
  margin-top: 0;
}
/***********************
********* Footer ******
************************/
#footer {
  padding-top: 30px;
  padding-bottom: 30px;
  color: #999;
  background:#444;
  
}
#footer a {
  color: #999;
}
#footer a:hover {
  color: #45aed6;
}
#footer ul {
  list-style: none;
  padding: 0;
  margin: 0 -7.5px;
}
#footer ul > li {
  display: inline-block;
  margin: 0 7.5px;
}
#footer div.head {text-transform: uppercase;color:#fefefe;font-weight:bold;font-size:110%}
#footer a.line {display:block}


@media only screen and (min-width: 768px) {
  #footer .social-icons {
    float: right;
  }
}
.form-control {
  box-shadow: none;
  -webkit-box-shadow: none;
}


/*--------PAGE ------------*/


/* --REFERENCEJ */
.referencja_wstep { border-bottom: 1px solid #ccc;padding: 10px 0}


/*-----PREZENTACJE ------- */
div.pp_default .pp_description ,
div.pp_default .pp_description a {
    font-size:16px;
    font-style:normal;
    line-height: 1.3em;
    font-family:arial, sans-serif
}

.thumb-image {
    opacity: 1;
    display: inline-block;
    width:60%;
    height:auto;
    transition: .5s ease;
    backface-visibility: hidden;
    
}

.thumb-middle {
  pointer-events:none;
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  
}
.thumb-container {
    text-align: center
}
.thumb-container:hover .thumb-image {
  opacity: 0.3;
}

.thumb-container:hover .thumb-middle {
  opacity: 1;
}

.thumb-text {
  pointer-events:none;
  color: #0451a5;
  font-size: 66px;
  
}



/*********** TECHNOLOGIA ****************/
.table-zasada-penetracji td {padding:20px}



/***********************
********* GALERIA ******
************************/


.gallery-folder {
    display:table-row;
    height:260px;
    padding-right:10px;
    padding-left:15px;
}
.gallery-folder div.light-box {
    padding:10px;
    height:240px;
}
.gallery-folder:hover{}

.gallery-folder div.pic-crop {height:180px;overflow:hidden}
.gallery-folder img {
    
}
.gallery-folder span a {
    font-size:120%;
    color:#333;
    margin-top:10px;
    display:block;
    text-align:center;
}
.help-circle {
	border:1px solid #aaa;
	border-radius: 20px;
	padding:0px 8px;
	width:25px;
	height:25px;;
	background:#fff;
	position:absolute;right:10px;top:7px;
	cursor:pointer;
}
/*tooltip bootstrap*/
.tooltip-inner {
    max-width: 300px;
    padding: 6px 12px;
    color: #444;
    text-align: center;
    text-decoration: none;
    background-color: #ebf7ff;
    border-radius: 4px;
    border:1px solid #ddd;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.1);
    box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.1);;
}

.tooltip.bottom .tooltip-arrow {   
    border-bottom-color: #c9e5f8;
}

/*5 kolumn w bootstrap*/
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 11px;
    padding-left: 11px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}
/*
@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}
*/
@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
    .col-sm-5ths{
        width: 20%;
            float: left;
    }
}