body {
    height: 100%;
    font-family: 'roboto_slablight' !important;
    overflow-x: hidden;
    min-width: 340px; 
    font-size: 14px;
}

.container {
    /*min-width: 480px;*/
}

a {
    color:#1bc1d3;
}

a:focus { 
    outline: none; 
}

a.snap {
    margin-top: -70px;
    position: absolute;
}

a.snap-contact {
    margin-top: -140px;
}

p {
    margin: 0px 0 15px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'roboto_slablight' !important;
    font-style: normal !important;
}

#section2 .header,
#section3 .header,
#section4 .header,
#section5 .header
#section6 .header {
    margin-top: 0;
}

strong {
    font-family: 'roboto_slabregular' !important;
}



@font-face {
    font-family: 'roboto_slabbold';
    src: url('../fonts/robotoslab-bold-webfont.eot');
    src: url('../fonts/robotoslab-bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/robotoslab-bold-webfont.woff') format('woff'),
        url('../fonts/robotoslab-bold-webfont.ttf') format('truetype'),
        url('../fonts/robotoslab-bold-webfont.svg#roboto_slabbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'roboto_slablight';
    src: url('../fonts/robotoslab-light-webfont.eot');
    src: url('../fonts/robotoslab-light-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/robotoslab-light-webfont.woff') format('woff'),
        url('../fonts/robotoslab-light-webfont.ttf') format('truetype'),
        url('../fonts/robotoslab-light-webfont.svg#roboto_slablight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'roboto_slabregular';
    src: url('../fonts/robotoslab-regular-webfont.eot');
    src: url('../fonts/robotoslab-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/robotoslab-regular-webfont.woff') format('woff'),
        url('../fonts/robotoslab-regular-webfont.ttf') format('truetype'),
        url('../fonts/robotoslab-regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'roboto_slabthin';
    src: url('../fonts/robotoslab-thin-webfont.eot');
    src: url('../fonts/robotoslab-thin-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/robotoslab-thin-webfont.woff') format('woff'),
        url('../fonts/robotoslab-thin-webfont.ttf') format('truetype'),
        url('../fonts/robotoslab-thin-webfont.svg#roboto_slabthin') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* Rotate
------------------------------------------------------------------------------*/
.rotateX360,
.rotateY360,
.rotate10,
.rotate360,
.rotateX,
.rotateY180 {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;

    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;

    overflow:hidden;
}  

.div-circle:hover .rotate10 {
    -webkit-transform:rotate(10deg);
    -moz-transform:rotate(10deg);
    -o-transform:rotate(10deg);
}  

.rotate360:hover {
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg);
}  

.cont:hover .rotateX {
    -webkit-transform:rotateX(180deg);
    -moz-transform:rotateX(180deg);
    -o-transform:rotateX(180deg);
} 

.page-menu a:hover .rotateY180,
.box-centered:hover .rotateY180,
.cont:hover .rotateY180 {
    -webkit-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg);
    -o-transform:rotateY(180deg);
}

li:hover .client.rotateX360 {
    -webkit-transform:rotateX(360deg);
    -moz-transform:rotateX(180deg);
    -o-transform:rotateX(180deg);
} 

li:hover .client.rotateY360 {
    -webkit-transform:rotateY(-360deg);
    -moz-transform:rotateY(-360deg);
    -o-transform:rotateY(-360deg);
}  

/* navbar
------------------------------------------------------------------------------*/
.navbar {
    /*min-height: 80px;*/
    min-height: 60px;
}

.navbar-default {
    border:0;
    background: none;
}

.navbar-toggle {    
    padding:24px;
}

.navbar-default a {
    font-weight: bold;   
}

#nav {
    position: fixed;
    width: 100%;   
    top:0;
    background: #fff;
    z-index: 200;
    margin-bottom: 0;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);
}

.navbar,
nav.docked {
    margin-bottom: 0;
}



nav img  {
    margin-top: 10px
}

nav.docked img {
    margin-top: 20px
}

/*a.small-logo-top {
    position: absolute;
    top: 0;
    left: 0;
}*/

a.small-logo-top {
    background: url("../images/logo-top-226x97.svg") no-repeat scroll left center rgba(0, 0, 0, 0);
    background-size:80% auto;

    display: inline-block;
    height: 100%;
    left: 0;
    margin-left: 5px;
    position: absolute;
    text-indent: 9999px;
    top: 0;
    vertical-align: middle;
    white-space: nowrap;
    width: 226px;
}

.nav-justified {
    width:500px;
}

.navbar-nav .submenu {
    padding-left: 30px;
}

.navbar-nav .submenu a {    
    color:#777;
    text-decoration:none;
}

.navbar-default .navbar-nav>li>a {
    padding: 20px 15px;
}

.navbar-default .navbar-nav>li>a.docked {
    /*padding: 30px 15px;*/
    padding: 20px 15px;
}

.navbar-default .navbar-nav>li>a.active {
    color:#00e6ff;
}

.navbar-default .navbar-nav>li.top-menu-sep {
    padding-top: 30px;
    padding-top: 20px;
    color:#e4e4e4;
}

/* Wszystkie sekcje
------------------------------------------------------------------------------*/
.wrapper {
    width: 100%;
}

.header {    
    text-align: center;
    /*margin-top: 50px;
    margin-bottom: 60px;*/
    margin-top: 0px;
    margin-bottom: 20px;

}

.text {
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 60px;
}

.header h1 {
    line-height: 54px;
    font-size: 50px;
    font-family: 'roboto_slabthin' !important;    
}

.header h2 {
    font-size: 18px;
    font-family: 'roboto_slabbold' !important;
    color:#00e6ff;
    text-transform: uppercase;
}

/* Section1 - OFERTA
------------------------------------------------------------------------------*/
#section1 {
    /*margin-top: 70px;*/
    margin-top: 60px;
    color:#fff;    
}

#section1 h1 {
    margin-bottom: 20px;
}



.parallax-1 {
    background-position: center -400px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-color:#002468;
    /*background-image: url(../images/tlo2.jpg) ;*/
    background-image: url(../images/paralax/new-bg-1.jpg) ;
}

.parallax-2 {
    background-position: center -400px;
    background-repeat: no-repeat;
    background-image: url(../images/paralax/new-bg-2.png) ;
}

.parallax-3 {
    background-position: center -400px;
    background-repeat: no-repeat;
    background-image: url(../images/paralax/new-bg-3.png) ;
}

.parallax-4 {
    background-position: center -400px;
    background-repeat: no-repeat;
    background-image: url(../images/paralax/new-bg-4.png) ;
}


#section1 .box {
    height: 235px;
    margin-top: 0px;
}

#section1 .box h2 {
    padding: 5px 0 5px 70px;
    margin-right: -8px;
    margin-bottom: 8px;
    margin-top: 0px;
}

#section1 .box-centered {
    width: 290px;
    margin: 0 0 0 15px;
}

#section1 .box1 {
    background: url(../images/box_bg_1.png) no-repeat 50% 50%;
}

#section1 .box2 {
    background: url(../images/box_bg_2.png) no-repeat 50% 50%;
}

#section1 .box3 {
    background: url(../images/box_bg_3.png) no-repeat 50% 50%;
}

#section1 .box4 {
    background: url(../images/box_bg_4.png) no-repeat 50% 50%;
}

#section1 .box5 {
    background: url(../images/box_bg_5.png) no-repeat 50% 50%;
}

#section1 .box6 {
    background: url(../images/box_bg_6.png) no-repeat 50% 50%;
}

#section1 .box img{
    float: left;
    margin-left: -16px;
}

#section1 .box6 img{
    margin-left: 0;
}

#section1 .box6 h2 {
    padding-left:0;
    margin-left: 0;
    margin-bottom: 0;
    font-size: 30px;
    line-height: 40px;
}

#section1 .box-centered h2 {
    font-size: 24px;
    line-height: 30px;
}



#section1 .box-centered a {
    color:#fff;
    text-decoration: none;
}

#section1 .box-centered a:hover h2 {
    -webkit-transition: color 800ms linear;
    -moz-transition: color 800ms linear;
    -o-transition: color 800ms linear;
    -ms-transition: color 800ms linear;
    transition: color 800ms linear;
    color:#00e6ff;
}

#section1 .box-centered a p {
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 10px
}

#section1 .box-centered p {
    margin-bottom:8px;
}

#section1 .box-centered p.aqua {
    display: block;
    color:#00e6ff;    
    font-size: 12px;    
    margin-bottom: 8px;
}

#section1 .box-centered p.aqua a {    
    color:#00e6ff;  
}

#section1  .box6 .box-centered a:hover h2 {
    color:#fff;
}

#section1  .box6 .box-centered a:hover h2 strong{
    -webkit-transition: color 800ms linear;
    -moz-transition: color 800ms linear;
    -o-transition: color 800ms linear;
    -ms-transition: color 800ms linear;
    transition: color 800ms linear;
    color:#00e6ff;
}



/* OFERTA - Podstrona
------------------------------------------------------------------------------*/
.subpage {
    padding-top: 80px;
    padding-bottom: 160px;
}

.subpage .header {
    background: url(../images/oferta-header-bg.jpg) 50% 50% no-repeat #002266;
    margin-top: -50px;
    padding-top: 50px;
    /*padding-bottom: 40px;*/
    margin-bottom: 35px;
    text-align: left;    
    color: #fff;
}

.subpage .header.mobile {
    margin-top: -70px;
    text-align: center;   
}

.subpage .header h1 {
    line-height: 60px;
    font-size: 48px;
    margin: 35px 0;    
}

.subpage a.back {
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: none;
    font-family: 'roboto_slabregular';
    padding: 10px 20px;
    border: 2px solid #1bc1d3;
    margin: 43px 0;
    text-align: right;
    width: 125px;
    float: right;
    color: #fff;
    background:url(../images/back-arrow.png) 20% 50% no-repeat;
}

.subpage .header.mobile .back {
    float: none;
    margin: 30px auto;
}

.subpage a.back:hover {
    -webkit-transition: background-color 800ms linear;
    -moz-transition: background-color 800ms linear;
    -o-transition: background-color 800ms linear;
    -ms-transition: background-color 800ms linear;
    transition: background-color 800ms linear;
    color:#fff;
    border-color:#fff;
}

.page-content {
    /*font-size: 18px;*/
    line-height: 21px;
    color:#767676;
    min-height: 600px;
}

.page-content h2 {
    margin-top: 0;
    margin-bottom: 30px;
}

.page-content img {
    max-width: 100%;
    max-height: 100%;
}

.page-content .content ol,
.page-content .content ul {
    margin-bottom: 20px;
}


.page-content .content ol li,
.page-content .content ul li{
    list-style: none;
    margin-left: 30px;
    margin-bottom: 7px;
    list-style-type: disc;
}

.page-content .content ol li {
    list-style-type: decimal;
}

.page-content section.to-contact{
    float: left;
    margin: 30px 0;
    text-align: center;
    width: 100%;
}

.page-content section.to-contact div.holder {
    display: inline-block;
    margin: 0 auto;
    text-align: left;
}

.page-content section.to-contact div.holder h2 {
    font-size: 20px;
    margin-bottom: 10px;    

}

.page-content section.to-contact div.holder h2 a {
    color:#767676;  
    text-decoration: none;
}

.page-content section.to-contact div.holder h2 a strong{
    transition: 220ms all;
}

.page-content section.to-contact div.holder h2 a:hover strong{
    color: #1bc1d3;
}

.page-content section.to-contact div.holder img {
    
}

.page-cont {
  position: relative;
}

.page-menu {    
    width: 290px
  /*z-index: 1000;*/
}

.page-menu a {
    display: block;
    line-height: 18px;
    text-decoration: none
}

.page-menu li.level_0 ul {
    display: none;
}

.page-menu li.level_0.hasActive ul,
.page-menu li.level_0.active ul {
    display: block;
}

.page-menu li.level_0 a {    
    border:none;
    color:#fff;
    font-size: 15px;
    font-weight: bold;
    background-color: #1bc1d3;
    padding:23px 0 23px 55px;
}

.page-menu li.level_0.i_0 a {
    background: url(../images/side-menu1.png) 5px 40% no-repeat #1bc1d3;
}

.page-menu li.level_0.i_1 a {
    background: url(../images/side-menu2.png) 5px 40% no-repeat #1bc1d3;
}

.page-menu li.level_0.i_2 a {
    background: url(../images/side-menu3.png) 5px 40% no-repeat #1bc1d3;
}

.page-menu li.level_0.i_3 a {
    background: url(../images/side-menu4.png) 5px 40% no-repeat #1bc1d3;
}

.page-menu li.level_0.i_4 a {
    background: url(../images/side-menu5.png) 5px 40% no-repeat #1bc1d3;
}

.page-menu li.level_0 a:hover {
    background-color: #55E1F0;
}

.page-menu li.level_0.hasActive a,
.page-menu li.level_0.active a,
.page-menu a:hover  {
    background-color: #074c83;
    color: #fff;
}

.page-menu li.level_1  {  
    border-bottom: 1px solid #d8d8d8;
}

.page-menu li.hasActive li.level_1 a,
.page-menu li.active li.level_1 a,
.page-menu li.level_1 a{    
    font-weight: normal; 
    background: url(../images/side-menu-arrow.png) 20px 50% no-repeat #f1f1f1;
    font-size: 14px;
    color:#767676;
    padding: 10px 10px 10px 35px;
}

.page-menu li.hasActive li.level_1 a:hover, 
.page-menu li.active li.level_1 a:hover, 
.page-menu li.level_1 a:hover {   
    background: url(../images/side-menu-arrow.png) 20px 50% no-repeat #D3D3D3 !important;
}


.page-menu li.hasActive li.level_1.active a {
    color:#074c83;
    font-weight: bold;
}



/* Section2 - PORTFOLIO
------------------------------------------------------------------------------*/
#section2 {
    background:#fff;    
    padding-bottom:35px;
    position: relative;
    z-index: 10;
}

#section2 .portfolio-container{
    max-width: 2560px;
    margin:0 auto;
    overflow: hidden;
}

#section2 .header {
    margin-bottom:20px;
}

#section2 .portfolio-container .portfolio-holder {
    width:1650px;
    margin:auto;
}

#section2 .portfolio-container .our-portfolio {
    text-align:center;
    width: 100%;
    float: left;
}

#section2 .portfolio-container .slick-prev, 
#section2 .portfolio-container .slick-next {
    margin-top: -30px;
    height: 60px;
    width: 35px;
}

#section2 .portfolio-container .slick-prev {
    background: url(../images/arr-l.png) no-repeat;
    left: -50px;
}

#section2 .portfolio-container .slick-next {
    background: url(../images/arr-r.png) no-repeat;
    right:-50px;
}

#section2 .portfolio-container .slick-next:before, 
#section2 .portfolio-container .slick-prev:before{
    content:"";
}

#section2 .portfolio-container .slick-slide {
    margin:0 auto;
}

#section2 .portfolio-container .slick-slider .slick-track {
    margin-bottom: -10px;
}

#section2 .portfolio-container .slick-slide img {
    display: inline;
    transition: 300ms ease-in-out;
    width: 310px;
    height: 390px;
}

#section2 .portfolio-container .slick-slide a{
    display: block;
    position: relative;
    overflow: hidden;
    height: 390px;    
    margin-bottom: 20px;
}

#section2 .portfolio-container .slick-slide a span.circle {
    width: 80px;
    height: 80px;
    display: inline-block;
    background: #1bc0d2;
    border-radius: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: scale(0);
    margin: -40px 0 0 -40px;
    text-align: center;
    transition: 300ms ease-in-out;
}

#section2 .portfolio-container .slick-slide span.circle span.zoom-icon {
    display: inline-block;
    background: url('../images/loupe-icon.png') no-repeat;
    width: 27px;
    height: 27px;
    margin: 27px 0 0;
}

#section2 .portfolio-container .slick-slide a:hover span.circle {
    opacity: 0.95;
    transform: scale(1);
}

#section2 .portfolio-container .slick-slide a:hover img {
    opacity: 0.3;
}

.slick-dots li button:before {
    font-size: 30px;
}

/* Section2 - PORTFOLIO - NOWE
------------------------------------------------------------------------------*/

#section2 .portfolio-container .portfolio-new {
    text-align:center;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

#section2 .portfolio-container .portfolio-new .slick-prev, 
#section2 .portfolio-container .portfolio-new .slick-next {
    margin-top: 0;
    height: 100%;
    width: 95px;
    top: 0;
    opacity: 0;
    transition: 220ms all;
}

#section2 .portfolio-container .portfolio-new .slick-prev:hover, 
#section2 .portfolio-container .portfolio-new .slick-next:hover  {
    opacity: 1;
}

#section2 .portfolio-container .portfolio-new .slick-prev {
    background: url(../images/arr-w-l.png) no-repeat center center rgba(0, 37, 107, .8);
    left: 0px;
}

#section2 .portfolio-container .portfolio-new .slick-next {
    background: url(../images/arr-w-r.png) no-repeat center center rgba(0, 37, 107, .8);
    right:0px;
}

#section2 .portfolio-container .portfolio-new .slick-next:before, 
#section2 .portfolio-container .portfolio-new .slick-prev:before{
    content:"";
}

#section2 .portfolio-container .portfolio-new .slick-slide {
    margin:0 auto;
}

#section2 .portfolio-container .portfolio-new .slick-slider .slick-track {
    margin-bottom: -10px;
}

#section2 .portfolio-container .portfolio-new .slick-slide img {
    display: inline;
    transition: 300ms ease-in-out;
    width: 100%;
    max-width: 480px;
    height: auto;
}

#section2 .portfolio-container .portfolio-new .slick-slide a{
    display: block;
    position: relative;
    overflow: hidden;
    height: auto;    
    margin: 0;
}

#section2 .portfolio-container .portfolio-new .slick-slide a span.circle {
    width: 80px;
    height: 80px;
    display: inline-block;
    background: #1bc0d2;
    border-radius: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: scale(0);
    margin: -40px 0 0 -40px;
    text-align: center;
    transition: 300ms ease-in-out;
}

#section2 .portfolio-container .portfolio-new .slick-slide span.circle span.zoom-icon {
    display: inline-block;
    background: url('../images/loupe-icon.png') no-repeat;
    width: 27px;
    height: 27px;
    margin: 27px 0 0;
}

#section2 .portfolio-container .portfolio-new .slick-slide a:hover span.circle {
    opacity: 0.95;
    transform: scale(1);
}

#section2 .portfolio-container .portfolio-new .slick-slide a:hover img {
    opacity: 0.3;
}

#section2 .portfolio-container .portfolio-new .slick-dots li button:before {
    font-size: 30px;
}

/* Section3 - KLIENCI 
------------------------------------------------------------------------------*/
#section3 {
    background:#fff;    
    /*padding-bottom:70px;*/
    position: relative;
    z-index: 10;
}

#section3 .header {
    margin-bottom:10px;
}

#section3 div.banners,
#section3 div.banners ul {
    float: left;
}


#section3  div.banners ul li  {
    text-align: center;
    padding:0;
    overflow: hidden;
}

#section3  div.banners ul li div.img_wrapper {
    position: relative;
}

#section3 div.banners ul li div.img_wrapper img {
    left: calc(50% - 100px);
}

#section3 div.banners ul li img {
    opacity: 0.5; 
    transition: all 0.5s ease;
}

#section3 div.banners ul li img:hover {
    opacity: 1; 
    transition: all 0.5s ease;
}

#section3 div.banners ul li img.mobile{
    width: 150px;
}

/*
#section3 li img {
    opacity: .5;  
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");  //Firefox 10+, Firefox on Android 
    filter: gray;  //IE6-9 
    filter: grayscale(1);
    -webkit-filter: grayscale(1); // Chrome 19+, Safari 6+, Safari 6+ iOS 
    transition: all 2.5s ease;
    -webkit-transition: all 2.5s ease;
    -moz-transition: all 2.5s ease;
        -ms-transition: all 2.5s ease;
         -o-transition: all 2.5s ease;
            transition: all 2.5s ease;
}

#section3 li img:hover {
    opacity: 1;
    transition: opacity .25s ease;
    -webkit-transition: opacity .25s ease;
    -moz-transition: opacity 0.25s ease;
        -ms-transition: opacity 0.25s ease;
         -o-transition: opacity 0.25s ease;
            transition: opacity 0.25s ease;
    
}

#section3 li img.color:hover {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: gray; // IE6-9 
    filter: grayscale(0);
    -webkit-filter: grayscale(0); // Chrome 19+, Safari 6+, Safari 6+ iOS 
    transition: all 0.25s ease;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
        -ms-transition: all 0.25s ease;
         -o-transition: all 0.25s ease;
            transition: all 0.25s ease;
}

*/
/*#section3 li.color{
    text-align: center;
    padding:0 0 40px 0;
    opacity: .5;     
-webkit-transition: opacity 1250ms ease-in-out;
       -moz-transition: opacity 1250ms ease-in-out;
        -ms-transition: opacity 1250ms ease-in-out;
         -o-transition: opacity 1250ms ease-in-out;
            transition: opacity 1250ms ease-in-out;
}


#section3 li.color:hover  {
    opacity: 1;
    -webkit-transition: opacity 1250ms ease-in-out;
       -moz-transition: opacity 1250ms ease-in-out;
        -ms-transition: opacity 1250ms ease-in-out;
         -o-transition: opacity 1250ms ease-in-out;
            transition: opacity 1250ms ease-in-out;
}*/





/*li img.client {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");  Firefox 10+, Firefox on Android 
    filter: gray;  IE6-9 
    filter: grayscale(1);
    -webkit-filter: grayscale(1);  Chrome 19+, Safari 6+, Safari 6+ iOS 
    -webkit-transition : -webkit-filter 1250ms linear;  
    -webkit-transition: opacity 1250ms ease-in-out;
       -moz-transition: opacity 1250ms ease-in-out;
        -ms-transition: opacity 1250ms ease-in-out;
         -o-transition: opacity 1250ms ease-in-out;
            transition: opacity 1250ms ease-in-out;
}*/

/*img.client,*/
/*li.color:hover img.client {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: gray;  IE6-9 
    -webkit-filter: grayscale(0);  Chrome 19+, Safari 6+, Safari 6+ iOS 
    -webkit-transition: opacity 1250ms ease-in-out;
       -moz-transition: opacity 1250ms ease-in-out;
        -ms-transition: opacity 1250ms ease-in-out;
         -o-transition: opacity 1250ms ease-in-out;
            transition: opacity 1250ms ease-in-out;
}*/


/* Section4 - O NAS
------------------------------------------------------------------------------*/
#section4 {
    color:#fff;
    position:relative;
    
}

#section4 .parallax-4 {
    padding-bottom: 120px;
}

.parallax-section4 {
    background-position: center -800px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-color:#002468;
}

#section4 .parallax-2 {
    background-image: url(../images//paralax/new-bg-2a.png) ;
}

#section4 .cont {
    text-align:center;
    position: relative;
    z-index: 100;
}

#section4 .cont .photo-border {
    position: relative;
    z-index: 0;
}

#section4 .cont .photo {
    position: absolute;
    top: 0;
    margin: auto;
    left: 0;
    right: 0;
    z-index: 0;
}

#section4 .cont .photo img,
#section4 .cont .photo-border img {
    position: relative;
    z-index: 0;
}

#section4 .cont .text {
    font-size: 18px;
    line-height: 20px;
    font-family: 'roboto_slabregular';
}

#section4 .cont .text span {
    color:#1bc1d3;
}

/* Section5 - KONTAKT
------------------------------------------------------------------------------*/
#section5 {
    background:#002468;
    position: relative;
}


#section5 a, 
#section5 a:hover {
    color:#fff;
    text-decoration: none;
}

#section5 #map {
    clear: both;
    width: 100%;
    height: 750px;
    color: #333;
    position: relative;
    line-height: 13px;
}

.div-circle {
    border-radius: 50%;
    height: 422px;
    left: calc(50% - 211px);
    position: absolute;
    top: -112px;
    width: 422px;
    z-index: 10;
    text-align: center;
    color:#fff;
}

.div-circle h2 {
    font-size: 24px;
    line-height: 32px;
    font-family: 'roboto_slabbold' !important;
    margin: 25px 0 0 0;
}

.div-circle p {
    font-size: 24px;
    line-height: 32px;
    font-family: 'roboto_slablight' !important;
}

.div-circle p.bank {
    display: block;
    font-size: 20px;
}

.div-circle p.bank strong {
    font-size: 18px;
}

.div-circle p.text-circle {
    font-size: 18px;
    line-height: 24px;
}

.div-circle img {
    width: 100%;
    height: 100%;
}

.div-circle-inside {
    position:relative;
}

.div-circle-inside section,
.div-circle-inside .moduletable {
    position: absolute;
    top:0;
    left:0;
    right:0;    
}

.form {
    margin-top: 20px;    
}

#formSendMessage .form-control {
    border: none;
    border-radius: 0;
    font-family: 'roboto_slabregular';
    height: 50px;
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
    margin-bottom: 20px;
    position: relative;
    z-index: 50;
    /*width: 107%;*/
}

#formSendMessage .form-control input {}

#formSendMessage .form-control:focus{
    border: 3px solid #00e6ff !important;
}

#formQTopic {
}

.styled-select {
    overflow: hidden;
    margin-right: 1.5%;
    width: 48.5%;
}

.styled-select select {
   background: url(../images/select-down.jpg) no-repeat 95% 50% #fff !important;
   padding: 11px 12px;
   border: 3px solid #fff !important;
   font-size: 14px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 50px !important;
   -webkit-appearance: none;
   -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    width: 107%
}

#formSendMessage textarea.form-control {
    height: 150px;
    padding: 15px;
}

.red-border,
.styled-select select.red-border {
    border:3px solid red !important;
}

.captcha .red-border {
    padding: 12px !important;
}
.captcha .math {
    background: #fff;
    padding: 15px 10px 15px 26px;
    margin-bottom: 20px;
    text-align: right;
    position: relative;
}

.captcha .math span.spam a {
    background: url("../images/gwarancja.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    display: block;
    height: 100px;
    left: -5px;
    position: absolute;
    top: -24px;
    width: 154px;    
}

.captcha .math span.left {
   /* width: 56%; */
    display: inline-block;
    color: #1bc1d3;
}

.captcha .math span.right {
 /*   width: 34%; */
}

.captcha .math input {
    border: none;
    display: inline-block;
    width: 26px;
    text-align: center;
    border: 1px dotted #555;
}

button#wyslij {
    border: none;
    background: #002468;
    width: 100%;
    height: 52px;
    color: #fff;
    font-family: 'roboto_slabregular';
}

.notMobile {
    position: absolute;
    top:0;
    left:0;
    right:0;
}

.notMobile .form {
    position: absolute;
    top: 330px;
    
}

/*alert info*/
.ui-dialog .ui-dialog-titlebar-close {
    background: url(../images/close.png) no-repeat 50% 50% !important;
    border: none;
    
}

.ui-dialog .ui-dialog-content {
    font-family: 'roboto_slabregular';
    font-size: 16px;
}

.ui-dialog .ui-dialog-buttonpane button {
    border: none;
    background: #002468;
    color: #fff;
    font-family: 'roboto_slabbold';
    padding: 10px 20px;
}

#dlgDialogWarn {
    font-weight: bold;
    color:#8B0000;
}

.ui-widget-header {
    background: none;
}

.ui-dialog {
    box-shadow: none;
    border:3px solid #C9C9C9;
    border-radius: 0;
}

.ui-corner-all {
    
}

/* Section6 - FOOTER
------------------------------------------------------------------------------*/
#section6 {
    text-align: center;
    font-family: 'roboto_slabregular';
    background: url(../images/footer-bg.jpg) no-repeat 50% 50% #002468;
    padding: 16px 0 24px 0;
}

#section6 img {
    margin: 0 10px;
}

#section6 div.footer {
    float: left;
    width: 100%;
}

#section6 div.footer span.rights {  
    color:#1bc1d3;    
}


.parallax-mouse{
    width: 100%;
    overflow: hidden;
    left: 0;
}

.circles {
    position: absolute;
    width: 100%;
    height: 1600px;
    left:0;
    right:0;
    top:-400px;
    background-repeat: no-repeat;
    background-position: top center;
}

.affix {
  /*width: 210px !important; //helped keep the content the same size on fluid layouts*/
  position: fixed;
  top: 150px; 
  float: left
}
.affix-bottom {
  /*width: 210px !important;*/
  position: absolute;
  top: auto;
}



div.cookies-box {
    display: block;
    float: left;
    width: 100%;
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #1bc1d3;
    padding: 10px 20px;
}

div.cookies-box p {
    display: block;
    float: left;
    margin: 3px 0 0 0;
    margin:0;
    padding: 0;
    line-height: 31px;
    width: calc(100% - 50px);
}

div.cookies-box p a {
    color: #1bc1d3;
}

div.cookies-box p a:hover {
    text-decoration: underline;
}

div.cookies-box a.cookies-close {
    display: block;
    float: right;
    background: url('../images/close-icon.png') no-repeat scroll 100% 50% rgba(0, 0, 0, 0);
    width: 50px;
    height: 25px;
}