body,
html {
	font-family: 'Open Sans', sans-serif;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	color: #353d44;
	width: 100% !important;
	height: 100% !important;
	background-color: rgb(25, 31, 25);
}

h2 {
	margin: 0 0 20px 0;
	font-weight: 400;
	font-size: 36px;
	color: #353e46;
}

h3,
h4 {
	font-size: 18px;
	font-weight: 300;
	letter-spacing: 1px;
}

h5 {
	text-transform: uppercase;
	font-weight: 700;
	line-height: 20px;
}

p.intro {
	font-size: 16px;
	margin: 12px 0 0;
	line-height: 24px;
}

a {
	color: #f6f6f6;
}

a:hover,
a:focus {
	text-decoration: none;
	color: #2c333a;
}

ul,
ol {
	list-style: none;
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

ul,
ol {
	padding: 0;
	webkit-padding: 0;
	moz-padding: 0;
}

hr {
	height: 2px;
	width: 90px;
	text-align: center;
	position: relative;
	background: rgba(14, 13, 13, 0.2);
	margin: 0 auto;
	margin-bottom: 30px;
	border: 0;
}

/* Navigation */
#menu {
	padding: 20px;
	transition: all 0.8s;
}

#menu.navbar-default {
	background-color: rgba(233, 232, 232, 0);
	border-color: rgba(212, 212, 212, 0);
}

#menu a.navbar-brand {
	font-size: 20px;
	color: rgba(255, 255, 255, 0.7);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#menu a.navbar-brand i.fa {
	font-size: 18px;
	color: #73abd1;
	vertical-align: top;
}

#menu.navbar-default .navbar-nav>li>a {
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
	font-size: 12px;
	letter-spacing: 1px;
}

#menu.navbar-default .navbar-nav>li>a:hover {
	color: #a0a8a0;
}

.on {
	background-color: #343b42 !important;
	padding: 0 !important;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
	color: #2998d8 !important;
	background-color: transparent;
}

.navbar-toggle {
	border-radius: 0;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
	background-color: #77aedb;
	border-color: #7eadd3;
}

.navbar-default .navbar-toggle:hover>.icon-bar {
	background-color: #FFF;
}

.section-title {
	padding-bottom: 50px;
}

.sub_section-title {
	padding-top: 50px;
	padding-bottom: 10px;
}

.btn-custom {
	text-transform: uppercase;
	color: #414a52;
	background-color: #dddfe0c0;
	border: 0;
	padding: 14px 20px;
	margin: 0;
	font-size: 16px;
	border-radius: 6px;
	margin-top: 20px;
	transition: all 0.3s;
}

.btn-custom:hover,
.btn-custom:focus,
.btn-custom.focus,
.btn-custom:active,
.btn-custom.active {
	color: #63b1df;
	background-color: #414a52;
}

.btn-default {
	text-transform: uppercase;
	color: #63b1df;
	background-color: #414a52;
	border: 0;
	padding: 14px 20px;
	margin: 0;
	font-size: 16px;
	border-radius: 0;
	margin-top: 20px;
	transition: all 0.3s;
}

.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active {
	color: #63b1df;
	background-color: #343b42;
}

/* Header Section */
.intro {
	display: table;
	width: 100%;
	padding: 0;
	text-align: center;
	background: url(../img/head1.jpg) no-repeat center bottom;
	background-color: rgb(25, 31, 25);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}

.section-title.center {
	padding: 10px 0 40px 0;
}

.intro h1 {
	color: rgba(255, 255, 255, 0.9);
	font-size: 64px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.intro p {
	color: rgba(255, 255, 255, 0.8);
	font-size: 22px;
	margin-bottom: 40px;
	margin-top: 20px;
}

header .intro-text {
	padding-top: 250px;
	padding-bottom: 200px;
}

.align-text {
	margin-left: 20px;
	margin-right: 20px;
	text-align: justify;
	line-height: 1.7em;
}

.align-text_video {
	margin-left: 20px;
	margin-right: 20px;
	text-align: justify;
	line-height: 1.7em;
	padding-bottom: 15px;
}

.hrTitleBorder {
	/*
	width: 100%;
	margin-top: 5px;
	border-top: 2px solid #2998d8;
	border-left: 4px solid #2998d8;
	height: 3px;
	background-color: #22222200;
	*/
}

.spanTitleBorder {
	/*
	font-size: 42px;
	width: 110%;
	margin-left: -10px;
	margin-top: 3px;
	border: 0;
	border-bottom: 2px solid #2998d8;
	height: 1px;
	background-color: #22222200;
	*/
	font-size: 38px;
	color: #2998d8;
}

.circle-container {
	position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	width: 130px;
	height: 40px;

	display: flex;
	flex-wrap: wrap;
}

.circle-item-left {
	flex: 30%;
	width: 30%;
	margin-left: 0px;
	left: 0px;
}

.circle-item-center {
	left: 0px;
	margin: 0px;
	flex: 30%;
	width: 30%;
}

.circle-item-right {
	left: 0px;
	margin-left: 0px;
	flex: 30%;
	width: 30%;
}

.half-circle1,
.half-circle1_small {
	position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	margin-top: -34px;
	width: 75px;
	height: 37px;
	align-items: center;
	align-content: center;
	border-top-left-radius: 100px;
	border-top-right-radius: 100px;
	/* Overlap the sections */
	/* background: rgb(60, 61, 63); */
	background: rgb(60, 61, 63);
	box-shadow:
		1px -7px 2px rgba(0, 0, 0, 0.3),
		5px -15px 7px rgba(0, 0, 0, 0.3);
}

.half-circle1_small {
	width: 50px;
	height: 25px;
}

.half-circle2,
.half-circle2_small {
	position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	margin-top: -34px;
	width: 75px;
	height: 37px;
	align-items: center;
	align-content: center;
	border-top-left-radius: 100px;
	border-top-right-radius: 100px;
	/* Overlap the sections */
	/* background: rgb(60, 61, 63); */
	/* background: rgb(60, 61, 63); */
	background: rgb(75, 76, 78);
	box-shadow:
		0px -10px 2px rgba(0, 0, 0, 0.2),
		0px -19px 7px rgba(0, 0, 0, 0.2);
}

.half-circle2_small {
	width: 50px;
	height: 25px;
}


/* Wstęp Section */
#wstep,
#zdjecia,
#omini {

	color: #919191;
	padding: 120px 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#63b1df+0,63b1df+0,63b1df+0,7fdce6+0,63b1df+100 */
	background: rgb(60, 61, 63);
	box-shadow: 0 -4px 3px rgba(0, 0, 0, 0.25) inset;
	/*
	box-shadow:
		0 -11px 7px rgba(0, 0, 0, 0.2) inset,
		0 11px 7px rgba(0, 0, 0, 0.2) inset;
*/

	/*
		mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-moz-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-ms-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-o-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	*/
}

#wstep h2,
#zdjecia h2,
#omini h2 {
	color: #919191;
	display: inline-block;
}

#wstep h3 {
	display: inline-block;
}


#wstep img {
	float: right;
}

#wstep p {
	margin-bottom: 30px;
	line-height: 21px;
}

/* Serwis Section */
#serwis,
#video {
	/* color: #3b3b3b; */
	color: #919191;
	padding: 120px 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#63b1df+0,63b1df+0,63b1df+0,71777d+0,414a52+100 */
	/* background: rgb(101, 112, 104); */

	background: rgb(75, 76, 78);
	/* background: rgb(60, 61, 63); */
	/* background: #909394; */
	/* background: rgb(182, 182, 182); */

	box-shadow: 0 -4px 3px rgba(0, 0, 0, 0.25) inset;
}

#serwis {
	padding-top: 60px;
}

#serwis h2,
#video h2 {
	color: #919191;
	display: inline-block;
}

/*
#serwis h2,
#video h2 {
	color: #4b4b4b;
	display: inline-block;
}
	*/

#serwis h3 {
	display: inline-block;
}

#serwis img {
	float: right;
}

#serwis p {
	margin-bottom: 30px;
	line-height: 21px;
}

/* Zdjecia Section */
/*
#zdjecia {
	color: #3b3b3b;
	padding: 120px 0;
	padding-bottom: 0;
	background: rgb(182, 182, 182);
}
	*/

#zdjecia h2 {
	display: inline-block;
}

#zdjecia h3 {
	display: inline-block;
}

#zdjecia img {
	float: right;
}

#zdjecia p {
	margin-bottom: 30px;
	line-height: 21px;
}

/* Video Section */
/*
#video {
	color: #3b3b3b;
	padding: 120px 0;
	background: rgb(160, 168, 160);
}
*/
#video h2 {
	display: inline-block;
}

/* O Mini Section */
/*
#omini {
	color: #3b3b3b;
	padding: 120px 0;
	background: rgb(182, 182, 182);

}
*/

#omini h2 {
	display: inline-block;
}

#omini .omini-text {
	margin-left: 10px;
}

#omini img {
	float: right;
}

#omini p {
	margin-bottom: 30px;
	line-height: 21px;
}

/* Contact Section */
#contact {
	padding: 120px 0 60px 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#63b1df+0,63b1df+0,63b1df+0,7fdce6+0,63b1df+100 */
	background: rgb(84, 208, 221);
	/* Old browsers */
	background: -moz-linear-gradient(top, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 100%);
	/* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 100%);
	/* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 0%, rgba(203, 215, 223) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b1df', endColorstr='#63b1df', GradientType=0);
	/* IE6-9 */
}

#contact form {
	padding: 30px 0;
}

#contact .text-danger {
	color: #cc0033;
	text-align: left;
}


.categories {
	padding-bottom: 30px;
	text-align: center;
}

ul.cat li {
	display: inline-block;
}

ol.type li {
	display: inline-block;
	margin-left: 20px;
}

ol.type li a {
	background: #414a52;
	color: #63b1df;
	padding: 12px 24px;
	text-transform: uppercase;
}

ol.type li a.active {
	background: #63b1df;
	color: #414a52;
}

ol.type li a:hover {
	background: #63b1df;
	color: #414a52;
}

.isotope-item {
	z-index: 2
}

.isotope-hidden.isotope-item {
	z-index: 1
}

.isotope,
.isotope .isotope-item {
	/* change duration value to whatever you like */
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	transition-duration: 0.8s;
}

.isotope-item {
	margin-right: -1px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.isotope {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width;
}

.isotope .isotope-item {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	transition-property: transform, opacity;
}

.portfolio-item {
	margin: 15px 0;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

.portfolio-item:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.portfolio-item .hover-bg {
	height: 195px;
	overflow: hidden;
	position: relative;
	top: 0px;
	left: 0px;
}

.hover-bg .hover-text {
	position: absolute;
	text-align: center;
	margin: 0 auto;
	color: #ffffff;
	background: rgba(0, 0, 0, 0.66);
	padding: 30% 0 0 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: all 0.5s;
	z-index: 2;

	-webkit-border-radius: 6px !important;
	-moz-border-radius: 6px !important;
	-ms-border-radius: 6px !important;
	-o-border-radius: 6px !important;
	border-radius: 6px;
}

.hover-bg .hover-text>h4 {
	text-transform: uppercase;
	opacity: 0;
	color: #fff;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
	transition: all 0.3s;
}

.hover-bg:hover .hover-text>h4 {
	opacity: 1;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.hover-bg .hover-text>i {
	opacity: 0;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	transition: all 0.3s;
}

.hover-bg:hover .hover-text>i {
	opacity: 1;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateY(100%);
	transform: translateY(100%);
}

.hover-bg:hover .hover-text {
	opacity: 1;
}

#portfolio i.fa {
	font-size: 20px;
	padding: 5px;
	color: #E87E04;
}



label {
	font-size: 12px;
	font-weight: 400;
	font-family: 'Open Sans', sans-serif;
	float: left;
}

#contact .form-control {
	display: block;
	width: 100%;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #222;
	background-color: rgba(255, 255, 255, 0.8);
	background-image: none;
	border: 1px solid transparent;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}

#contact .form-control:focus {
	border-color: #4b8d98;
	outline: 0;
	-webkit-box-shadow: transparent;
	box-shadow: transparent;
}

.form-control::-webkit-input-placeholder {
	color: #2c3e50;
}

.form-control:-moz-placeholder {
	color: #2c3e50;
}

.form-control::-moz-placeholder {
	color: #2c3e50;
}

.form-control:-ms-input-placeholder {
	color: #2c3e50;
}

#contact .social {
	margin-top: 80px;
}

#contact .social ul li {
	display: inline-block;
	margin: 0 20px;
}

#contact .social i.fa {
	font-size: 26px;
	padding: 4px;
	color: #343b42;
	transition: all 0.3s;
}

#contact .social i.fa:hover {
	color: #fff;
}

.btn:active,
.btn.active {
	background-image: none;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

a:focus,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline: none;
	outline-offset: none;
}

/* Footer Section*/
#footer {
	background: #343b42;
	color: rgba(255, 255, 255, 0.4);
	padding: 30px 0 25px 0;
}

#footer p {
	font-size: 13px;
}

#footer a {
	color: rgba(255, 255, 255, 0.7);
}

#footer a:hover {
	color: #63b1df;
}

@media (max-width: 1024px) {
	#about img {
		float: left;
		margin-bottom: 20px;
	}
}

#image-container {
	position: relative;
	width: 100%;
	/* Adjust to your image size */
	height: 100vh;
	/* Adjust to your image size */
	overflow: hidden;
	background-color: rgb(25, 31, 25);
}

#images {
	position: absolute;
	margin: auto;
	margin-top: -100px;
	width: 70%;
	/* Adjust to your image size */
	height: 70%;
	/* Adjust to your image size */
	overflow: hidden;
	background-color: rgb(25, 31, 25);
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);

	/*
	mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-moz-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-ms-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	-o-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
	*/
	/*
	-webkit-filter: grayscale(100%);
    filter: grayscale(100%);
	*/


}

/*
#images::after {
	content: '';
  position: absolute;
  inset: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.9'/%3E%3C/svg%3E");
}
	*/

@media (max-width: 1024px) {
	#images {
		width: 96%;
		height: 96%;
	}
}

.fade-image {
	position: absolute;
	margin: auto;
	width: 100%;
	height: auto;
	transition: opacity 2s ease-in-out;
	left: 50%;
	top: 50%;
	transform: scale(-1, 1) translate(50%, -50%);
	rotate: 2deg;	
	
	filter: sepia(70%) contrast(0.9) brightness(1.4) saturate(0.33) blur(0.2px) url(#grainy);
	-webkit-mask: radial-gradient(#000, #000a);
	mix-blend-mode: normal;
	

	background: radial-gradient(ellipse, rgba(0, 0, 0, 1) 30%, transparent 100%);
	-webkit-mask-image: radial-gradient(ellipse, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	-moz-mask-image: radial-gradient(ellipse, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	-ms-mask-image: radial-gradient(ellipse, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);
	-o-mask-image: radial-gradient(ellipse, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%);


}
/*
.fade-image::after {
	background: radial-gradient(circle, mediumturquoise, darkslateblue);
	filter: url(#grainy);
}
*/
.title2 {
	z-index: 2;
	color: rgba(255, 255, 255, 0.671);
	padding: 0;
	text-align: center;
	position: absolute;
	margin: 0px;
	margin-bottom: 60px;
	bottom: 60px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: auto;
	width: auto;
}

.title2 p {
	font-size: 26px;
	margin: 12px 0 0;
	line-height: 24px;

}

.title2 h1 {
	font-size: 64px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.title2 strong {
	font-size: 32px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: lowercase;
}

@media (max-width: 1024px) {
	.title2 {
		margin-bottom: 120px;
	}

	.title2 p {
		font-size: 13px;
	}

	.title2 h1 {
		font-size: 32px;
	}

	.title2 strong {
		font-size: 16px;
	}
}

.rowOfImages1 {
	display: flex;
	justify-content: center;
	/* Centers horizontally */
	align-items: center;
	/* Centers vertically */
	height: auto;
	/* Example height */
}

.rowOfImages1>img {
	width: 40%;
	height: auto;
	margin: 5px;

	-webkit-border-radius: 6px !important;
	-moz-border-radius: 6px !important;
	-ms-border-radius: 6px !important;
	-o-border-radius: 6px !important;
	border-radius: 6px;
}

.align-text2 {
	margin-left: 20px;
	margin-right: 20px;
	line-height: 1.7em;
}

.iconR_pages {
	position: absolute;
	align-items: center;
	align-content: center;
	text-align: center;
	margin: 0px;
	margin-top: -13px;
	width: 100%;

	color: #2998d8;
	font-size: 32px;
}

.iconR {
	padding-right: 2px;
	color: #2998d8;
}

.iconDot {
	padding-right: 2px;
	color: #2998d8;
}

.iconDotB {
	padding-right: 2px;
	color: #222222;
}

.iconDot_pages {
	position: absolute;
	align-items: center;
	align-content: center;
	text-align: center;
	margin: 0px;
	margin-top: -16px;
	width: 100%;


	color: #1f1f1f;
	font-size: 32px;
}


.flex-container {
	display: flex;
	flex-wrap: wrap;
}

.flex-item-left2 {
	flex: 5%;
	width: 5%;
	margin-left: 0px;
	left: 0px;
}

.flex-item-right2 {
	left: 0px;
	margin-left: 0px;
	flex: 95%;
	width: 95%;
}

.flex-item-left {
	flex: 2%;
	width: 2%;
	margin-left: 0px;
	left: 0px;
}

.flex-item-right {
	left: 0px;
	margin-left: 0px;
	flex: 98%;
	width: 98%;
}

.iconSpan1 {
	display: inline-block;
	color: #2998d8;
	text-align: left;
	text-justify: inter-word;
}

.iconTextSpan1 {
	margin-left: 0px;
	text-justify: auto;
	text-align: justify;
	display: inline-block;
	position: relative;
}

@media (max-width: 800px) {
	.flex-item-left {
		flex: 5%;
		width: 5%;
	}

	.flex-item-right {
		flex: 95%;
		width: 95%;
	}
}

.hrefLink2 {
	color: #2998d8;

}

.hrefLink2:hover {
	color: #2986bb;
}



/* Responsive layout - makes a one column-layout instead of a two-column layout */