html {
	font-size: 0.625em;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	overflow-y: scroll;
}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0px;
	padding: 0px;
	list-style: none;
}

@font-face {
	font-family: 'Open Sans', sans-serif;
	src: url('../fonts/OpenSans-Light.ttf') format('truetype'), url('../fonts/OpenSans-italic.ttf') format('truetype'), url('../fonts/OpenSans-Regular.ttf') format('truetype'), url('../fonts/OpenSans-Semibold.ttf') format('truetype'), url('../fonts/OpenSans-Bold.ttf') format('truetype');
}

@font-face {
	font-family: 'Source Sans Pro', sans-serif;
	src: url("../fonts/SourceSansPro-Light.otf") format("opentype"), url('../fonts/SourceSansPro-italic.otf') format('opentype'), url('../fonts/SourceSansPro-Regular.otf') format('opentype'), url('../fonts/SourceSansPro-Semibold.otf') format('opentype'), url('../fonts/SourceSansPro-Bold.otf') format('opentype');
}

body {
	font-size: 1em;
	color: #000;
	line-height: 150%;
	font-weight: 400;
	background-color: #fff;
	overflow-x: hidden;
}

a {
	color: #000;
}

a:hover {
	text-decoration: none !important;
}

.container,
.container-fluid {
	padding-right: 0px !important;
	padding-left: 0px !important;
}

.row {
	margin-right: 0px !important;
	margin-left: 0px !important;
}


/*------------  ELEMENTS  ----------------*/

div.linia {
	border-left: 4px solid #c00a32;
	margin-top: 5px;
}

.btn {
	position: relative;
	padding: 10px 30px;
	margin: 30px 10px 10px 20px;
	border: 2px solid #c00a32;
	transition: all 600ms cubic-bezier(0.77, 0, 0.175, 1);
	cursor: pointer;
	border-radius: 0px;
}

a.button-link {
	color: #c00a32;
	font-size: 1.1em;
	line-height: 120%;
	font-family: 'Open Sans', sans-serif;
	transition: 0.3s;
	font-weight: 600;
}

.btn:before,
.btn:after {
	content: '';
	position: absolute;
	transition: inherit;
	z-index: -1;
}

.btn:hover a.button-link {
	color: #fff;
	transition: 0.1s;
	text-decoration: none;
	transition-delay: .1s;
}

a.button-link:hover,
.btn-link:focus {
	color: #fff;
	transition: 0.1s;
	text-decoration: none;
	transition-delay: .1s;
}

.btn:hover:before {
	transition-delay: 0s;
}

.btn:hover:after {
	background: #c00a32;
	transition-delay: .0s;
}

.from-top:before,
.from-top:after {
	left: 0;
	height: 0;
	width: 100%;
}

.from-top:before {
	bottom: 0;
	border: 1px #c00a32;
	;
	border-top: 0;
	border-bottom: 0;
}

.from-top:after {
	top: 0;
	height: 0;
}

.from-top:hover:before,
.from-top:hover:after {
	height: 100%;
}


/*-------------------------MENU--------------------------*/


/* WIDTH SETTING */

.nav-hold {
	width: 99%;
	max-width: 1300px;
	margin: 0 auto;
}

.nav-bar {
	width: 100%;
	position: fixed;
	z-index: 999;
	color: transparent;
}

.bg-navbar {
	background-color: rgba(49, 48, 54, 0.9);
	transition: 0.3s;
	color: #fff;
}

.navi {
	background: transparent;
	transition: 0.3s;
}

.nav-hold {
	overflow: hidden;
}

#nav-logo {
	float: left;
	display: none;
	color: #f9f9f9;
	padding: 20px 5px 10px;
}

.nav-list {
	float: right;
}

.nav-list li {
	float: left;
}

.nav-list li a.black-color {
	color: transparent;
}

.nav-list li a {
	font-family: 'Source Sans Pro', sans-serif;
	display: block;
	color: #fff;
	font-size: 1.7em;
	line-height: 48px;
	text-transform: uppercase;
	transition: 0.3s;
	padding: 15px 20px;
}

.nav-list li a:hover {
	color: #c00a32 !important;
	transition: 0.3s;
	letter-spacing: 1px;
}

.nav-menu {
	color: #f9f9f9;
	float: right;
	padding: 25px 20px 10px 20px;
	display: none;
	cursor: pointer;
	font-size: 30px;
	transition: 0.3s;
}

.nav-menu:hover {
	color: #c00a32;
	transition: 0.3s;
}


/*------------FOOTER - COPYRIGHT----------------*/

div.footer {
	display: block;
	background-color: #313036;
	padding: 20px 20px 10px;
	border-top: 1px solid #5e5e62;
}

div.footer p.copyright {
	font-size: 1.1em;
	color: #c0c3c7;
	font-weight: 400;
	line-height: 130%;
}

div.footer p.copyright a {
	color: #fff !important;
	transition: color 0.3s ease;
}

div.footer p.copyright a:hover {
	color: #c00a32 important;
	transition: color 0.3s ease;
}

ul.menu-footer {
	padding-left: 20px;
	line-height: 1.6em;
	height: 25px;
}

ul.menu-footer li {
	float: left;
	color: #fff;
}

ul.menu-footer li a {
	color: #fff;
	font-size: 1.3em;
	padding: 0px 10px;
	line-height: 120%;
}

ul.menu-footer li a:hover {
	color: #c00a32 !important;
	transition: color 0.3s ease;
}


/*------------ SECTION - INFO----------------*/

section#info {
	background-color: #37363c;
}

section#info::before {
	content: '';
	position: absolute;
	margin-top: 0px;
	width: 50%;
	background-color: #fff;
	height: 70px;
	right: 0px;
	z-index: 99;
}

div.info-footer {
	background-image: url(../img/offertop.jpg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top left;
	margin-top: 70px;
}

div.info-footer article.footer-text {
	font-size: 1.3em;
	line-height: 130%;
	padding: 60px 20px 20px 30px;
	color: #c0c3c7;
}

p.footer-paragraf {
	font-size: 1.1em;
}

h3.headline-company {
	font-size: 1.2em;
	font-weight: 500;
	color: #c0c3c7;
}

div.img-footer {
	background-image: url(../img/footer+img.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top right;
	height: 350px;
}


/*------------ SECTION ABOUT----------------*/

section#toabout {
	background-color: #fff;
	padding-top: 5%;
	background-image: url(../img/konstrukcja.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top right;
	padding-bottom: 120px;
}

h1.main {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 4.0em;
	font-weight: 200;
}

h1.head {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 3.0em;
	padding: 0px 0 10px;
	font-weight: 200;
}

h4.main {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 3.4em;
	padding: 20px 0 0;
	font-weight: 200;
}

h2.about {
	padding: 0px 0 10px;
	font-weight: 700;
	margin-left: 20px;
	margin-top: -6px;
	font-size: 3.4em;
	margin-bottom: 20px;
}

h2.head {
	font-size: 2.3em;
	padding: 0px 0 10px;
	font-weight: 700;
}

article.about-text p {
	font-size: 1.6em;
	line-height: 26px;
	margin-left: 20px;
	padding-right: 90px;
}

.img-about2 {
	position: relative;
	top: -190px;
	left: -50px;
}

.img-about1 {
	height: 635px;
}

figure.about {
	height: 800px;
}

section#img-mobile {
	display: none;
}


/*------------  OFFER HOME ----------------*/

section#offerhome {
	background-color: #37363c;
	padding: 70px 30px 0px;
	background-image: url(../img/offertop.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	background-size: contain;
}

section#offerhome::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	left: 0px;
}

div.offerhome::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	right: 0px;
}

div.space {
	padding: 20px 0 20px;
}

div.box-container {
	background-position: center left;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 600px;
}

div.box-container-offer {
	background-position: center left;
	background-repeat: no-repeat;
	background-size: cover;
}

div.box1 {
	background-image: url(../img/offer1.jpg);
	margin-top: 50px;
	margin-right: 20px;
}

div.box2 {
	background-image: url(../img/offer2.jpg);
	margin-right: 20px;
}

div.box3 {
	background-image: url(../img/offer3.jpg);
	margin-top: 50px;
}

.box-text {
	background-color: #fff;
	width: 300px;
	position: absolute;
	padding: 5px 30px;
	bottom: 0px;
	z-index: 50;
}

h5.text-offerbox {
	font-family: 'Source Sans Pro', sans-serif;
	color: #37363c;
	font-size: 3.0em;
	line-height: 120%;
	font-weight: 600;
	text-align: left;
	text-transform: uppercase;
	margin-bottom: 5px;
	transition: all 0.5s ease;
}

p.offer-desc {
	font-family: 'Open Sans', sans-serif;
	color: #37363c;
	font-size: 1.4em;
	line-height: 140%;
}

.next-button {
	position: absolute;
	width: 80px;
	background-color: #fff;
	height: 50px;
	bottom: 0px;
	z-index: 98;
	right: 120px;
	transition: all 0.5s ease;
}

div.next-button .next-icon {
	background-image: url(../img/next-arrow.png);
	background-repeat: no-repeat;
	position: absolute;
	background-position: center center;
	z-index: 99;
	height: 21px;
	width: 30px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: all 0.5s ease;
}

div.box-container:hover .next-button {
	background-color: #c00a32;
	transition: all 0.5s ease;
}

div.box-container:hover h5.text-offerbox a {
	color: #c00a32;
	transition: all 0.5s ease;
	letter-spacing: 1px;
}

div.box-container:hover .next-icon {
	background-image: url(../img/next-arrow-white.png);
	transition: all 0.5s ease;
}


/*------------  SLAJD ----------------*/

/*
.main-slide {
	background-image: url('../img/main-slide.jpg');
	background-repeat: no-repeat;
	background-position: center;
	height: 994px;
}
*/

div.video {
	background-color: #313036;
}

img.desktop {
	width: 284px;
	height: 110px;
}

div.text-slide {
position: absolute;
top: 40%;
	left: 50%;
	transform: translateX(-50%);
}

div.text-slide h1.main {
	color: #fff;
	font-size: 5.3em;
	text-transform: uppercase;
}

div.text-slide h1.head {
	color: #fff;
	font-size: 5.3em;
	font-weight: 400;
	margin-top: 0px;
	text-transform: uppercase;
}

div.text-slide h5.paragraf {
	color: #fff;
	font-size: 1.6em;
	line-height: 140%;
	font-family: 'Open Sans', sans-serif;
}


/*-------------------KLIENTS CARUSEL ------------------*/

section#clients {
	padding-top: 50px;
	padding-bottom: 50px;
}

h4.clients {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 4.0em;
	padding: 20px 0 0;
	font-weight: 600;
}

.owl-carousel .owl-item img {
	width: 200px !important;
}

.owl-theme .owl-nav {
	font-size: 22px;
}

button.owl-prev {
	float: left;
	transform: translateY(-90px);
}

button.owl-next {
	float: right;
	transform: translateY(-90px);
}

.owl-carousel .owl-stage-outer {
	padding: 40px 50px 0px;
}


/*-------------------------PODSTRONA OFERTA--------------------------*/

#bg-page-offer {
	height: 338px;
	background-repeat: no-repeat;
	background-position: center;
    background-size: cover;
}

.bg-offer::after {
	content: '';
	position: relative;
	left: 80%;
	width: 350px;
	background-color: #f8f8f8;
	height: 500px;
	top: 338px;
}

.bg-realizacje::after {
	content: '';
	position: absolute;
	right: 0px;
	width: 350px;
	background-color: #f8f8f8;
	height: 700px;
	top: 338px;
}

.bg-offer {
	background-image: url('../img/oferta-bg.jpg');
}

.bg-firma {
	background-image: url('../img/firma-bg.jpg');
}

section#offer-main {
	padding: 35px 0;
}

img.elektryk {
	width: 450px;
	margin-top: 20px;
	position: absolute;
	z-index: 77;
}

h3.page-headline1 {
	font-weight: 600;
	font-family: 'Source Sans Pro', sans-serif;
	margin-left: 20px;
	font-size: 4.4em;
	text-transform: uppercase;
	color: #3c3c42;
	margin-top: 0px;
}

h4.page-headline2 {
	font-family: 'Source Sans Pro', sans-serif;
	color: #c00a32;
	font-size: 3.4em;
	font-weight: 400;
	margin-left: 20px;
	text-transform: uppercase;
	padding-bottom: 10px;
}


/* Section 2 */

section#offer-boxed {
	background-color: #37363c;
	padding: 70px 30px 0px;
	background-image: url(../img/budynek-bg.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: 50px;
	height: 660px;
}

section#offer-boxed::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	left: 0px;
}

div.offerhome::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	right: 0px;
}

div.offerpage::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	right: 0px;
}

h3.banner-head {
	color: #fff;
	text-transform: uppercase;
	padding-bottom: 10px;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 32px;
	font-weight: 600;
}


/* PUNKTACJA */

span.icon-prad {
	background-image: url('../img/icon-prad.png') !important;
	display: inline-block;
	width: 71px;
	height: 64px;
	background: center center no-repeat;
	background-size: 71px 64px;
	margin-left: 5px;
	margin-right: -5px;
}

span.icon-power {
	background-image: url('../img/icon-power.png') !important;
	display: inline-block;
	width: 61px;
	height: 54px;
	background: center center no-repeat;
	background-image: none;
	background-size: auto;
	background-size: 61px 54px;
	margin-left: 5px;
	margin-right: -5px;
}

h3.icon-head {
	color: #fff;
	text-transform: uppercase;
	padding-bottom: 10px;
	border-bottom: 3px solid #c00a32;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 28px;
}

ul.punkt {
	list-style-type: none;
	padding: 20px;
	color: #e0dede;
	margin-bottom: 20px;
	list-style-position: inside;
	text-indent: -3.5em;
	margin-left: 40px;
}

ul.punkt li {
	font-family: 'Open Sans';
	font-size: 1.4em;
	line-height: 150%;
	padding-bottom: 10px;
}

ul.punkt li:before {
	content: "";
	width: 15px;
	height: 3px;
	background-color: #c00a32;
	display: inline-block;
	margin-bottom: 3px;
	margin-right: 20px;
}


/*-------------------ZOOM POPUP ------------------*/


/* text-based popup styling */

.white-popup {
	position: relative;
	background: #FFF;
	padding: 40px;
	width: auto;
	max-width: 800px;
	margin: 20px auto;
	transition: 1s all;
}

.mfp-fade.mfp-bg {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
}


/* overlay animate in */

.mfp-fade.mfp-bg.mfp-ready {
	opacity: 0.8;
}


/* overlay animate out */

.mfp-fade.mfp-bg.mfp-removing {
	opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	transition: all 0.4s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
	opacity: 0;
}

div.white-popup p {
	font-size: 1.6em;
	line-height: 120%;
}

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  /* ideally, transition speed should match zoom duration */
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
  opacity: 0;
}


/*------------------------- O FIRMIE--------------------------*/

h3.box {
color: #fff;
text-align: center;
text-transform: uppercase;
padding-bottom: 10px;
font-family: 'Source Sans Pro', sans-serif;
font-size: 28px !important;
transition: all 0.4s;
letter-spacing: 3px;
    transition: all 0.4s;
}


h3.box:hover {
transition: all 0.4s;
    transform: scale(1.1);
}

p.desc-box {
	font-family: 'Open Sans';
	font-size: 1.4em;
	line-height: 150%;
	padding-bottom: 10px;
	text-align: center;
	color: #e0dede;
}

div.box-company {
	max-width: 450px;
}

div.minus-top {
	margin-top: -20px;
}

div.info-company {
	padding: 20px 30px;
	border: 1px solid #4a4a56;
	margin-top: 60px;
}

img.ico-company1 {
	height: 60px;
	width: 70px;
	margin-top: -35px;
	position: absolute;
	z-index: 77;
	right: 142px;
}

#borderbottom {
	border-bottom: 1px solid #35363f;
	position: absolute;
	bottom: 0px;
	z-index: 22;
	width: 80px;
	right: 140px;
}

section#company-boxed {
	background-color: #37363c;
	padding: 70px 30px 0px;
	background-image: url(../img/budynek-bg.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: 50px;
	padding-bottom: 80px;
}

section#company-boxed::before {
	content: '';
	position: absolute;
	margin-top: -70px;
	width: 150px;
	background-color: #fff;
	height: 70px;
	left: 0px;
}


/*-------------------------GALERIA --------------------------*/

section#portfolio {
	margin-left: 20px;
}

#portfolio-item-1 {
	height: 255px;
	border: 5px solid #fff;
	background-repeat: no-repeat;
	background-size: cover;
}

section#portfolio .portfolio-items {
	width: 100%;
	font-size: 0px;
}

section#portfolio .portfolio-items .single-portfolio-item {
	position: relative;
	background-size: cover;
	background-position: top center;
	padding-right: 0px;
	padding-left: 0px;
}

.single-portfolio-item .single-portfolio-item-mask {
	background: rgba(192, 10, 50, 0.7);
	width: 100%;
	height: 100%;
	opacity: 0;
	font-size: 14px;
	transition: all 0.4s ease-in-out;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.single-portfolio-item .single-portfolio-item-mask:hover {
	opacity: 1;
}

.single-portfolio-item .single-portfolio-item-mask .single-portfolio-item-content {
	font-size: 14px;
	color: #fff;
	text-align: center;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	right: 0;
	width: 100%;
}

.single-portfolio-item-mask .single-portfolio-item-content h4 {
	text-transform: uppercase;
	font-weight: 500;
	padding: 0px 30px;
}

div.bg-realizacje {
	background-image: url('../img/realizacje-bg.jpg');
}

#clients-rel {
	padding: 60px 0px;
}

.btn-filter {
	background-color: transparent;
	color: #3c3c42;
	text-transform: uppercase;
	border: none;
	font-size: 20px;
	padding: 12px;
	transition: 0.3s;
	font-family: 'Source Sans Pro', sans-serif;
	margin-left: 10px;
}

.btn-filter:first-child {
	margin-left: 0px !important;
}

.btn-filter:hover {
	color: #c00a32;
	transition: 0.3s;
}
div.controls {
	margin: 0px 0px 20px 0px;
}

.btn-filter::after {
}

.btn-filter:hover .btn-filter::after {
}


/*------------------- KONTAKT ------------------*/

.bg-kontakt {
	background-image: url('../img/kontakt-bg.jpg');
}

h3.kontakt {
	color: #000;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 18px;
	margin-left: 20px;
	padding-bottom: 5px;
	padding-top: 20px;
}

p.red {
	color: #c00a32;
	padding-bottom: 5px;
	font-weight: 600;
	padding-left: 20px;
	font-size: 16px;
}

p.contact-p {
	padding-left: 20px;
	font-size: 16px;
}

div.linia-bottom {
	background-color: #c00a32;
	width: 150px;
	height: 3px;
	margin: 0px 0px 20px 20px;
}

.icon-contact {
	display: inline-block;
	width: 75px;
	height: 55px;
	background: center center no-repeat;
	background-size: 75px 65px;
	margin-top: 8px;
}

span.icon-firm1 {
	background-image: url('../img/ico-firm1.png');
}

span.icon-firm2 {
	background-image: url('../img/ico-firm2.png');
}

span.icon-phone {
	background-image: url('../img/ico-phone.png');
}

span.icon-email {
	background-image: url('../img/ico-mail.png');
}

h4.contact-head {
	display: inline-block;
	color: #c00a32;
	text-transform: uppercase;
	font-size: 1.5em;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 700;
	margin-bottom: 5px;
}

h5.contact-text {
	display: inline-block;
	color: #2f3340;
	font-size: 1.5em;
	font-family: 'Open Sans', sans-serif;
	line-height: 120%;
	margin-top: 0px;
}

h5.contact-text a {
	color: #c00a32;
	margin-top: 0px;
	line-height: 120%;
}

td:nth-child(2) {
	padding-left: 20px;
	width: 100%;
}

td.head-offer {
	float: left !important;
}

.contact-table tr {
	border-bottom: 1px solid #ccc;
}

div#contact-icons {
	padding: 30px 0px;
}

section#map {
	height: 350px;
}

.map-outer {
	position: relative;
	text-align: right;
	height: 350px;
	width: 100%;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}

section#info2 {
	background-color: #37363c;
}

section#info2::before {
	content: '';
	position: absolute;
	margin-top: 0px;
	width: 50%;
	background-color: #ededed;
	height: 70px;
	right: 0px;
	z-index: 99;
}

img.maps {
	width: 450px;
	margin-top: 20px;
	position: absolute;
	z-index: 77;
}