﻿@import"https://fonts.googleapis.com/css2?family=Montserrat:ital, wght@0, 100..900;1, 100..900&family=Open+Sans:ital, wght@0, 300..800;1, 300..800&display=swap";
body {
	font-family: "Open Sans", sans-serif !important;
	font-optical-sizing: auto;
	font-style: normal;
	overflow-x: hidden;
	position: relative;
	padding-top: 80px !important;
	max-width: 100%
}
a:hover {
	color:#B0CB21;
}
body.itemid-101{
	padding-top:0px !important;
}
.site-grid {
	position: relative;
	overflow-x: hidden;
	max-width: 100%
}
h1, h2, h3, h4, h5, h6, h7, .sppb-addon-title, .sppb-btn, .sppb-addon-feature, .title .name, .nspHeader a, .readon {
	font-family: "Montserrat", sans-serif !important;
	font-optical-sizing: auto;
	font-style: normal
}
body.wrapper-fluid .site-grid {
	grid-gap: 0;
	grid-template-columns: [full-start] minmax(0, 1fr) [main-start] repeat(4, minmax(0, 25%)) [main-end] minmax(0, 1fr) [full-end]
}
main {
	margin-top: 0px !important
}
.com-content-article, .com-content-category-blog, .com-content-categories.categories-list, .blog-gsearch {
	margin: 0px auto;
	max-width: 1320px;
	padding: 10px 15px 10px 15px
}
.mod-breadcrumbs__wrapper {
	margin: 20px auto 20px auto !important;
	max-width: 1320px;
	width: 100%;
	display: block;
	padding: 0px 15px 0px 15px
}
.mod-breadcrumbs__wrapper ol {
	width: 100%
}
.container-top-a>*, .container-top-b>*, .container-bottom-a>*, .container-bottom-b>* {
	flex: 1;
	margin: 0 0
}
.container-header {
	background: #fff;
	z-index: 999;
	display: block;
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-bottom: 1px solid #eee
}
.yendif-video-share {
  word-break: normal !important;
}
.container-header .topmenu {
	float: right
}
.container-header .topmenu .active a {
	color: #000
}
.container-header .topmenu a {
	color: #000
}
a {
	text-decoration: none !important;
	color: #333
}
.slogan-top {
	min-height: 90vh
}
.slogan-left-right .slogan-left .sppb-column-overlay {
	transition: all 1s
}
.slogan-left-right .slogan-left:hover .sppb-column-overlay {
	background: rgba(0,0,0,.4);
	transition: all 1s
}
.slogan-left-right .slogan-right .sppb-column-overlay {
	transition: all 1s
}
.slogan-left-right .slogan-right:hover .sppb-column-overlay {
	background: rgba(0,0,0,.4);
	transition: all 1s
}
.sekcja3a .sppb-column-addons .sppb-addon-wrapper {
	text-align: right;
	float: right
}
.site-grid {
	background: #fff;
	z-index: 10;
	position: relative
}
.nspHeader a {
	font-weight: 500;
	letter-spacing: 0px;
	color: #333
}
.readon {
	margin-top: 10px;
	color: #333;
	letter-spacing: 0px;
	font-weight: 300
}
.com-content-category-blog .page-header h2 a {
	display:block;
	overflow:hidden;
	position:Relative;
	font-size:26px;
	line-height:36px;
	height:72px;
}
.com-content-category-blog .item-content > h1,
.com-content-category-blog .item-content > h2,
.com-content-category-blog .item-content > h3,
.com-content-category-blog .item-content > h4,
.com-content-category-blog .item-content > h5,
.com-content-category-blog .item-content > h6{
	font-size:16px;
	line-height:26px;
}
.com-content-article.item-page .page-header h1{
	font-size:30px;
	line-height:40px;
	letter-spacing:0px;
}
.btn-secondary:hover {
	color:  #B0CB21;
}
.footer {
	background: #B1CC23;
	display: block;
	overflow: hidden;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 0
}
.footer h4 {
	padding-left: 15px !important;
	position: relative
}
.footer h4::before {
	content: "";
	display: block;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 3px;
	height: 100%;
	background: #fff;
	border-radius: 1px
}
.footer .nav li {
	padding: 3px 0px;
	transition: all .5s
}
.footer .nav li:hover {
	padding-left: 10px;
	transition: all .5s
}
.footer .nav li a, .footer .nav li .separator {
	font-size: 13px
}
.footer .nav li a::before, .footer .nav li .separator::before {
	content: "";
	display: inline-block;
	color: #fff;
	font-size: 10px;
	margin-right: 10px;
	margin-top: -2px;
	font-family: "Font Awesome 6 Free";
	font-weight: 400;
	vertical-align: middle;
	zoom: 1
}
.footer .sp-page-builder {
	margin: 0px auto
}
.back-to-top-link {
	left: 20px;
	right: auto !important
}

/* effect-1 css */
.port-1{float: left; width: 100%; position: relative; overflow: hidden; text-align: center; border: 4px solid rgba(255, 255, 255, 0.9);}
.port-1 .text-desc{opacity: 0.9; top: -100%; transition: 0.5s; color: #000; padding: 45px 20px 20px;}
.port-1 img{transition: 0.5s;}
.port-1:hover img{transform: scale(1.2);}
.port-1.effect-1:hover .text-desc{top: 0;}
.port-1.effect-2 .text-desc{top: auto; bottom: -100%;}
.port-1.effect-2:hover .text-desc{bottom: 0;}
.port-1.effect-3 .text-desc{top: 50%; left: 50%; width: 0; height: 0; overflow: hidden; padding: 0;}
.port-1.effect-3:hover .text-desc{width: 100%; top: 0; left: 0; height: 100%; padding: 45px 20px 20px;}
.port-1.effect-4 .text-desc          {color:#fff; bottom: 0; left: 0;right:0; top:50%; width: 100%; overflow: hidden; padding: 10px;background:rgba(177, 204, 35,0.90);}
.port-1.effect-4:hover .text-desc    { top:0; color:#333; background:rgba(177, 204, 35,0.90);}
.port-1.effect-4 .text-desc h4       {}
.port-1.effect-4:hover .text-desc h4 {}
.port-1.effect-4 .text-desc p        {display:none;}
.port-1.effect-4:hover .text-desc p  {display:block}
.port-1.effect-5 .text-desc          {color:#fff; bottom: 0; left: 0;right:0; top:80%; width: 100%; overflow: hidden; padding: 0px;background:rgba(177, 204, 35,0.90);}
.port-1.effect-5 .text-desc a 		 {color:#fff;display:block;position:relative;width:100%;height:100%;padding:10px;}
.port-1.effect-5:hover .text-desc    { top:0; color:#fff; background:rgba(177, 204, 35,0.90);padding:25% 0 0 0;}
.port-1.effect-5 .text-desc h4       {}
.port-1.effect-5:hover .text-desc h4 {}
.port-1.effect-5 .text-desc p        {display:none;}
.port-1.effect-5:hover .text-desc p  {display:block}
/* effect-1 css end */
/*= Media Screen CSS
==================== */
@media only screen and (max-width: 1090px){
    .port-5.effect-1 {z-index: 19;}
	.text-desc{padding: 7px; font-size:12px;}
}

@media(max-width: 1400px) {
	.dj-megamenu-prospekto li a.dj-up_a {
		font-size: 15px !important;
		padding: 0 10px !important;
	}

@media(max-width: 1200px) {
	.dj-megamenu-prospekto li a.dj-up_a {
		font-size: 15px !important;
		padding: 0 10px !important;
	}
	.text-desc h4{
		font-size:16px;
	}
	@media(max-width: 768px) {
	.site-grid {
		margin-bottom: 0px !important
	}

	body.itemid-101{
		padding-top:55px !important;
	}
	.footer {
		position: relative !important;
		margin-top: 0 !important;
		text-align: center !important
	}
}
@media only screen and (max-width: 991px){
    ul{width: 300px;}
    .port-4.effect-1 .text-desc,
    .port-4.effect-2 .text-desc,
    .port-4.effect-3 .text-desc, .port-8 .text-desc{padding: 20px;}
    .text-desc{padding: 7px;}
    .port-5.effect-1 .text-desc{padding: 13px 20px 20px 90px;}
    .port-5.effect-2 .text-desc{padding: 10px;}
    .port-5.effect-3 .text-desc{padding: 16px 90px 20px 20px;}
	.text-desc h4{
		font-size:20px;
	}		
}