﻿@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&subset=cyrillic,cyrillic-ext,latin-ext');
/* Ukryty tekst dla dostępności */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  color: black !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


body {
	font-family: "Open Sans", Arial, sans-serif;
}
.navbar-toggle {
	background:rgba(0,0,0,0.01) !important;
	border:1px solid rgba(0,0,0,0.15);
}
.navbar-toggle span.icon-bar {
background-color: #777;}

h1 {
	font-weight:300;
	color:#fff;
	font-size:50px;
}

.secimg{
	border-radius: 50%;
}

h4 {
	font-weight:400;
	color:#44a841;
	font-size: 1.7em;
}
.bg-info h2 {
	color:#fff;
}
.bg-info h2 .text-muted {
	color:#ccc;
}

.lead strong {
	font-weight: 500;
}
.navbar-nav > li > a {
	font-size: 1.3em;
	color: #155a1a; /* ciemniejszy zielony dla lepszego kontrastu */
}
.navbar-right > li > a {
	font-size:1em;
}
.navbar-right > li > a {    padding: 5px 15px; display:inline-block;}

@media (min-width:768px) {
	
.navbar-right > li > a {    padding: 10px 8px;     line-height:2.4em;}
.navbar-right {    padding-right: 15px;    padding-left: 15px;}
}


.on-scroll-enable {
	display:inline;}
.onscrolldisable {
	display:none;
	background-color:#66FFFF;
}
.padding-x-10 {
	padding-left:10px;
	padding-right:10px;
}
.padding-x-20 {
	padding-left:20px;
	padding-right:20px;
}
.padding-x-30 {
	padding-left:30px;
	padding-right:30px;
}
.padding-x-40 {
	padding-left:40px;
	padding-right:40px;
}
.padding-x-50 {
	padding-left:50px;
	padding-right:50px;
}
.padding-xl-10 {
	padding-left:10px;
}
.padding-xl-20 {
	padding-left:20px;
}
.padding-xl-30 {
	padding-left:30px;
}
.padding-xl-40 {
	padding-left:40px;
}
.padding-xl-50 {
	padding-left:50px;
}
.padding-xr-10 {
	padding-right:10px;
}
.padding-xr-20 {
	padding-right:20px;
}
.padding-xr-30 {
	padding-right:30px;
}
.padding-xr-40 {
	padding-right:40px;
}
.padding-xr-50 {
	padding-right:50px;
}
.padding-y-10 {
	padding-top:10px;
	padding-bottom:10px;
}
.padding-y-20 {
	padding-top:20px;
	padding-bottom:20px;
}
.padding-y-30 {
	padding-top:30px;
	padding-bottom:30px;
}
.padding-y-40 {
	padding-top:40px;
	padding-bottom:40px;
}
.padding-y-50 {
	padding-top:50px;
	padding-bottom:50px;
}
.padding-yt-10 {
	padding-top:10px;
}
.padding-yt-20 {
	padding-top:20px;
}
.padding-yt-30 {
	padding-top:30px;
}
.padding-yt-40 {
	padding-top:40px;
}
.padding-yt-50 {
	padding-top:50px;
}
.padding-yb-10 {
	padding-bottom:10px;
}
.padding-yb-20 {
	padding-bottom:20px;
}
.padding-yb-30 {
	padding-bottom:30px;
}
.padding-yb-40 {
	padding-bottom:40px;
}
.padding-yb-50 {
	padding-bottom:50px;
}
.zoom-gallery img {
	/*padding-bottom:30px;*/
}
.zoom-gallery a {
	text-align:center;
}
.google-maps {
	border-width: 0px;
	padding: 0px;
	height: 400px;
	margin: auto;
	width: 100%;
}


.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
	margin: auto;
}
.featurette ul {
	padding-bottom:20px;
	font-size:18px;
	color:#555;
}

.carousel-caption {
	background-color:rgba(255,255,255,0.25);
	font-family: 'Open Sans';
}

.carousel-caption h2 {
font-size: 5em;
padding-bottom:0px;
font-weight:300;
font-family: 'Open Sans';
}
.carousel-caption h5 {
font-size: 2em;
color:#000;
font-family: 'Open Sans';
}

.styled {
background:#20a751;
color:#fff;
text-transform:uppercase;
padding-top:20px;
}
.styled2 {
background:#ff7f27;
}

.styled small {
	color:#fff;
	text-transform:none;
}
.naglowek { font-weight:800;
font-size:1.4em;
}

.floating-r {
	margin-left:30px;
	margin-bottom:30px;
	margin-top:15px;
}
.floating-l {
	margin-right:30px;
	margin-bottom:30px;
	margin-top:15px;
}

.clearfix, .spacer {
	height: 30px;
	clear:both;
}
.box {
	box-shadow: 6px 6px 18px 0px rgba(0,0,0,0.41);
	padding:30px;
}


@media (max-width:1200px) {
	h1 {	font-size:1.8em;}
}
@media (max-width:768px) {
	h1 {	font-size:1.2em; padding-top: 10px !important; padding-bottom:10px !important; }
	.navbar-header {	margin-right:auto !important; margin-left:auto !important;	text-align:center;}
	.navbar-toggle {	float:none;}
	.responsive-text-center {	text-align:center;}
	body {	padding-top:223px;}
	.logo-container h3 img {	max-height:80px;}
	.navbar-nav > li > a {    padding-top: 5px;    padding-bottom: 5px;    line-height: 20px;}
	.carousel-caption {	right: 0%;	left: 0%;	padding-bottom: 0px;}
.carousel-caption h2 {font-size: 2em;padding-bottom:20px;font-weight:300;font-family: 'Open Sans';}
.carousel-caption h5 {font-size: 1em;color:#000;font-family: 'Open Sans'; padding-bottom:20px;}
.floating-l {float:none;width:100%;}
.floating-r {float:none;width:100%;}

}
/* Simple Auto Slider Styles */
 .simple-slider {
            position: relative;
            width: 100%;
            max-width: 1170px;
            margin: 0 auto;
            background: #000;
            overflow: hidden;
            
            /* Kluczowe: Ustal aspect ratio aby zarezerwować miejsce */
            aspect-ratio: 1170 / 780; /* 1.5:1 ratio */
            
            /* Alternatywnie można użyć padding-top trick */
            /* padding-top: 66.67%; */ /* 780/1170 * 100% */
        }

        .simple-slider .slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 1s ease-in-out;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .simple-slider .slide.active {
            opacity: 1;
        }

        .simple-slider .slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            
            /* Zapobiegaj layout shift podczas ładowania */
            min-height: 100%;
            background-color: #f0f0f0; /* placeholder color */
        }

        .simple-slider .slide-caption {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            background: rgba(0, 0, 0, 0.7);
            color: white;
            padding: 10px 20px;
            border-radius: 5px;
            font-size: 18px;
            font-weight: bold;
            text-align: center;
            min-width: 200px;
            white-space: nowrap;
        }

        /* Responsywne media queries z smooth transitions */
        @media (max-width: 768px) {
            .simple-slider {
                /* Zachowaj proporcje, ale dostosuj do mniejszych ekranów */
                aspect-ratio: 16 / 9; /* Bardziej mobilny format */
            }
            
            .simple-slider .slide-caption {
                font-size: 14px;
                padding: 8px 15px;
                bottom: 10px;
                min-width: 150px;
            }
        }

        @media (max-width: 480px) {
            .simple-slider {
                aspect-ratio: 4 / 3; /* Jeszcze bardziej kwadratowy na małych ekranach */
            }
            
            .simple-slider .slide-caption {
                font-size: 12px;
                padding: 6px 12px;
                bottom: 8px;
                min-width: 120px;
            }
        }