body {padding: 0; margin:0; background-color: #000000;} 
a:hover, a:active, a:focus {outline: none; }
html, body, input, textarea, select {font-family: 'Open sans', sans-serif;}
.txtContent p, .txtContent li {font-size: 30px;}
p, li, a {font-size: 16px;}
.center {text-align: center;}

#canvas1 {
	
		width: 100%;
		height: 100vh;
		background: #000000;
		position: fixed;
		z-index: -1;
}

.logo span {
    padding-left: 10px;
    font-family: Poppins;
    color: #fff;
    font-weight: bold;
    font-size: 17px;
}

.modal.in .modal-dialog {
		z-index: 1050;
}

.modal .modal-content > button.close {color:#555;font-size:2rem;position:absolute;top:2px;	right:10px;opacity:0.7;z-index:10}
.modal button.close:hover {opacity:1;color:#aaa}

#canvas1.canvas-black {background-color:#fff; position:absolute; top: 0; right: 0;}

.row.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
  padding-right: 0;
  padding-left: 0;
}

.captcha {
    background-size: contain;
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #fff !important;
}


.main-menu li:hover a {background-color: transparent; }
 
#mainNav.affix-top {background: transparent; border: none; transition-duration: 0.8s; transition-timing-function: ease-out;}
.page-portfolio #mainNav.affix-top {background-color: #000000;}
#mainNav.affix { z-index:10; background-color: #080808;  transition-duration: 0.1s; transition-timing-function: ease-out;}
#mainNav.affix .main-menu li a {color: #fff;}

.container-fluid {margin: 0; padding: 0;}

.navbar-header {display: none;}
.main-menu > li {line-height: 90px; float: none; display: inline-block; transition-duration: 0.3s;}
.main-menu li a {font-weight: 600;  font-family: Poppins; font-size: 14px; opacity: 1; transition-duration: 0.5s; transition-timing-function: ease-out; padding: 5px 8px; } 
.main-menu li a:hover, .main-menu li.active a, .main-menu > li.active > a:focus, .main-menu > li.active > a:hover {font-size: 20px; background: transparent;  transition-duration: 0.2s; transition-timing-function: ease-in;}
.main-menu li.active:first-child { opacity: 0; transition-duration: 0.3s; }
.nav > li > a:focus, .nav > li > a:hover {background-color:transparent;}


#mainNav.affix.firstTop .logo img {width: 60px; height: 60px; }
#mainNav.affix .main-menu > li {line-height: 45px; }

.section h1, .section-wrap h1 {font-size: 55px; padding: 0 0 33px 0; font-weight: 200; margin-bottom: 50px; margin-top: 0;}

.section h1 span.uTitle {display: block; margin-top: 20px; font-size: 30px;}
.section-white h1 {background:url('../img/border-short-black.png') no-repeat center bottom; color:#000;}
.section-white h1.no-line { background: none; padding-bottom: 20px; }
.section-black h1 {background:url('../img/border-short-white.png') no-repeat center bottom; color:#fff;}
.section-black p {color:#fff;}
.section-black.add-transparent {background:transparent;}
.text-left h1 {background-position: left bottom;}

#topGallery {position: absolute; width: 100%; height: 100%; z-index: -1; top: 0; background-color: #fff;}
#topGallery.affix .carousel-inner .middleShortInfo {display: none;}
.carousel-inner, .carousel-inner > .item {height: 100%; text-align: center; width: 100%; overflow: hidden;}
.carousel-inner > .item {background-position: center top; background-size: cover; height: 100%; text-align: center; width: 100%; position: fixed;}
.carousel-inner > .item > .site-bg {background-size: cover; height: 100%; text-align: center; width: 100%; }
#topGallery img {height: 1080px; width: 1920px;  max-height: 1080px; max-width: 1920px; min-height: 1080px; min-width: 1920px; display: inline;}


.section-home h2 { font-family: Poppins; position: absolute; text-align: center; width: 80%; left:50%; margin-left: -40%; top: 40%; font-size: 90px; }
.firstTop .logo img {color: #000000; width: 100px; height: 100px; transition-duration: 0.3s; }



.firstTop ul li a {color: #fff;}
.secondTop ul li a {color: #fff;}
.secondTop {background-color: #000000;}

.topWrap .top {max-width: 1300px; min-width: 500px; margin: 0 auto; padding: 20px 0 20px;}

.bottomTxt { max-width: 1300px; margin: 0 auto;}

.slick-prev {
	left: 40px;
	font-family: sans-serif;
	z-index:1;
}

.slick-next {
	right: 40px;
	font-family: sans-serif;
	z-index:1;
}



.section-home a.goDown {display: block; height: 40px; background-color: transaprent; background: url('../img/arrow-down-white.png') no-repeat center top; position: absolute; top: -40px; left: 0; width: 100%;}
.section { max-width: 1350px; margin: 0 auto; padding: 30px 0 50px 0;  min-height:90vh; display: block;}
.section.short {  min-height:0; }
#co_robimy {padding-bottom: 0; padding-bottom: 100px; 

background: rgba(0,0,0,0.6);
background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.6)), color-stop(100%, rgba(0,0,0,1)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000', endColorstr='#000', GradientType=0 );


 overflow-x:hidden;}
.section-short { min-height:50vh;} 
.section-first { background: transparent; background-attachment: fixed;  background-size: cover; padding: 30px 0; z-index: 999;}
.section-first h1, .section-first p {color:#fff;}
.section-white a.goDown {display: block; height: 40px; background-color: transaprent; background: url('../img/arrow-down-white.png') no-repeat center top; position: absolute; top: -40px; left: 0; width: 100%;}
.section-white { background-color: #fff; color: #000; position: relative;}
.section-black { background-color: rgba(0,0,0,1); color: #fff; position: relative;}
.section-black a.goDown {display: block; height: 40px; background-color: transaprent; background: url('../img/arrow-down-black.png') no-repeat center top; position: absolute; top: -40px; left: 0; width: 100%;}
#portfolio.section-black a.goDown {background-image: url('../img/arrow-down-white.png');}
.page-portfolio #portfolio  {padding-top: 120px;}
.section-white .section {color: #fff;}
.section-home { height: 100vh; background:transparent;}
.section-home  a.goDown { top: auto; bottom: 80px; background: url('../img/arrow-down-black.png') no-repeat center top; } 

.section-home.section-white {background:transparent;}


.slick-prev::before {content: " "; display: block; background:url('../img/arr-left.png') no-repeat center top; background-repeat: no-repeat; width: 34px; height: 34px;}
.slick-next::before {content:" "; display: block; background:url('../img/arr-right.png') no-repeat center top; background-repeat: no-repeat; width: 34px; height: 34px;}
.slick-prev, .slick-next, .slick-count { display: block; top: 25px; position: absolute; z-index: 998;}
.slick-prev {left: 1%; z-index: 999; }
.slick-next {right: 1%; z-index: 999; }

.slick-count {
	left: 0;
	width: 100%;
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 300;
	text-align: center;
	color: #222;
	top: 10px;
	font-size: 20px;
	
}
.slick-prev, .slick-next {  width: 34px;}
.slick-count span {
font-size: 25px;
color: transparent;
display: inline-block;
vertical-align: top;
border-left: 1px solid #111;
transform: rotate(25deg);
margin-left: 5px;
}

.slick-navbar-inner {height: 50px; width: 160px; position: relative; margin: 0 auto;}
.slick-navbar {height:0; width: 100%; transition-duration: 0.3s; border-bottom: 1px solid #e7e7e7;}
.slick-navbar.live {height: 50px; width: 100%; background-color:#fff; transition-duration: 0.3s; }

.middleShortInfo > .info {position: unset;}
.middleShortInfo {margin:70px 0; text-align: right;  background-color: #f8f8f8; position: relative;}
.middleShortInfo h3 {font-size: 14px; color:#000;} 
.middleShortInfo h1 {font-size: 35px; font-weight: 700; padding: 0; font-weight: 500; margin: 0.6vw 0; color:#000; background: transparent;}
.middleShortInfo .info-up p {font-weight: 300; padding: 0; line-height: 22px; font-size: 16px; width: 80%; float: right; margin-top: 10px; color:#000;}
.middleShortInfo .info-up p>strong {font-weight: 700; line-height: 20px; font-size: 16px;}
.middleShortInfo a {font-size: 16px; font-weight: 600;  color:#000;}
.middleShortInfo .info { background-color: #f8f8f8;}

.info-up {margin-top: 3vw;}

.info-down {position: absolute; bottom: 2vw; right: 66.666%; border-right: 1px solid #fff; padding: 0 20px 0 0; min-height: 100px;} 
.info-down span {color:#7b7b7b;}
.middleShortInfo .info-down p {font-weight: 700; padding: 0; line-height: 21px;font-size: 12px; color: #000;}
.portfolio .p-item {
	background-color: #000000;  background-size: cover; padding: 0px 0;
	
	position:relative;
	
}
.bilboard-bg {
    background-size: cover;
    height: 90vh;
}

.middleShortInfo.bilboard-bg .info {background: transparent;}
.bilboard  img {width: 100%;}

.portfolio .p-item > a {
	position:absolute;
	bottom: 70px;
	left: 20px;
	color: #000000;
	font-weight: bolod;
	font-size: 30px;
}

.portfolio .p-item > a:before { content: "\2022"; padding-right:7px; font-size: 40px;}
.portfolio {height: 0; opacity: 0; transition-duration: 0.3s; transition-timing-function: ease-out; margin-bottom: -20px;}
.portfolio.live { height: auto; opacity:1; transition-duration: 0.3s; transition-timing-function: ease-out;}


#portfolio .section {padding: 0;  min-height: 0; }
#portfolio .section, #portfolio-kafle .section {width: 100%; max-width: 100%; }
#portfolio-kafle .folio-item {padding: 0; margin: 0; position: relative; background-color:#fff;}
#portfolio-kafle .folio-item img {padding: 0; border: none; border-radius: 0; width: 100%;}
#portfolio-kafle .folio-item:hover img {opacity:0.5; }

#portfolio-kafle a.goDown {display: block; height: 40px; background-color: transaprent; background: url('../img/arrow-down-white.png') no-repeat center top; position: absolute; top: -40px; left: 0; width: 100%;}
#portfolio-kafle .folio-item p { z-index:1; }
#portfolio-kafle .folio-item p.item-info {position: absolute; top: 25px; left: 15px; font-weight: 600; font-size: 18px;}
#portfolio-kafle .folio-item p.work-type {position: absolute; top: 5px; left: 15px; font-weight:100; font-size: 16px;}
.text-white p {color:#000000;}
.text-black p {color:#fff;}
#portfolio-kafle .folio-item:hover p {opacity:1;  color:#000000;}


#about, #co_robimy, #portfolio-kafle, #klienci, #actualizer, #kontakt {padding-top: 0; padding-bottom: 0;}
#about > div, #klienci > div, #actualizer > div, #kontakt > div {padding-top: 7vh; padding-bottom: 0;}
#co_robimy > div {padding-top: 10vh; padding-bottom: 70px; min-height: 0;}
#portfolio-kafle .section {padding-top: 0;}
.folio-pusher {height:30px; width: 100%; content: " ";}

.sectionHeadLogo {margin-top: 15%; margin-bottom: 10%;}

.arrow {list-style: none; padding-left: 0;}
.arrow li {font-size: 30px; font-weight: 200; display: block; margin: 7px 0; }
.arrow li:before {background:url(../img/arrow.png) no-repeat left center; content:" "; width: 33px; height: 20px; line-height: 30px; display: inline-block;}
.section-black .arrow li:before {background-image:url(../img/arrow-w.png); }
.lTxt {color: #000000; font-size: 45px; font-weight: 300; max-width: 1270px; margin-right: auto; margin-left: auto; text-align: justify; -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;}

.klienty img {display: inline-block; max-height: 100px; margin: 3%; opacity: 0.6; filter:saturate(0); max-width: 217px; transition: all 0.5s ease; } 
.klienty img.bit-smaller { max-height: 65px;}
.klienty img:hover { filter:saturate(1); opacity: 1; }
.logo-home { display: none; }

.btn, form .form-group textarea, form .form-group input, input.form-control, .breadcrumb {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

#form_contact label {
    display: none;
}


.btn-primary { 
  color: #000000; 
  background-color: #d2d2d2; 
  border-color: #d2d2d2; 
} 
 
.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary { 
  color: #000000; 
  background-color: #fff; 
  border-color: #d2d2d2; 
} 
 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary { 
  background-image: none; 
} 
 
.btn-primary.disabled, 
.btn-primary[disabled], 
fieldset[disabled] .btn-primary, 
.btn-primary.disabled:hover, 
.btn-primary[disabled]:hover, 
fieldset[disabled] .btn-primary:hover, 
.btn-primary.disabled:focus, 
.btn-primary[disabled]:focus, 
fieldset[disabled] .btn-primary:focus, 
.btn-primary.disabled:active, 
.btn-primary[disabled]:active, 
fieldset[disabled] .btn-primary:active, 
.btn-primary.disabled.active, 
.btn-primary[disabled].active, 
fieldset[disabled] .btn-primary.active { 
  background-color: #d2d2d2; 
  border-color: #d2d2d2; 
} 

.mobile-only {display: none;}

 
.btn-primary .badge { 
  color: #d2d2d2; 
  background-color: #000000; 
}
@media (max-width: 1200px){
.main-menu > li > a {padding: 10px;}
.main-menu li a {font-size: 14px; }
.main-menu li a:hover, .main-menu li.active a, .main-menu > li.active > a:focus, .main-menu > li.active > a:hover {font-size: 18px; }
.lTxt {color: #000000; font-size: 45px;}

.middleShortInfo h1 {font-size: 28px;}
.middleShortInfo .info-up p {font-size: 12px; margin: 5px 0;}
.middleShortInfo .info-up p>strong {font-size: 14px;}
.middleShortInfo a {font-size: 14px; }
.info-up {margin-top: 2vw;}

.info-down {position: absolute; bottom: 2vw; right: 66.666%; border-right: 1px solid #fff; padding: 0 10px 0 0; min-height: 80px;} 

.middleShortInfo .info-down p {font-weight: 700; padding: 0; line-height: 18px;font-size: 11px; }
}

@media (max-width: 991px){
.main-menu > li > a {padding: 5px;}
.main-menu li a {font-size: 12px; }


.section h1, .section-wrap h1 {font-size: 45px; padding: 23px 0; font-weight: 200; margin-bottom: 30px;}
.section h1 span.uTitle {display: block; margin-top: 10px; font-size: 22px;}
.txtContent p, .txtContent li {font-size: 22px;}
.middleShortInfo h1 {font-size: 34px; padding:0; }
.p-item .middleShortInfo .info {padding: 5%;}
.lTxt {color: #000000; font-size: 40px;}

.middleShortInfo .info-up p {float: none; width: 100%;}
.info-down {position: relative; bottom: auto; right: auto; border-right: 1px solid #fff; padding: 0 20px 0 0; min-height: 100px; margin-top: 30px;} 
}


@media (max-width: 767px){

.desktop-only {display: none;}

.section h1, .section-wrap h1 {padding-bottom: 20px;}
.mobile-only {display: block;}
.folio-item {width: 50%; float: left;}
  .klienty {
    padding-bottom: 50px;
  }
  .klienty img {
  display: block;
  margin: 30px auto;
}

.navbar-header {display: table; margin-top: -50px; margin-right: 20px;}
.navbar-header > button {margin-bottom: 20px;}
.nav > li {line-height: 18px;} 
.main-menu li {display: block; text-align: center;}
.main-menu li a {font-size: 14px; padding: 10px 0;}
.main-menu li a:hover, .main-menu li.active a, .main-menu > li.active > a:focus, .main-menu > li.active > a:hover {font-size: 20px; padding: 12px 0;}
.section-home h2 {  font-size: 70px;  }
.section h1, .section-wrap h1 {font-size: 32px;}
.lTxt {color: #000000; font-size: 32px; font-weight: 300;}

.middleShortInfo h1 {font-size: 21px; }
.navbar-collapse {margin-top: 15px; width: 100%; float: none; z-index: 99999; background-color: #080808;}
.main-menu li.active:first-child { display: none; transition-duration: 0.3s; }
.form-horizontal .form-group {margin: 0 0 15px 0;}


@media (max-height: 620px) {
#mainNav {}
.topWrap .top {padding: 5px 0;}
.firstTop .logo img {height: 70px;}
.slick-navbar-inner {margin-top: -68px;}
.slick-navbar {border: none;}
.slick-navbar.live {background-color: transparent;}
}


}

@media (max-width: 470px) {

.page-portfolio #portfolio  {padding-top: 0px;}
#portfolio-kafle .folio-item p.item-info, #portfolio-kafle .folio-item p.work-type { display: none; }
#_portfolio-kafle .folio-item img { position: absolute; left: 0; top: 0; }
#_portfolio-kafle .folio-item { height: 160px; }

.section h1, .section-wrap h1 {padding-bottom: 12px;}
	.navbar-header {margin: 0;}
		.section-home h2 {  font-size: 50px; top: 20%;  }
		.navbar-default {  }
		.topWrap .top {
			min-width: 0px;
			padding: 0;
			background: none;
		}
		.logo { display: none; }
		.logo-home { display: inline-block; max-width: 80%; margin-bottom: 10px; }
		.section h1, .section-wrap h1 {font-size: 21px;}
		.txtContent p, .txtContent li { font-size: 16px;}
		.lTxt {color: #000000; font-size: 21px; font-weight: 300;}
		.arrow li { font-weight: 200; display: block; margin: 4px 0; }
.portfolio .p-item {margin-top: 105px;}

@media (max-height: 620px) {
#mainNav {}
.topWrap .top {padding: 5px 0;}
.firstTop .logo img {height: 70px;}
.slick-navbar-inner {margin-top: -65px;}
.slick-navbar {border: none;}
.slick-navbar.live {background-color: transparent;}
.portfolio .p-item {margin-top: 0;}
}
}


@media (max-height: 620px) {
.section-home h2 {top: 15%;}
.section-home a.goDown {bottom: 10px;}
}

@media (max-height: 550px) {
.section-home a.goDown {bottom: 10px;}
}
@media (max-height: 700px)
{
#about > div, #klienci > div, #actualizer > div, #kontakt > div {padding-bottom: 50px;}
#co_robimy > div { padding-bottom: 50px;}
}