:root {
    --primary-color: #36307c; /* Granatowy */
    --secondary-color: #0ff; /* Cyan */
    --tertiary-color: #505050; /* Szary */
    --white-color: white; /* Biały */
    --black-color: black; /* Czarny */
    --yellow-color: yellow;
    --darker-color: rgba(23,52,93,.4);
    --navy-color: rgba(0,97,163,.6);
}

.search-icon {
    content: "\f002";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: var(--white-color);
  display: inline-block;
  width: 20px;
  height: 20px;

}

.header-box:empty {
  display: none;
}


.hide-title {
  display: none;
}

.logo-aos img {
  height: 40px;
  margin-left: 10px;
}

.search-icon::before {
  content: "\f002";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 1.25rem;
  color: var(--white-color);
  display: inline-block;
  width: 20px;
  height: 20px;
}

#footer .ftmenu {
  list-style: none;
  margin: 0;
  padding: 0;
}



.hr, hr {color: rgba(54, 48, 124, 0.16); margin: 50px 0}


@media screen and (max-width:321px) {
    .slider-title {
        font-size: 1.5rem !important;
        padding-bottom: 20px;
    }
}

@media screen and (max-width: 760px) {
        .slider-title {
        padding-bottom: 10px;
    }

.splide__pagination__page  {
width: 5px !important;
height: 5px !important;    
}

.splide__arrow {
    display: none !important;
}

    body #top .search-bip-container {
        position: absolute;
        left: 50%;
    top: 130px;
    z-index: 1000;
        transform: translateX(-50%);
        visibility: hidden;
    }

    body #top .search-bip-container.visible {
    visibility: visible;
    }

    body #top .top-urls {
    width: unset;
    }

    body #top input {
        width: 100%;
    }

    body #top .search-bip-container {
    gap: 0;
    }

    body .top-urls .search-form > div {
    display: grid;
        align-items: center;
        grid-template-columns: auto max-content;
    width: 90vw;
    }

    body #top .wrapper > div:first-of-type {
        
    }

    body .menu-wrapper.active {
    display: grid;
        grid-template-columns: 1fr max-content;
        justify-content: space-between;
    } 

    body .menu-wrapper.active .topmenu {
        grid-column: 2 span;
    }

    body #top .wrapper > div .logo img {
    max-width: 100%;
    max-height: unset;
    margin: 0 auto;
    height: 45px !important;
            padding-right: 15px;
    }





    body #top .wrapper {
    width: 100%;
    justify-content: center;
    height: 65px;

    }

    body #menu .menu-wrapper .submit {
    position: absolute;
    right: 70px;
    } 

    body #menu .menu-wrapper .submit::after {
    content: "\f002";
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        font-size: 23px;
        color: var(--yellow-color);
    }

    body #menu .menu-wrapper .submit.active::after {
        content: "\f078";
        font-family: "Font Awesome 6 Free";
    }
}

.high-contrast[style*="background-color: #d7d4e3"] {
    background-color: var(--navy-color) !important;
}

html, body {
  overflow-x: hidden;
}

h1,h2,h3,h4,h5,h6, .h1-like  {color: var(--primary-color);  font-family: 'Inter', 'Arial Black', 'Open Sans', sans-serif;
    font-weight: 700; }


h1 {font-size: 2.7rem;left: 100px;margin: 0;padding: 0;bottom: 49px; line-height: normal}
.h1-like {font-size: 2.7rem !important;left: 100px;margin: 0;padding: 0;bottom: 49px; line-height: normal; margin-top: 0 !important;     padding-left: 100px;
} 
h2 {font-size: 2rem;line-height: normal; line-height: normal; text-align: left;}
h3 {font-size: 1.5rem; line-height: normal}
h5 {margin: 0; padding: 0}
.gallery h3 {font-size: 2rem; }
.gallery{margin-top:3rem}


#content .subpage-list ul li.subpage a:hover {text-decoration: underline 3px;}
.high-contrast #content .subpage-list ul li.subpage a:hover {text-decoration: underline yellow 3px !important;}

.slider-title {
    text-align: right !important;
    font-size: 3rem !important;
    color: var(--white-color); 
    text-shadow: -2px -2px 35px rgba(0, 0, 0, 0.6); /* Czarny cień dla lepszej czytelności */
        line-height: 1.2;
}
.violet {color: var(--primary-color);}
.white {color: var(--white-color);}




@media screen and (max-width: 767px) {
    #header .wrapper #header-bg {height: 100px !important;}


    #header-bg h1 {         font-size: 1.5rem !important; position: unset !important; left: unset !important; }
#header .wrapper #header-bg {position: relative; height: 100px; }
 .dobry-posilek h2 {
    padding-top: 0px !important;
}
            .box.banner {
            flex-direction: column;
        }

        body #top .wrapper a.logo {width: 100%}
.menu-mobile {
    text-align: center;
}
.menu-mobile {
    display: flex;
    justify-content: center;
    align-items: center;
   
}

    body.home #header .wrapper #header-bg {height: 487px; min-height: 487px}

    .top-urls {
    justify-content: flex-end;
    }

    #header-bg img {
        mask-image: unset !important;
        -webkit-mask-image: unset !important;
    }

    .slide-text {
        position: absolute;
        bottom: 2%;
        font-size: 1.7rem;
        padding: 0 20px;
        left: unset !important;
        text-align: left;
        max-width: 600px;
        color: #fff;
        line-height: 1.2;
        width: 100%;
        top: unset !important;
        transform: unset !important;
        right: unset !important;
    }

.slider-title {
    text-align: left !important;
    font-size: 1.75rem !important;
    color: var(--white-color);
}

.splide__arrow {
display: none}

}
/* koniec 768px */

#header-bg img {
  display: block;
  position: absolute;
  right: 0;
  width: 100%;
  
  mask-image: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
 -webkit-mask-image: linear-gradient(to left, rgb(0 0 0) 100%, rgb(0 0 0) 40%, rgb(0 0 0 / 30%) 75%);
}

@media screen and (max-width: 321px) {

    body #menu .menu-wrapper .submit {
        right: 70px;
    }


    #menu .fb-icon-mobile {
    right: 156px !important;
    }

    #menu .accessibility-icon-mobile {
        right: 118px;
    }
    
    .slide-text {
        position: absolute;
        bottom: 2%;
        font-size: 1.7rem;
        left: 20px;
        text-align: left;
        max-width: 600px;
        color: #fff;
        line-height: 1.2;
        width: 100%;
        top: unset !important;
    }



body.home #header .wrapper #header-bg  {
    height: calc(100vh - 130px);
    height: calc(100svh - 130px);
            min-height: 340px !important;
}

}



body { margin: 0; padding: 0; color: #505050; background: #fff; }
body, input, textarea, select { font: 16px "Open Sans", Arial, Helvetica, sans-serif; line-height: 26px;font-weight: 400;}


a { text-decoration: none;}
a:hover { text-decoration: underline;}
a img { border: none; }
p { margin: 1.3em 0; font-family: 'Open Sans', sans-serif; font-weight: 400; }


#content ul {}
#content ul li {
    background: none; /* Usunięcie obrazka */
    padding-left: 5px; /* Odsunięcie tekstu */
    position: relative;
    font-style: normal;
}

#left-col > div > ol > li:not(:last-child) {
    margin-bottom: 10px;
}

li > ul {
    margin-top: 8px;
}

ul { margin: 0; padding: 0; list-style: none; }



ul {
            margin: 20px 0;
            padding-left: 20px;
            list-style-type: disc;
        }

        ul li {
            line-height: 1.5;
            font-weight: 400 !important;
        }

        ul ul {
            margin-top: 5px;
            padding-left: 25px;
            list-style-type: circle;
        }

        ul ul li {
            margin-bottom: 5px;
        }

        ul ul ul {
            list-style-type: square;
        }

}

/* Domyślnie usuwamy punktorowanie ze wszystkich list */
ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}

/* Zachowanie menu w niezmienionej formie */
ul.topmenu,
ul.lvl2 {
    list-style-type: none;
    padding-left: 0;
    margin: 0px !important;
}

/* Styl dla zwykłych list (nie będących menu) */
ul:not(.topmenu):not(.lvl2) {
    list-style-type: disc; /* Standardowe punktorowanie */
    list-style-position: outside; /* Punktory na zewnątrz */
    padding-left: 20px; /* Wcięcie dla punktorów */
}

ul:not(.topmenu):not(.lvl2) li {
    margin-bottom: 0px; /* Odstęp między elementami */
}

/* Opcjonalne wyróżnienia */
ul:not(.topmenu):not(.lvl2) li.first-child {
    font-weight: bold;
}

ul:not(.topmenu):not(.lvl2) li.last-child {
    font-style: italic;
}


/* Styl dla menu bocznego – element z id right-col i klasą submenu */
#right-col .submenu {
    padding: 10px;
}

/* Styl listy w menu bocznym */
#right-col .submenu ul {
    list-style: none; /* Usunięcie domyślnego punktorowania */
    margin: 0;
    padding: 0;
}

/* Styl poszczególnych elementów listy w menu bocznym */
#right-col .submenu ul li {
    padding: 0px 10px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 3px;
    font-size: 16px !important;
}

/* Usunięcie obramowania dla ostatniego elementu */
#right-col .submenu ul li:last-child {
    border-bottom: none;
}

/* Styl linków w menu bocznym */
#right-col .submenu ul li a {
    text-decoration: none;
    color: #333; /* Przykładowy kolor tekstu */
}

/* Opcjonalnie: efekt hover dla linków */
#right-col .submenu ul li a:hover {
    color: #007acc; /* Kolor po najechaniu */
}



    .hide-specific-image {
        display: none !important;
    }


table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 2rem;
}

th, td {
  border: 1px solid #ccc;
  padding: 0.5rem;
  text-align: center;
}

th[scope="row"] {
  text-align: left;
}

caption {
  caption-side: top;
  text-align: left;
  font-weight: bold;
  padding: 0.5rem 0;
}



a.pdf {
  display: inline-block;
  padding: 0.5em 1em;
  background-color: #f2f2f2; /* kontrastowy niebieski */
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}

a.pdf:hover,
a.pdf:focus {
  outline-offset: 2px;
  outline: 2px solid var(--primary-color);
}

a.pdf::before {
    font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f1c1"; /* kod ikony fa-file-pdf */
  color: #d32f2f; /* czerwony PDF-owy kolor */
  margin-right: 0.4em;
  font-size: 1.2em;
}




form { margin: 0 }
table { border-collapse: collapse; }
h1 img, h2 img, h3 img, h4 img { display: block; font-family: 'Fira Sans', sans-serif; font-weight: 700;}
img {margin: 0px; padding: 0px;}

button {
    height: 44px;
    color: var(--white-color);
    border: 0 solid;
    background: var(--primary-color);
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
}


table {
    width: 100%;
    border-collapse: collapse;
}

thead th {
    font-size: 16px;
    text-align: left;
    border-bottom: 2px solid #ddd;
    padding: 8px;
}

tbody td {
    padding: 8px;
    border-bottom: 1px solid #ddd;
}

a[href^="tel:"] {
    color: #007bff;
    text-decoration: none;
}

a[href^="tel:"]:hover {
    text-decoration: underline;
}


/* Header Title */
h2 {
    font-size: 1.5rem;
    margin: 15px 0;
    line-height: 1.4;
}

#breadcrumbs a {
    position: relative;
    padding-right: 20px; /* miejsce na chevron */
    margin-right: 12px;
    color: var(--primary-color);
    text-decoration: underline;
}

#breadcrumbs a::after {
    content: "\203A"; /* znak chevron (›) */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.9em;
        color: var(--black-color);
    
}

#content .box-informacje-ogolne ul li a {
  color: var(--white-color);
}


.high-contrast {
    --primary-color: var(--yellow-color) !important; /* Nowy kolor w trybie kontrastowym */
}
.high-contrast .submit {color: var(--secondary-color); background-color: black; border-color: 2px solid var(--yellow-color);}
.high-contrast #menu {background: var(--darker-color); border-color: var(--yellow-color); border-bottom: 1px solid var(--yellow-color); border-top: 1px solid var(--yellow-color);
}
.high-contrast #menu ul.lvl1 li.lvl1 a.lvl1 { background-color: transparent; color: var(--secondary-color);}
.high-contrast #menu ul.lvl1 li.lvl1 a.lvl1:active {color: var(--black-color) !important;}
.high-contrast #menu ul.lvl1 li.lvl1 a.lvl1:hover  {color: var(--yellow-color) !important;}

.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 {color: var(--black-color)}
.high-contrast #header .wrapper #header-bg .header-box {background-color: var(--black-color); padding-bottom: 30px}
.high-contrast #header .wrapper #header-bg .header-box ul li::before {color: var(--secondary-color);}
.high-contrast  .news-box .news-box-wrapper .news-entry .text p {color: var(--yellow-color);}
.high-contrast  .news-box .news-box-wrapper .news-entry .text h3 {color: var(--secondary-color);}
.high-contrast #font-large-header {border: 1px solid var(--black-color); color: var(--yellow-color);}
.high-contrast #font-medium-header {border: 1px solid var(--black-color); color: var(--yellow-color);}
.high-contrast #font-small-header {border: 1px solid var(--black-color); color: var(--yellow-color);}
.high-contrast .font-size-btn.active {border: 1px solid var(--yellow-color) !important;}
.high-contrast #header .wrapper #header-bg .header-box ul li a {color: var(--yellow-color)}
.high-contrast #footer {background-color: var(--darker-color); border-color: var(--yellow-color); border-bottom: 1px solid var(--yellow-color); border-top: 1px solid var(--yellow-color);}
.high-contrast #footer ul.ftmenu li.lvl1 a.lvl1 {color: var(--secondary-color);}
.high-contrast #footer svg.nfz {fill: var(--secondary-color) !important; color: yellow !important; }
.high-contrast #footer2 .wrapper p.copyright {color: var(--yellow-color);}
.high-contrast #footer2 .wrapper p.created a, #footer2 .wrapper p.privacy-policy a {color: var(--secondary-color)}
.high-contrast .box-text .box-wrapper h2 {color: var(--black-color); background-color: var(--black-color);}
.high-contrast .news-box h2 a {color: var(--yellow-color) !important;}
.high-contrast .box-text .box-wrapper h2 {color: var(--yellow-color);}
.high-contrast #content .submenu ul li.lvl1 a.lvl1 {color: var(--secondary-color); background-color: var(--black-color);}
.high-contrast #content table tr td {color: var(--yellow-color) !important;}
.high-contrast #content table tbody tr td {background-color: var(--navy-color);}
.high-contrast #content table tbody tr:nth-child(even) td {background-color: var(--darker-color); color: var(--yellow-color);}
.high-contrast #content .submenu ul li.lvl1 a.lvl1:hover, #content .submenu ul li.lvl1 a.current {color: var(--yellow-color) !important; background-color: var(--yellow-color);}
.high-contrast #content table th {color: var(--yellow-color); background-color: var(--darker-color)}
.high-contrast p {color: var(--yellow-color);}
.high-contrast #content table tr td {background-color: var(--yellow-color);}
.high-contrast #content h3 a {color: var(--secondary-color);}
.high-contrast ol {color: var(--yellow-color);}
.high-contrast #content ul li {color: var(--yellow-color);}
.high-contrast  .box-text .box-wrapper {  color: var(--secondary-color);    background: var(--black-color);}
.high-contrast  .box-text .box-wrapper a {background: unset !important}
.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {color: var(--secondary-color);}
.high-contrast #content a {color: var(--secondary-color); text-decoration: none !important; background-color: var(--black-color);}
.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2:hover {color: black;}
.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2: {color: yellow;}
.high-contrast .search-form {border: 1px solid var(--primary-color); color: var(--secondary-color);}
.high-contrast input, select, textarea {background: black; border: 1px solid var(--yellow-color) !important;}
.high-contrast textarea {background: black; border: 1px solid var(--yellow-color) !important;}
.high-contrast input:focus, select:focus, textarea:focus {background-color: var(--black-color); color: var(--secondary-color);}
.high-contrast .search-form .submit::after {color: var(--secondary-color);}
.high-contrast .search-form .submit::after:hover {color: var(--black-color);}
.high-contrast .submit:hover {color: var(--yellow-color);}
.high-contrast ::placeholder {color: var(--secondary-color);}
.high-contrast .news-box .news-box-wrapper .news-entry .text .date {color: var(--secondary-color);}
.high-contrast #footer2 .wrapper p.privacy-policy a {color: var(--secondary-color); !important}
.high-contrast .font-size-btn.active {color: var(--secondary-color);}
.high-contrast .font-size-btn {border: unset !important;}
.high-contrast .box-text .box-wrapper .text {background-color: var(--black-color);}
.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 {background-color: var(--black-color)}
.high-contrast #menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {border-bottom: 1px solid var(--black-color);}
.high-contrast .box .text ul li a {color: var(--secondary-color);}
.high-contrast .box-text .box-wrapper a {color: var(--secondary-color) !important;}
.high-contrast #content .submenu ul li.lvl1 a.lvl1.color-secondary,
.high-contrast .btn {background-color: var(--black-color); color: var(--secondary-color) !important; border: 1px solid var(--yellow-color);}
.high-contrast .btn:hover {background-color: var(--yellow-color); color: var(--black-color) !important; border: 1px solid var(--yellow-color);}
.high-contrast #content .submenu ul li.lvl1 a.lvl1.color-secondary, .high-contrast .btn:hover {background-color: var(--yellow-color); color: var(--black-color) !important; border: 1px solid var(--yellow-color);   transition: all 0.3s ease-in-out;}
.high-contrast .pagination a.current, .pagination a {background: var(--black-color);border-color: var(--yellow-color);color: var(--secondary-color) !important;}
.high-contrast .pagination a.current, .pagination a:hover {background: var(--yellow-color);border-color: var(--yellow-color);color: var(--black-color) !important;}
.high-contrast #right-col > div > div > ul > li.lvl1.current > a.color-secondary {color: var(--yellow-color) !important;}
.high-contrast #content .submenu ul li.lvl1 a.lvl1:hover, #content .submenu ul li.lvl1 a.current {background-color: var(--primary-color);}
.high-contrast .pagination a.current, .pagination a:hover {color: var(--black-color) !important;}
.high-contrast #breadcrumbs {border-bottom: 1px solid var(--yellow-color);}
.high-contrast {color: var(--yellow-color) !important;}
.high-contrast .pagination a.n {border: 1px solid var(--yellow-color); color: var(--primary-color) !important;}
.high-contrast .pagination a.next {border: 1px solid var(--yellow-color);}
.high-contrast .pagination a.next:hover {background-color: var(--yellow-color); border: 1px solid var(--yellow-color);}


.high-contrast button {background-color: var(--yellow-color);  background: var(--yellow-color); border: 1px solid var(--yellow-color) !important;     color: var(--black-color); }
.high-contrast button:hover {    background-color: var(--navy-color);
    /* background: var(--darker-color); */
    border: 1px solid var(--yellow-color);
    color: var(--secondary-color);}

    .high-contrast #search-query {border: unset !important}
.high-contrast #contrast-toggle-button {background-color: var(--black-color) !important; border: 1px solid var(--black-color) !important }
.high-contrast #contrast-toggle-button:hover {background-color: var(--black-color) !important; border: 1px solid var(--yellow-color) !important }


.high-contrast #header .wrapper #header-bg {background-color: var(--darker-color)}

h3 a {}

#content h3 a.high-contrast {
    color: var(--secondary-color) !important;
}


#content .wrapper img {width: 100%; height: auto;}


#content .submenu ul li.lvl1 a.lvl1 {
    display: block;
    padding: 5px 10px 5px 35px;
    text-decoration: none;
    background: none; /* Usunięcie obrazka */
    position: relative;
}

#content .submenu ul li.lvl1 a.lvl1::before {
    content: "›"; /* Możesz zmienić na →, » lub > */
    font-size: 16px; /* Dostosuj rozmiar */
    color: var(--primary-color); /* Dostosuj kolor */
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}



@font-face {
    font-family: 'PacjentIcons';
    src: url('/fonts/icons.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.uploadifive-button {
    position: relative;
    display: inline-block;
    width: 150px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: white;
    background: linear-gradient(135deg, var(--primary-color), #564eb0);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
    border: none;
}

.uploadifive-button:hover {
    background: linear-gradient(135deg, #564eb0, var(--primary-color));
    box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.3);
    transform: scale(1.05);
}

.uploadifive-button:active {
    transform: scale(0.98);
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.uploadifive-button input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.contrast-btn i {
color: var(--primary-color);}





.high-contrast .only-contrast {
     display: block;
}
.high-contrast .only-no-contrast {
      display: none;
}

.only-contrast {
    display: none;
}


.font-size-buttons {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: 10px;
}


#font-small {
    font-size: 14px;
}

#font-medium {
    font-size: 18px;
}

#font-large {
    font-size: 22px;
}

#font-medium-header {font-size: 16px !important}
#font-large-header {font-size: 18px !important}

.font-size-container {
    display: flex;
    gap: 5px;
    align-items: center;
}



.font-size-btn {
    font-size: 16px;
    padding: 5px 10px;
    border: 1px solid var(--white-color) !important;
    background: transparent !important;
    cursor: pointer;
    font-weight: bold;
    transition: background 0.3s ease-in-out, transform 0.2s;
    color: var(--primary-color);
}


.font-size-btn.active {
    background: var(--secondary-color);
    color: var(--primary-color) !important;
    font-weight: bold;
    border-color: 1px solid var(--yellow-color) !important;
}



.title-header {
    position: absolute;
    top: 28px !important; 
    left: 184px !important;
    font-size: 1.125rem !important;
    color: #706e75 !important;
    font-weight: normal !important;
    text-align: left !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
    clear: both !important;
}

@media screen and (max-width: 760px) {
.title-header  {
        padding-top: 5px !important;
        margin-bottom: 0px !important;
        margin-top: 0 !important;
        padding-right: 3px !important;
        font-size: 13px !important;
    }
}

@media screen and (max-width: 1020px) {
    .title-header {
        position: static;
        float: right;
        max-width: 60%;
        text-align: right;
        margin-right: 0px;
        clear: both;
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 13px;
    }
}






#left-col > div.pagination > a.n.current {
    color: var(--white-color); /* Kolor tekstu */
    text-decoration: none !important; /* Brak podkreślenia */
}

.facebook-like {
margin-right: 130px;
text-align: right;
}




#info-list {
    display: block; /* Lista widoczna domyślnie */
}

@media (max-width: 768px) {
    #info-list {
        display: none; /* Ukryj listę na mobile */
    }
}

#info-select {width: 216px}



/* Wrapper styling */
#wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    padding: 20px;
}

/* Logo */
.logo img {
    height: unset;
}

#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2:hover {
    color: var(--primary-color);
  
}

.registration-info {
    display: none; /* Domyślnie ukryj sekcję */
}



/* 🔹 Ogólna konfiguracja wrappera */
#top .wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 1170px;
}

/* 🔹 Logo po lewej */
#top .logo img {
    height: 50px;
}

/* 🔹 Nawigacja + Wyszukiwarka + BIP w jednej linii */
.top-urls {
    display: flex;
    align-items: center;
    gap: 20px;
}

/* 🔹 Facebook Link */
.top-urls .urls {
    list-style: none;
    margin: 0;
    padding: 0;
}

.top-urls .urls li {
    display: inline-block;
}

.top-urls .urls a {
    text-decoration: none;
    color: white;
    font-size: 16px;
}

/* 🔹 Kontener wyszukiwarki i BIP */
.search-bip-container {
    display: flex;
    align-items: center;
    gap:30px;
}

/* 🔹 Wyszukiwarka */
.search {
    display: flex;
    align-items: center;
}

.search input {
    padding: 0px;
    border-radius: 0px;
    border: 2px solid var(--primary-color)
}

.search button {
    background: var(--primary-color);
    border: none;
    padding: 10px;
    cursor: pointer;
    color: white;
    margin-left: -6px;
    padding-left: 14px;
    padding-right: 14px;
}

.bip-link img {
    height: 40px; /* Dostosuj wysokość */
    display: block;
}



/* Top URLs (Facebook and Search) */
.top-urls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1px;
}

.urls {
    list-style: none;
    padding: 0;
    margin: 0;
}

.urls li {
    display: inline;
    margin-right: 15px;
}

.search-form {
    position: relative;
    display: flex;
    align-items: center;
}


.search-form .submit::after {
    content: "\f002"; /* Ikona lupy */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: var(--white-color);
}


.search-box {
    margin-left: auto;
}

/* Facebook Like and BIP */
.additional-info {
display: contents;
justify-content: end;
    align-items: center;
    gap: 20px;
    margin-top: 20px;
}

.facebook-like iframe {
    width: 300px;
    height: 35px;
}

.bip-link img.bip {
    height: 50px;
    width: auto;
}


.zoomable {
    cursor: zoom-in;
    transition: transform 0.2s;
}

.zoomable:hover {
    transform: scale(1.05); /* Delikatne powiększenie przy najechaniu */
}

#content form .button:hover {opacity: 0.8}





/* Style dla linków w sekcji box */
.box .text ul li a {
    color: var(--white-color); /* Kolor tekstu */
    text-decoration: none !important; /* Brak podkreślenia */
}

/* Hover efekt dla linków */
.box .text ul li a:hover {
     border-bottom: 1px solid; /* Brak podkreślenia */
}

/* Styl dla aktywnego linku */
.box .text ul li a.active {
    color: var(--white-color); /* Tekst w kolorze motywu */
}


/*Do wyrzucenia jak przejdziemy na mobilna*/
/*.wrapper {width: 1170px}
#page {width: 100%}
#menu {min-width: 1370px}
#menu .menu {width: 1170px}
#top .wrapper .top-wrapper {width: 1170px}
#header .wrapper {width: 1370px;}
#content .wrapper {width: 1270px;}
body.home #content .wrapper {width:1370px}
#footer {min-width: 1370px}*/

#content a {
    color: var(--tertiary-color);
    text-decoration: underline;
    text-decoration-style: dashed; /* Przerywana linia */
    text-decoration-thickness: 1px; /* Grubość linii */
    transition: text-decoration 0.3s ease-in-out; /* Płynne przejście */
}

#content a:hover {
    text-decoration-style: solid; /* Pełna linia po najechaniu */
    text-decoration-thickness: 2px; /* Nieco grubsza linia */
}

#content  p > a {   

 color: var(--primary-color);
      text-decoration: underline;
    text-decoration-style: dashed; /* Przerywana linia */
    text-decoration-thickness: 1px; /* Grubość linii */
    transition: text-decoration 0.3s ease-in-out; /* Płynne przejście */
}

#content  p > a:hover {
    color: var(--primary-color);
        text-decoration-style: solid; /* Pełna linia po najechaniu */
    text-decoration-thickness: 2px; /* Nieco grubsza linia */
}

#page h2 {
    text-align: left; /* Wyrównanie do lewej, zmień na 'center' dla wyśrodkowania */
    margin-top: 30px;
    z-index: 10;

    clear: both; /* Zapewnia, że nagłówek zacznie się od nowej linii */
}


#left-col h2 + .gallery {
    margin-top: 20px; /* Ustawienie marginesu nad galerią */
    margin-bottom: 5%;
}

#left-col h30 {
    text-align: left; /* Wyrównanie do lewej lub center */
    margin-top: 20px; /* Margines górny */
    margin-bottom: 10px; /* Margines dolny */
    clear: both; /* Zaczyna od nowej linii */
}

@media screen and (min-width: 760px) {
    .gallery.justified-gallery {
        display: block; /* Ustawienie na blok, aby Justified Gallery przejęła kontrolę */
    }

    .gallery:not(.justified-gallery) {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        justify-content: space-between;
    }

    .gallery:not(.justified-gallery) a {
        flex-grow: 1;
        flex-basis: calc(33.33% - 10px);
        height: 200px;
        overflow: hidden;
    }

    .gallery:not(.justified-gallery) img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}


.header-wrapper {
    display: flex;
    align-items: center;       /* Wyrównuje elementy w pionie */
    justify-content: space-between; /* Rozdziela tytuł i filtr na końcach wiersza */
    margin-bottom: 20px;
}

.header-wrapper h2 {
    margin: 0;
    /* Dodatkowe style dla tytułu */
}

.header-wrapper .filter {
    /* Opcjonalnie można ustawić własne style dla filtra */
}


/* Hide input outline (Chrome, Safari) */
button:focus, button:active, input:focus, input:active, textarea:focus, textarea:active, select:focus, select:active {  outline: none !important; }

input, select, textarea { min-width: 200px;
    border-radius: 0 !important;
    outline: none;
    line-height: 34px;
    min-height: 44px;
    padding: 0;
    box-sizing: border-box;
    margin: 0;
    background: #ecebec;
    text-indent: 15px;
    border: 2px solid var(--primary-color) !important;
    padding-top: 2px;
    color: var(--primary-color);

}



input:focus, select:focus, textarea:focus {background: #f4f4f4; }


#content ul li::before {
    content: ""; /* Możesz użyć >, →, ➤, » */
    font-size: 16px;
    color: var(--primary-color); /* Dostosuj kolor */
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
}

#content ul li::before:hover {
    color: var(--white-color);
}


#content table {border-collapse: collapse;  border-spacing: 0px; margin-top: 10px; margin-bottom: 10px; width: 100%}
#content table .lft {text-align: left;}
#content table .rgt {text-align: right}
#content table .ctr {text-align: center}
#content table tbody tr td {background-color: #eae8f1}
#content table tbody tr:nth-child(even) td {background-color: #d7d1e4}
#content .left-col table tbody tr td p {margin-bottom: 0}
#content table tbody tr.last-child td {border: 0 solid}
#content table th { color: var(--white-color); padding: 9px 16px; background: var(--primary-color); text-align: left;}
#content .left-col table thead tr th p {color: inherit; margin-bottom: 0}
#content table tr td { color: #2b2a29; padding: 9px 16px 9px 16px; border: none;}
#content table tr.first-child td {padding-top: 11px;}

.bip-link {
    display: inline-block !important;
    visibility: visible !important;
}

a.logo {}
#top > div > a:hover {border-bottom: 0px solid;}
a.logo img {max-width: 294px; padding-top: 4px;}

#top > div > div.top-urls > ul > li > a:hover {border-bottom: 0px solid; text-decoration: underline;} 
/* Subtelny efekt hover dla zdjęć w galerii */
.gallery .thumb {
   overflow: hidden;
    transition: box-shadow 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}

.gallery .thumb img {
    width: 100%;
    height: auto;
    transition: transform 0.2s ease;
}

.gallery .thumb:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    opacity: 0.9;
    transform: scale(1.02);
}

.gallery .thumb:hover img {
    transform: scale(1.05);
}

/* Ikona lupy */
.gallery .thumb:hover::before {
    content: "";
    background-image: url('/img/loupe.svg');
    background-size: 40px 40px; /* Dopasuj rozmiar lupy */
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px; /* Rozmiar ikony */
    height: 40px;
    transform: translate(-50%, -50%);
    filter: invert(1); /* Biała lupa */
    opacity: 1;
    z-index: 2;
}

/* Półprzezroczyste tło na hover */
.gallery .thumb:hover::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); /* Ciemne półprzezroczyste tło */
    opacity: 1;
    z-index: 1;
}

/* Dodanie napisu "Powiększ" */
.gallery .thumb:hover .caption {
    display: block;
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(53, 26, 19, 0.7); /* Półprzezroczyste tło */
    background: var(--white-color); /* Biały tekst */
    padding: 5px 10px;
    font-size: 14px;
    border-radius: 5px;
    z-index: 3; /* Nad tłem i lupą */
}

/* Ukrycie napisu, gdy nie jest hover */
.gallery .thumb .caption {
    display: none;
}



.dropzone .dz-message {margin: 3em 0 !important}

#breadcrumbs { padding: 0; font-size: 0.8725rem; margin: 0 auto;   border-bottom: 1px solid #d7d8d9;margin-bottom: 25px;}
#breadcrumbs .wrapper {
    padding: 10px 0;
}
#breadcrumbs a {/* line-height: 50px; */ padding-right: 16px; margin-right: 12px;  position: relative; color: var(--primary-color)text-decoration: underline;}
#breadcrumbs a:hover {text-decoration: underline;}
#breadcrumbs strong {font-weight: normal;}

.mobile {display: none}

#menu {clear: both;float: left;width: 100%;background-color:var(--primary-color); display: flex;}
#menu .menu {/* float: right */max-width: 1170px;margin: 0 auto;}
#menu .menu-wrapper {float: right}
#menu ul.lvl1 {
}
#menu ul.lvl1 li.lvl1 {
    float: left;
}
#menu ul.lvl1 li.lvl1 a.lvl1 {background: var(--primary-color); color: var(--white-color); padding: 23px 12px; display: block}
#menu ul.lvl1 li.lvl1 a.lvl1:hover {color: #fff70e; text-decoration: none}

#menu ul.lvl1 li.lvl1 a.current,
#menu ul.lvl1 li.lvl1 a.lvl1-parent-current,
#menu ul.lvl1 li.lvl1 a.lvl1-grandparent-current { background-color: yellow !important; color: var(--black-color) !important;}

#menu ul.lvl1 li.lvl1 a.current:hover,
#menu ul.lvl1 li.lvl1 a.lvl1-parent-current:hover,
#menu ul.lvl1 li.lvl1 a.lvl1-grandparent-current:hover
{ color: var(--primary-color)}
#menu ul.lvl1 li.lvl1 a.strona-glowna {color: transparent; text-indent: -9999px; background: url(../img/menu.home.png) no-repeat bottom; padding-left: 2rem; width: 30px}
#menu ul.lvl1 li.lvl1 a.strona-glowna:hover {background-position: top; background-color: yellow}
#menu ul.lvl1 li.current a.strona-glowna {background-position: top}

#menu ul.lvl1 li.lvl1 ul.lvl2 {position: absolute; visibility: hidden; background-color: rgba(54, 48, 124, 0.91); border-top: 4px solid #fff70e;padding: 10PX 0; z-index: 100}
#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 {padding: 0 20px; margin-top: -1px}
#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2:hover,
#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2-current {background-color: rgba(255, 255, 0, 0.95); repeat-x 0 -10px; color: var(--primary-color)}
#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {
   color: var(--white-color);
    padding: 10px 0;
    display: block;
    border-bottom: 1px solid #a692cd;
}
#menu ul.lvl1 li.lvl1 ul.lvl2 li.last-child a.lvl2 {border: 0 solid}

#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2 a.lvl2:hover,
#menu ul.lvl1 li.lvl1 ul.lvl2 li.lvl2-current a.lvl2
{text-decoration: none; border-color: transparent; color: var(--primary-color);}

#page {
}
.wrapper {max-width: 1170px;margin: 0 auto}
#top {height: 85px; display: flex; align-items: center;}
#top .wrapper { position: relative;height: 80px;clear: both;}
#top .wrapper h2 {
    position: absolute;
    top: 28px;
    left: 184px;
    font-size: 1.125rem;
    color: var(--primary-color);
    font-weight: normal;
}

#content > div > div.boxes.boxes-bottom > div.box.banner.box-bar-kasia > a > img {width:383px}

#top .wrapper img.bip {;right: 10px;top: 77px; width: 120px;
    height: auto;}
#top .wrapper .top-wrapper {max-width: 1170px;margin: 0 auto;}

#top .wrapper .fb-like {position: absolute;right: 22%; top: 77px}

#top .top-urls {

}


#top .top-urls ul.urls {
    float: left;
}
#top .top-urls ul.urls li {
    float: left;
}
#top .top-urls ul.urls li a {
    color: var(--primary-color);
    text-decoration: none
;
    display: block;
    padding: 10px 20px;
}

#top .top-urls .search-box {float: left;}
#top .top-urls .search-box input.query {float: left;width: 242px; }
.search-box button {    height: 44px;     float: left;     border: 0 solid;     width: 50px;}
#top .top-urls .search-box input.query {
    float: left;
    width: 242px;
    background: none;
    color: black;
    border: 3px solid var(--primary-color)
    height: 100%;
}

.accessibility-button {
    background: var(--primary-color) !important;
    
margin-top: 3px;
}

#wide-col ul.search-list {
  list-style-type: disc;
  padding-left: 20px; /* lub inna wartość, która zapewni odpowiedni odstęp */
}



.submit {
    background-color: var(--primary-color);
    color: #FFFFFF;
  border: none;
  padding: 10px;
  margin-left: -6px;
  padding-left: 8px;
  padding-right: 8px;
}

.submit:hover {
  background-color: color-mix(in srgb, var(--primary-color) 90%, white 10%);
}

.submit svg {
  fill: #FFFFFF; /* Biała ikona - dobry kontrast na ciemnym tle */
}

.home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #0078D7; /* Domyślny kolor tła */
  transition: background-color 0.3s ease;
}

.home-icon {
    width: 24px;
    height: 24px;
    stroke: white; /* Biała ikona */
    fill: none;
}

/* Jeśli SVG jest niewidoczne, zmień stroke */
.home-link {
    background-color: #0078D7; /* Niebieskie tło */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border-radius: 50%;
}

.home-link:hover .home-icon {
    stroke: yellow; /* Zmiana koloru po najechaniu */
}

#header {
    clear: both;

}
#header .wrapper {max-width: 1370px}
#header .wrapper #header-bg {position: relative;height: 170px; background-color: ghostwhite; display: flex; align-items: center;  justify-content: flex-start; flex-wrap: wrap; }
body.home #header .wrapper #header-bg {height: 320px;min-height: 564px;}




/* Styl dla nagłówka - ustawienie pozycji absolutnej umożliwia użycie left i bottom */
#header-bg h1 {
  position: absolute;
  left: 100px;
  bottom: 49px;
  font-size: 2.7rem;
  margin: 0;
  padding: 0;
  line-height: normal;
}

.high-contrast #header-bg h1 {
color: var(--yellow-color);
}


#header .wrapper #header-bg .box-youtube {
    width: 251px;
    height: 191px;
    position: absolute;
    left: 470px;
    top: 214px;
}

#info-list {font-size: 17px !important}

#header .wrapper #header-bg .header-box {position: absolute;max-width: 360px;left: 101px;top: 38px; padding: 0 20px; padding-bottom: 20px; border: 1px solid var(--tertiary-color); background-color: rgba(255, 255, 255, 0.44);}
#header .wrapper #header-bg .header-box h2 {font-size: 2.7rem;font-weight: bold;margin-bottom: 27px;    text-shadow: 1px 1px 3px rgba(255, 255, 255, 1);}
#header .wrapper #header-bg .header-box ul {margin: 0;}
#header .wrapper #header-bg .header-box ul li {background: none; list-style: none; padding-left: 24px; position: relative; line-height: 1.2; margin-bottom: 12px;}
#header .wrapper #header-bg .header-box ul li::before {
    content: "\f054"; /* FontAwesome: chevron-right */
    font-family: "Font Awesome 5 Free"; /* FontAwesome */
    font-weight: 900;
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: var(--primary-color);} /* Kolor chevrona */

    #header .wrapper #header-bg .header-box ul li a {color: var(--tertiary-color);}



#header .wrapper #header-bg .box-youtube a {}
#header .wrapper #header-bg .box-youtube a img {
    position: static;
}


body.body-biuletyn-informacyjny *::before {
  content: none !important;
  display: none !important;
}


#content {
}
#content .wrapper {max-width: 1270px;padding-left: 100px}
body.home #content .wrapper {max-width:1370px; padding: 0}
#content #wide-col {padding-bottom: 30px; float: left; width: 100%; clear: both}
#content #left-col {float: left;max-width: 840px;width: 66%;padding-bottom: 30px; padding-top: 20px;}
#content #right-col {float: right;max-width: 382px;width: 30%;padding-bottom: 30px}

#content .submenu {
    padding-right: 70px;
    margin-top: 20px;
}
#content .submenu h3 {color: var(--primary-color); font-size: 1.4rem;padding-left: 18px;margin-bottom: 13px;}
#content .submenu ul {
}

#content .submenu ul li.lvl1 {
    background: none;
    margin: 0;
    padding: 0;
}


#content .submenu ul li.lvl1 a.lvl1:hover,
#content .submenu ul li.lvl1 a.current {background-color: var(--primary-color); text-decoration: none;background-position: 18px 9px; color: var(--yellow-color);}

#content .submenu ul li.lvl1 ul.lvl2 {}
#content .submenu ul li.lvl1 ul.lvl2 li.lvl2 {list-style: none;background-image: none;}
#content .submenu ul li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {display: block; padding: 5px 10px 5px 35px; text-decoration: underline; background: url(../img/submenu.bullet2.png) no-repeat 18px 13px;}
#content .submenu ul li.lvl1 ul.lvl2 li.lvl2 a.lvl2:hover,
#content .submenu ul li.lvl1 ul.lvl2 li.lvl2 a.lvl2-current {background-color: var(--primary-color);
  color: #fff81f; text-decoration: none;background-position: 18px 9px;}


/* Widok listy wpisow */
div.entries-list div.entry { padding: 0 0 20px 0; margin: 0 0 50px 0; clear: both; overflow: auto; position: relative}
div.entries-list div.entry div.photo { position: relative; display: block; float: left;  margin: 0 0px 15px 0; min-width: 100%;}
div.entries-list div.entry div.photo img {display: block; position: relative;max-width: 843px; width: 100%; height: auto;}
@media (max-width: 768px) {
    div.entries-list div.entry div.photo img {max-width: 320px;}
}
div.entries-list div.entry h3 {padding: 0; margin: 0; padding-bottom: 15px; font-size: 2rem;}
div.entries-list div.entry .date {  color: #8e8c8c; font-size:  0.8125rem;padding-bottom: 10px; padding-top:5px}
div.entries-list div.entry img.thumb {margin: 0; position: relative; display: block;}
div.entries-list div.entry p {margin: 0px 25px 0px 0px}
div.entries-list div.entry div.text {margin: 0;}
div.entries-list div.entry div.text-with-image {/* float: left; *//* margin-left: 0; */}
div.entries-list div.entry:last-child {border: 0;}

/* Widok listy wpisow - siatka */
div.entries-list-grid div.entry {float: left;max-width: 130px;text-align: center;margin-right: 45px; margin-bottom: 75px}
div.entries-list-grid div.last-in-row {margin-right: 0}
div.entries-list-grid div.entry div.photo {}
div.entries-list-grid div.entry div.photo img {outline: 1px solid #ccc}
div.entries-list-grid div.entry h3 {clear: both; margin: 0}
div.entries-list-grid div.entry a.more {color: #231f20; text-decoration: underline}
div.entries-list-grid div.entry img.thumb {}
div.entries-list-grid div.entry:last-child {}

div.procurement-list {}
div.procurement-list div.entry {background-color: #ebeaf1; margin-bottom: 0;padding-bottom: 0;}
div.procurement-list div.even {background-color: #d7d4e3}
div.procurement-list .col {float: left;padding-top: 10px;padding-bottom: 10px;}
div.procurement-list .col .date {}
div.procurement-list div.header {background: var(--primary-color); color: var(--white-color); font-size: 0.8rem;padding-bottom: 0;}
.high-contrast div.procurement-list div.header {color: var(--black-color)}
div.procurement-list div.entry .date {color: #505050; font-size: 1rem}
div.procurement-list .col1 {width: 16%;}
div.procurement-list .col1 strong {margin-left: 15px;float: left;}
div.procurement-list .col2 {
    width: 16%;
}
div.procurement-list .col3 {
    width: 47%;
}
div.procurement-list .col4 {width: 21%; text-align: right}
div.procurement-list .col4 .status {margin-right: 15px; float: right}
div.procurement-list .col4 .status strong.status-1 {color: #d89f05}
div.procurement-list .col4 .status strong.status-2 {color: #43b100}
div.procurement-list .col4 .status strong.status-3 {color: #d80505}

.gallery {}
.gallery .thumb {}
.gallery .thumb img {width: 100%; margin-bottom: 0px}

.entry img {
    float: left;
    margin: 0 25px 25px 0;
    max-width: 100%; /* Zapobiega wychodzeniu obrazka poza kolumnę */
    height: auto !important; /* Zachowuje proporcje obrazka */
}

.entry img:hover {
opacity: 0.9;
}


blockquote {
    font-family: Times, "Times New Roman", Georgia, serif;
    font-size: 1.4rem;
    font-style: italic;
    line-height: 1.6;
    color: #333;
    background-color: #fff81f75;
    border-left: 4px solid #ccc;
    margin: 40px 0;
    padding: 15px 20px;
}

blockquote p {
    margin: 0;
    padding: 0;
}

blockquote p:first-of-type {
    font-weight: bold;
    margin-bottom: 10px;
}

#left-col > p:nth-child(6) > a > img {
    max-width: 100%; /* lub inna wartość, np. 300px */
    height: auto; /* Zapewnia proporcjonalność */
    max-width: 840px;
}

#left-col img {
    max-width: 750px;  /* Maksymalna szerokość */
    width: 100%;       /* Dopasowanie do kontenera */
    height: auto;      /* Zachowanie proporcji */
    display: block;
    margin: 0;         /* Wyrównanie do lewej */
    object-fit: contain; /* Zapobiega rozciąganiu */
}

#left-col {
    text-align: left; /* Wyrównanie zawartości do lewej */
}

/* Styl podstawowy pola Dropzone */
#entryPhoto-add {
    position: relative;
    border: 2px dashed #007bff; /* Niebieski obrys */
    border-radius: 10px; /* Zaokrąglone rogi */
    padding: 20px;
    background-color: #f9f9f9; /* Jasne tło */
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); /* Cień wewnętrzny */
    transition: background-color 0.3s, box-shadow 0.3s; /* Efekt animacji */
    text-align: center;
    cursor: pointer;
}

#entryPhoto-add:hover {
    background-color: #e8f0fe; /* Jaśniejszy niebieski odcień przy najechaniu */
    box-shadow: inset 0 0 15px rgba(0, 123, 255, 0.2); /* Mocniejszy cień wewnętrzny */
}

#entryPhoto-add .dz-message {
    font-size: 16px;
    font-weight: bold;
    color: #007bff; /* Niebieski tekst */
    opacity: 0.8;
}

#entryPhoto-add .dz-message:hover {
    opacity: 1; /* Wyrazisty tekst przy najechaniu */
}

#entryPhoto-add:focus {
    outline: none;
    box-shadow: inset 0 0 15px rgba(0, 123, 255, 0.4); /* Wyraźniejszy cień na fokus */
}




.title-caption {
    margin-bottom: 1rem;
    display: block;
    font-size: 16px; /* Opcjonalnie dostosuj rozmiar czcionki */
    color: #666; /* Opcjonalnie dostosuj kolor */
}

#fancybox-title {font-size: 18px;}

.btn {
    margin-top: 20px; /* Odstęp nad przyciskiem */
    padding: 8px 20px;
    background-color: var(--primary-color);
    color: #ffffff !important;
    border: 1px solid var(--primary-color);
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    text-decoration: none;
}

.btn:hover {
color: var(--black-color);


}
.banner-description {
    font-size: 14px;
    color: #505050;
    margin-top: 10px;
    max-width: 330px;
    padding: 10px;
    line-height: 1.5;
}

.box-dobry-posilek-w-szpitalu{
        max-width: 330px;
}


.menu-link {
    text-decoration: none;
    font-weight: bold;
    color: var(--primary-color);
    display: inline-flex;
    align-items: center;
}

.menu-link .chevron {
    font-size: 16px;
    margin-left: 5px;
    transition: transform 0.2s ease-in-out;
}

.menu-link:hover .chevron {
    transform: translateX(3px);
}


.dobry-posilek {
}

.dobry-posilek h2{
font-size: 1.875rem;
color: var(--primary-color);
padding-top: 41px;
padding-bottom: 10px;
}

/* Box z ostatnimi aktualnosciami*/
.news-box {
    max-width: 576px;
    margin-left: 100px; padding-bottom: 15px; padding-top: 41px;
}
.news-box h2 {
    font-size: 1.875rem;
    color: var(--primary-color);
    margin-top: 41px;
}
.news-box h2 a {color: var(--primary-color) !important; text-decoration: none}
.news-box .news-box-wrapper {
}

#header-bg > div.header-box > h3 {font-size: 1.2rem}

.news-box .news-box-wrapper .news-entry {
    clear: both; padding-bottom: 30px
}
.news-box .news-box-wrapper .news-entry p a {
    color: #231f20;
}
.news-box .news-box-wrapper .news-entry a .photo {
    float: left;
    margin: 0 17px 17px 0;
}

.news-box .news-box-wrapper .news-entry a .photo img {
    max-width: 182px; /* Domyślny rozmiar na desktop */
    width: 100%;
    height: auto;
}

/* Powiększenie miniatury do 300px na mobile */
@media (max-width: 768px) {
    .stopka { flex-direction: column;padding-top: 1rem;
}

    .news-box .news-box-wrapper .news-entry a .photo img {
 max-width: unset !important;
    }
}


/* Powiększenie miniatury do 300px na mobile */
@media (max-width: 321px) {
    .news-box .news-box-wrapper .news-entry a .photo img {
        max-width: 300px;
    }
}



.news-box .news-box-wrapper .news-entry a:hover img {    -webkit-filter: brightness(1.05);
    -moz-filter: brightness(1.05);
    -ms-filter: brightness(1.05);
    filter: brightness(1.05);}




.news-box .news-box-wrapper .news-entry .text {padding-right: 20px}
.news-box .news-box-wrapper .news-entry .text h3 {
    margin-bottom: 0;
    font-size: 1.25rem;
}
.news-box .news-box-wrapper .news-entry .text h3 a {}
.news-box .news-box-wrapper .news-entry .text .date {
    font-size: 0.75rem;
    color: var(--primary-color);
}
.news-box .news-box-wrapper .news-entry .text p {
    color: var(--tertiary-color);
    font-size: 0.9375rem; margin: 0.3rem 0; line-height: 1.4;
}

/* Widok listy lekarzy */
div.doctors-list div.doctor { padding: 0 0 20px 0; margin: 0 0 20px 0; position: relative; width: 50%; float: left}
div.doctors-list div.doctor div.photo { position: relative; display: block; float: left;  margin: 0 20px 15px 0;}
div.doctors-list div.doctor div.photo img {display: block; position: relative;}
div.doctors-list div.doctor h3 {padding: 0; margin: 0;margin-top: 20px;margin-bottom: 10px;}
div.doctors-list div.doctor .text a {display: block}
div.doctors-list div.doctor .date {  color: #8e8c8c;    font-size:  0.8125rem;}
div.doctors-list div.doctor img.thumb {margin: 0; position: relative; display: block;}
div.doctors-list div.doctor p {margin: 10px 0;}
div.doctors-list div.doctor div.text {margin: 0;}
div.doctors-list div.doctor div.text-with-image {/* float: left; *//* margin-left: 0; */ font-size: 0.8rem; line-height: normal}
div.doctors-list div.doctor:last-child {border: 0;}

#content form ul.errors {margin-bottom: 20px; }
#content form ul.errors li {color: #ff3300; font-size: 0.875em; font-weight: bold; }
.contact #content form {float: left; width: 100%; margin-top: 10px;}
#content form .f {float: left; margin-bottom: 6px; margin-top: 8px; width: 100%; }
#content form .f-submit {margin-top: 0; }
#content form div.textarea {width: auto; }
#content form .button {margin-bottom: 30px; margin-top: 0px;  margin-left: 21%;width: 40%;margin-top: 10px; font-size: 1rem}
#content form label { float: left; line-height: 38px; width: 21%; }
#content form input {width: 40%; float: left;}
#content form div.f input.error, #content form div.f textarea.error {border-color: #ff3300; margin-bottom: 2px; }
#content form div.errorContainer {clear: both; color: #ff3300; float: left; line-height: 16px; margin: 0px 0 0 0; }
#content form div.required-ffield {display: none; }
#content form div.required-fields-text {display: none; }
#content form div.required-fields-text {color: #9f9f9f; float: left; font-size: 12px; margin-left: 70px; }
#content form div.f span.error {clear: both; color: #ff3300; display: block; font-size: 13px; margin: 0px 0 8px 21%; }
#content form input.button {}
#content form textarea {height: 172px; padding-top: 10px; width: 79%; float: left; color: var(--primary-color);}

#content .subpage-list {margin-top: 16px}
#content .subpage-list ul {}
#content .subpage-list ul li.subpage {width: 50%; float: left; background: none; padding-left: 0; margin: 0; padding-right: 20px;}
#content .subpage-list ul li.subpage a {}
#content .subpage-list ul li.subpage a:hover {color: var(--primary-color)}
#content .subpage-list ul li.subpage a h3  { padding-left: 10px; margin: 10px 0; font-size: 1.25rem;}

.contact table {width: 100%}
.contact table tr {}
.contact table tr td {width: 50%}



#left-col {
    max-width: 843px;
    width: 100%; /* Zapewnia responsywność */
}

#left-col img {
    max-width: 839px;  /* Maksymalna szerokość */
    width: 100%;       /* Dopasowanie do kontenera */
    height: auto;      /* Zachowanie proporcji */
    display: block;
    margin: 0;         /* Wyrównanie do lewej */
    object-fit: contain; /* Zapobiega rozciąganiu */
    float: left;
    padding: 20px 0;
    padding-bottom: 40px;
}

#left-col {
    text-align: left; /* Wyrównanie zawartości do lewej */
}

.boxes {}
.banner img {display: block; max-width: 383px}
.banner:hover {    -webkit-filter: brightness(1.05);
    -moz-filter: brightness(1.05);
    -ms-filter: brightness(1.05);
    filter: brightness(1.05);}

body.home .boxes {clear: both;width: 100%;}
body.home .boxes-bottom .banner {float: left}
body.home .boxes-bottom div.banner:nth-child(1) {width: 26.71532846715328%}
body.home .boxes-bottom div.banner:nth-child(2) {width: 22.7007299270073%}
body.home .boxes-bottom div.banner:nth-child(3) {width: 27.7007299270073%}
body.home .boxes-bottom div.banner:nth-child(4) {width: 27.88321167883212%}

#content > div > div.boxes.boxes-bottom > div.box.banner.box-iso {width: 310px;}


#right-col .submenu a.active,
#right-col .submenu a:focus,
#right-col .submenu a:hover {
    color: var(--yellow-color) !important;
    line-height: 1.5;
    text-decoration: underline;
}


.visually-hidden {  
  position: absolute;  
  width: 1px;  
  height: 1px;  
  padding: 0;  
  margin: -1px;  
  overflow: hidden;  
  clip: rect(0, 0, 0, 0);  
  white-space: nowrap;  
  border: 0;  
}


#left-col > h2 {
    padding-bottom: 20px; /* Odstęp dolny */
    font-size: 24px; /* Rozmiar czcionki */
    font-weight: bold; /* Pogrubienie */
    color: var(--primary-color); /* Kolor tekstu */
    margin-bottom: 20px; /* Dodatkowy margines */
     
}


body.home .boxes .box {float: left;}
body.home .boxes .box-wrapper-aktualnosci {width: 49.34%}
body.home .boxes .box-informacje-dla-odwiedzajacych,
body.home .boxes .box-informacje-ogolne
{width: 22.7%}
body.home .boxes .box-wrapper-wyszukaj-lekarza {width: 27.96%}
body.home .boxes .box-text {max-width: 311px}

.center {text-align: center !important}

.box-text {}
.box-text .box-wrapper {
    background: color: var(--primary-color);
    /* padding: 0 17px; */
}
.box-text .box-wrapper h2 {
    margin: 0;
    background-color: var(--primary-color);
    color: var(--white-color);
    font-size: 1.875rem;
    padding: 41px 17px 7px;
}
.box-text .box-wrapper ul {
    padding: 10px 17px 0 17px;
}
#content .box-text .box-wrapper ul li {

    margin-bottom: 5px;
}
.box-text .box-wrapper a {text-decoration: underline}
.box-text .box-wrapper .text {padding: 20px 0; background-color: var(--primary-color); color: var(--primary-color);}
.box-text .box-wrapper .text .no-margin {margin: 0;text-align: center;}


.box-find-doctor {margin-top: 30px}
.home .box-find-doctor {margin-top: 16px;}
.box-find-doctor .box-find-doctor-content {display: none; max-width: 382px}
.box-find-doctor select {margin: 30px 17px 10px 17px;width: calc(100% - 34px);background-color: #cfced1;}
.home .box-find-doctor select,
.home .box-find-doctor button {/* width: 348px; */}
.box-find-doctor h2 {
    font-size: 1.875rem;
    margin-left: 15px;
    margin-bottom: 28px;
}
.box-find-doctor button {margin-left: 17px; width: 90%; text-align: center}
.box-find-doctor-wrapper {background: url(../img/box-find-doctor.jpg) no-repeat bottom left;min-height: 300px;}
.home .box-find-doctor-wrapper {padding-bottom: 32px;}
.box-find-doctor ul#tabs {
    width: 100%;
    clear: both;
    float: left;
    background-background: var(--white-color);
}
.box-find-doctor ul#tabs li.current {background: url(../img/box-find-doctor-tab.jpg) repeat-x top left}
.box-find-doctor ul#tabs li {background: none; float: left;padding: 0 20px;margin: 0;}
.box-find-doctor ul#tabs li a {color: #a09fa2; font-weight: bold; font-size: 1.125rem; line-height: 2.8125rem}
.box-find-doctor ul#tabs li.current a,
.box-find-doctor ul#tabs li a:hover {color: var(--primary-color) text-decoration: none}


#right-col .box {margin-bottom: 30px}
#right-col .banner {text-align: right;}

/* Lista wyników wyszukiwania */
#wide-col ul.search-list {clear: both; margin-top: 30px; float: left}
#wide-col ul.search-list li {margin-bottom: 20px}
#wide-col ul.search-list li a {display: block}
#wide-col ul.search-list li a.title {color: #544e50; font-size: 1.125rem; font-weight: bold; text-decoration: none}
#wide-col ul.search-list li a.url {}
#wide-col ul.search-list li span {}

.pagination { text-align: center;padding: 20px 0; position: relative; border-top: 1px solid #dddddd; clear: both}
.pagination a.n {min-width: 18px; text-align: center; vertical-align: top; text-decoration: none; padding: 0 6px; color: #306a76; font-size:  0.8125rem; font-weight: 500; display: inline-block;line-height: 32px; font-family: Lato; height: 32px; border: 1px solid #d8d8d8;  text-decoration: none;}
.pagination a.n {margin: 4px;}

.pagination a {background: var(--white-color); border-color: var(--white-color); color: var(--primary-color) !important;}

.pagination a.current, 
.pagination a:hover {background: var(--primary-color); border-color: var(--primary-color); color: var(--white-color) !important;}



.pagination a.prev { margin: 0; width: 150px; padding: 3px 0px; float: left; border: 1px solid #d8d8d8; background-color: var(--white-color); color: var(--primary-color) !important; font-size: 16px;}
.pagination a.next {/* position: absolute; */ right: 0; margin: 0; width: 140px; padding: 3px 0px;float: right;border: 1px solid #d8d8d8; background-color: var(--white-color);color: var(--primary-color) !important;font-size: 16px;}

.pagination a.next:hover, .pagination a.prev:hover {border: 2px solid var(--primary-color); background-color: var(--primary-color); color: var(--white-color) !important;}

.pagination a.next:hover, .pagination a.prev:hover {text-decoration: none; padding: 6px 11px}

.pagination a.prev:hover {background-position: 0 -38px}

.pagination a.next:hover {background-position: 100% -38px; padding: 6px 11px}
.pagination span.prev {margin: 0 11px; width: 10px; padding: 0; color: #da251c;}
.pagination span.next {margin: 0 11px; width: 10px; padding: 0; color: #da251c;}
.pagination a.next span.icons {margin-left: 4px;}
.pagination a.prev span.icons {margin-right: 4px;}

.home #footer {margin-top: 8px;}
#footer {
    background-color: var(--primary-color);
    clear: both;
    float: left;
    width: 100%;
    padding: 40px 0;
    margin-top: 50px;
}
#footer .wrapper {display: flex;         justify-content: space-between;}

#footer ul.ftmenu { display:flex;     align-items: center;
    justify-content: space-between; width: 80%;
}
#footer ul.ftmenu li.lvl1 {
    float: left;

}
#footer ul.ftmenu li.lvl1 a.lvl1 {
    color: var(--white-color);
    font-size: 1.0625rem;
    font-weight: bold;
}
#footer ul.ftmenu li.lvl1 ul.lvl2 {
    margin-top: 5px;
}
#footer ul.ftmenu li.lvl1 ul.lvl2 li.lvl2 {
    display: flex;
    justify-content: space-around;
    align-items: center;
}


#footer ul.ftmenu li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {
    background: var(--white-color);
    font-size: 0.875rem;
}

#footer img.nfz {float: right; height: 50px; width: 120px;     color: var(--white-color);} 

#footer2 {
    clear: both;
    float: left;
    width: 100%;
    padding: 20px;
    margin: auto;
}
#footer2 .wrapper { }
#footer2 .wrapper p { font-size: 13px}
#footer2 .wrapper p.copyright {
    color: var(--tertiary-color);
    float: left; line-height: 1.3; text-align: center;
}
#footer2 .wrapper p.created,
#footer2 .wrapper p.privacy-policy {float: right}
#footer2 .wrapper p.created a,
#footer2 .wrapper p.privacy-policy a {text-decoration: underline; color: var(--tertiary-color);}
#footer2 .wrapper p.created a:hover,
#footer2 .wrapper p.privacy-policy a:hover
{}
#footer2 .wrapper img {border-bottom: 1px solid #c4c3c6;
    padding-bottom: 20px; max-width: 100%;
    
}

.stopka {display: flex; justify-content: space-between; align-items: center;}



#cookieInfoBar { width: 100%; top: 0; border-bottom: 1px solid #D3D0D0; font-size:  0.8125rem; line-height: 22px; text-align: center; width: 100%;   padding: 10px 0;   position: fixed;  z-index: 9999;  background: #efefef;}
#cookieInfoBar a.close { display: inline-block; height: 22px; background: var(--primary-color); background: var(--white-color); margin: 0 8px; text-decoration: none; padding: 0 10px;}
#cookieInfoBar a.close:hover { background: #fef712; color: var(--primary-color)}



/* Ukryj elementy na urządzeniach mobilnych */
.hide-on-mobile {
    display: none; /* Domyślnie ukryte */
}

@media screen and (max-width: 768px) { /* Punkt przerwania dla urządzeń mobilnych */
    .hide-on-mobile {
        display: none; /* Ukryj na urządzeniach mobilnych */
    }
    .hide-on-desktop {
        display: block; /* Pokaż tylko na mobilnych */
    }
}

/* Domyślne wyświetlanie na większych ekranach */
@media screen and (min-width: 769px) {
    .hide-on-mobile {
        display: block; /* Pokaż tylko na desktopie */
    }
    .hide-on-desktop {
        display: none; /* Ukryj na desktopie */
    }
}





@media screen and (max-width: 1390px)
{
    body.home .boxes-bottom div.banner:nth-child(1) {width: 24.715328%;}
    body.home .boxes .box-informacje-dla-odwiedzajacych, body.home .boxes .box-informacje-ogolne {width: 24.7%;}
    body.home .boxes-bottom div.banner:nth-child(4) {
    width: 24.883212%;}
    body.home .boxes-bottom div.banner:nth-child(3) {
    width: 24.70073%;}
    .banner img {   display: block;
    max-width: 315px;}
    .news-box {margin-left: 10px}
    .box-text .box-wrapper h2 {font-size: 1.2rem}
    #menu ul.lvl1 li.lvl1 a.lvl1 {padding-right: 15px; padding-left: 15px; font-size: 1rem}
    #header .wrapper #header-bg .header-box {left: 7%}
    body.home .boxes-bottom .banner {float: left}
    body.home .boxes-bottom .banner img {}
}




@media screen and (max-width: 1024px) {

    #menu ul.lvl1 li.lvl1 a.lvl1 {
    font-size: 14px !important;
        }
    }

@media screen and (max-width: 1020px) {

    a.logo img {max-width: 115px}

    h1 {left: 10px}
    #content .wrapper {padding-left: 5%;padding-right: 5%;}




    #header .wrapper #header-bg img.header {opacity: 0.8; display: none}

    #top .wrapper .fb-like {
    left: 200px;
    top: 150px;
    font-size: 2rem;

}



#header-bg {
  position: relative;
  height: 170px;
  background-color: ghostwhite;
  display: flex;
  align-items: center;
  justify-content: center !important;
  flex-wrap: wrap;
  padding-left: 0px !important;
}

.header {
    display: block;
    width: 100%; /* Dopasowanie obrazka */
    height: auto; /* Zachowanie proporcji */
}

#header-bg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    z-index: 1; /* Gradient nad obrazkiem */
    pointer-events: none; /* Zapobiega blokowaniu interakcji */
    background-size: cover;
    
}

h1 {
    top: 30px; /* Wyśrodkowanie tekstu w pionie */
    left: 10px;
    z-index: 2; /* Tekst nad gradientem */
    font-size: 1.5rem;
    margin: 0;
    text-align: left;
}

.h1-like {
    top: 30px; /* Wyśrodkowanie tekstu w pionie */
    left: 10px;
    z-index: 2; /* Tekst nad gradientem */
    font-size: 1.5rem;
    margin: 0;
    text-align: left;
}





    #content #left-col {
    width: 100%;
}
    #content #right-col {width: 100%;padding-bottom: 10px;}

    #right-col .box {margin-bottom: 0;}
    #right-col .box .box-wrapper {margin-bottom: 50px;}
    #content .submenu {padding-right: 0}
    #content .submenu h3 {padding-left: 0}

    #top {
    height: auto;
    float: left;
    width: 100%;
    position: relative;

}
    form.search {/* display: none */}
    #top .wrapper img.bip {display: none}


    #top .wrapper h2 {position: static;float: right;max-width: 60%;text-align: right;margin-right: 10px;clear: both;padding-top: 20px;padding-bottom: 20px;font-size: 13px;}
    #top .wrapper {position: static}

    #header .wrapper #header-bg .header-box {left: 10px; top: 0px; font-weight: bold}
    #header .wrapper #header-bg .header-box ul { }
    #header .wrapper #header-bg .box-youtube {left: 10px}

    .news-box{margin-left: 10px;max-width: none;}

    body.home #content .wrapper {min-height: 502px}

    /*body.home .boxes .news-box {width: 49.34%;float: left;}
    body.home .boxes .box-text {width: 22.7%}
    body.home .boxes .box-find-doctor {width: 27.96%}
    body.home .boxes .box-text .box-wrapper .text .no-margin a img {width: 100%}*/

    .mobile {display: block}
    .mobile-menu {float: right;width: 68px;height: 50px;background: url(../img/mobile.menu.png) no-repeat top; background-size: 50px; color: transparent;margin-right: 3px;cursor: pointer; transition: background-position 0.3s ease;}

    .box-text .box-wrapper .text .no-margin {text-align: center}
    body.home .boxes .box-text {max-width: 50%}
    .box-wyszukaj-lekarza {/* max-width: 50% */}

    body.home .boxes .box {}
    body.home #content .boxes .box {}
    body.home #content .boxes-bottom .box { width: 50%}
    .banner img {/* height: 100%; */}

    .mobile-menu:hover {
    background-position: bottom;
}


.box.banner {
    text-align: center; /* Wyśrodkowanie zawartości */
}

.banner-link {
    display: flex;
    flex-direction: column; /* Ustawienie obrazka nad tytułem */
    align-items: center;
    text-decoration: none; /* Usunięcie podkreślenia */
}

.banner-img {
    max-width: 100%; /* Obrazek dostosowuje się do kontenera */
    height: auto;
}

.banner-title {
    display: block;
    margin-top: 8px; /* Odstęp od obrazka */
    font-size: 16px;
    font-weight: bold;
    color: var(--primary-color); /* Możesz dostosować */
}


    ul.topmenu {display: none}


    #menu ul.topmenu { width: 100%;display: none;  z-index: 200; left: 0; background: none; padding-top: 10px; padding-bottom: 15px; transition: max-height 0.3s ease-out, padding 0.3s ease-out;}
    

    #menu ul.topmenu li.lvl1 {padding: 0;border: 0 solid;margin: 0;clear: both;float: left;width: 100%;background: rgba(53,26,119,1);}
    #menu ul.topmenu li.lvl1 a.lvl1 {margin-left: 0; display: block; border-bottom: 0 solid;background: var(--primary-color);padding-right: 25px; padding-right: 25px;
        padding-bottom: 9px; padding-top: 10px; text-align: center; font-size: 15px;}
    #menu ul.topmenu li.lvl1-parent-hover a.lvl1 {color: var(--primary-color)}
    #menu ul.topmenu li.current a.lvl1, #menu ul.topmenu li.lvl1-parent-current a.lvl1, #menu ul.topmenu li.lvl1-parent-current:hover, #menu ul.topmenu li.lvl1-parent-hover:hover {color: var(--primary-color) font-weight: 900;}
    #menu ul.topmenu li.lvl1 a.lvl1:hover { color: #fdf819;}
    #menu ul.topmenu li.lvl1 ul.lvl2 {position: static; background: #FFF; border-bottom: 0 solid; float: left; width: 90%; padding: 0 0 0 10%; display: none}
    #menu ul.topmenu li.lvl1 ul.lvl2 li.lvl2 {}
    #menu ul.topmenu li.lvl1 ul.lvl2 li.lvl2 a.lvl2 {color: #323232; font-size: 0.8125em}

    #menu ul.topmenu li.lvl1 a.strona-glowna {background: var(--white-color); text-indent: 0; background: none; width: 100%; color: var(--white-color)}

    .pagination {padding: 0}
    .pagination a.nav {clear: both}


    #footer .wrapper {margin: 0 10px; display: flex; justify-content: center;}
    #footer ul.ftmenu {display: none}
    #footer img.nfz {float: left;margin: 0px 0;}
    #footer {margin-top: 0;padding: 20px 0; height: 50px}

}

@media screen and (max-width: 760px){

    .contact table tr td {
    width: 90%;
}

#content table tr td {
    padding: 16px 16px 16px 16px;
}

#left-col table td:first-child {padding: 16px 16px 0px 16px;}
#left-col table td:last-child {padding: 0px 16px 16px 16px;}


#header {

    background: #efeeef url(../img/bg-header-hp-mobile.jpg) repeat-x;
    background-size: cover; background-position: center right;
}


    #header .wrapper #header-bg .box-youtube {
        width: 100%;
        height: auto;
        position: relative;
        left: 0;
        top: 0px;
    }

    #header .wrapper #header-bg .header-box {

        display: none;
    }


#breadcrumbs {font-size: 0.75rem; line-height: 1.4}

.boxes.boxes-bottom {
    display: grid;
    grid-template-columns: 1fr; /* Domyślnie jedna kolumna */
    gap: 0px; /* Odstępy między elementami */
}

p img {
    max-width: 100%; /* Dopasowuje obraz do szerokości kolumny */
    width: auto !important; /* Nadpisuje sztywne wartości width w HTML */
    height: auto !important; /* Zachowuje proporcje */
}

p img {
    max-width: 100% !important; /* Obraz nie będzie większy niż kontener */
    height: auto; /* Zachowuje proporcje */
    display: block; /* Eliminuje dodatkowe odstępy poniżej obrazka */
    margin: 0 auto; /* Centruje obraz w kontenerze */
}

@media screen and (max-width: 768px) { /* Na urządzeniach mobilnych */

    .grecaptcha-badge  {display: none}

    .boxes.boxes-bottom {
        grid-template-columns: 1fr 1fr; /* Dwie kolumny */
    }
    .box.banner {
        display: flex;
        justify-content: center;
        align-items: center;
    }
.menu-wrapper {
    min-width: 760px !important;
}

}


@media screen and (max-width: 540px) { 
.menu-wrapper {
    min-width: 525px !important;
}
}

@media screen and (max-width: 430px) { 
.menu-wrapper {
    min-width: 425px !important;
}
}


@media screen and (max-width: 390px) { 
.menu-wrapper {
    min-width: 389px !important;
}
}


@media screen and (max-width: 375px) { 
.menu-wrapper {
    min-width: 370px !important;
}
}


@media screen and (max-width: 321px) { 
        #top > div > div.menu-mobile > a.logo.logo-aos.only-no-contrast > img {
        height: 33px !important;
        padding-left: 6px !important;
    }


    body #top .wrapper > div .logo img {
    height: 35px !important;
    padding-right: 8px;
    }

.registration-info {
    padding-left: 7px !important;
}
.stopka {
    flex-direction: column !important;
}

.menu-wrapper {
    min-width: 321px !important;
}

}






.menu-wrapper {
    display: flex; /* Flexbox dla lepszej kontroli układu */
    align-items: center; /* Wyrównanie w pionie */
    justify-content: space-between; /* Rozmieszczenie elementów: rejestracja z lewej, menu z prawej */
    flex-wrap: wrap; /* Umożliwia zawijanie na mniejszych ekranach */
    width: 99%;

}
.registration-info {
    display: flex;
    flex-direction: column; /* Napis nad numerem telefonu */
    align-items: flex-start; /* Wyrównanie środka */
    color: #fff70e; /* Kolor całości */
    font-size: 16px;
    font-weight: bold;
    gap: 0px; /* Odstęp między napisem a numerem */
    padding-top: 4px;
    padding-left: 18px;
}

.registration-info a {
    text-decoration: none;
    color: #fff70e; /* Kolor linku */
    display: flex;
    align-items: center;
}

.registration-info .registration-text {
    font-size: 11px; /* Mniejszy rozmiar napisu "Rejestracja" */
    text-transform: uppercase; /* Wersaliki (opcjonalnie) */
    font-weight: normal; /* Lżejsza czcionka */
    line-height: 1;
}

.registration-info i {
    font-size: 15px; /* Rozmiar ikony telefonu */
    padding-right: 5px; /* Dodany padding */
}


.mobile-menu {
    background: url(../img/mobile.menu2.png)  no-repeat bottom;
            background-size: 50px;
}

.mobile-menu.open {
    background: url(../img/mobile.menu2.png)  no-repeat top;
            background-size: 52px;
}


.topmenu {
    flex: 1; /* Zajmij pozostałą przestrzeń */
    text-align: right; /* Wyrównanie menu do prawej */
}



    div.procurement-list .col {float: left; clear: both; padding: 10px; width: auto }
    div.procurement-list .col1 strong {margin-left: 0}
    div.procurement-list .col4 {text-align: left}
    div.procurement-list .col4 .status {float: none}
    #top .wrapper .fb-like {
    top: 120px;}

    #header .wrapper #header-bg .box-youtube a img {width:100%}
    body.home #header .wrapper #header-bg {min-height: 427px}
    #top .wrapper h2 { padding-top: 5px; margin-bottom: -2px; margin-top:0; padding-right: 5px;}

}
@media screen and (max-width: 640px){
    h1, .h1-like {font-size: 1.75rem !important; margin-top: 0 !important; padding-left: 0 !important}
h2 {font-size: 1.75rem !important;}
h3 {font-size: 1.5rem !important;}
h5 {margin: 0; padding: 0}

    body.home #content .boxes .box { width: 100%;}
#content > div > div.boxes.boxes-bottom > div.box.banner.box-badanie-satysfakcji-pacjentow > a > img, #content > div > div.boxes.boxes-bottom > div.box.banner.box-pracownicze-plany-kapitalowe-z-pko-tfi > a > img, #content > div > div.boxes.boxes-bottom > div.box.banner.box-bar-kasia > a > img {width:100%}


    #content > div > div.boxes.boxes-bottom > div.box.banner.box-pracownicze-plany-kapitalowe-z-pko-tfi {width:100%}
    .banner img { max-width: 100%}

    body.home #content .boxes .box {width: 100% !important;max-width: none;}
    .home .box-find-doctor select, .home .box-find-doctor button {}
    #breadcrumbs {margin-bottom: 0}

    #top .wrapper .fb-like  {
    left: 10PX;
    top: 75px;
}
    #content form label {width: 100%}
    #content form input.text {width: 100%}
    #content form textarea {width: 100%}
    #content form .button {margin-left: 0; width: 100%}
    #footer2 {padding-bottom: 0; max-width: 90%}
    #footer2 .wrapper {padding: 0 0px}
    #footer2 .wrapper p {margin: 0.25rem 0;         font-size: 13px;}
    #footer2 .wrapper p.privacy-policy {float: left; line-height: 1.3; padding: 10px 0px;}

    #content .subpage-list ul li.subpage {width: 100%}
    #top .top-urls ul.urls {display: none}
    #top .top-urls {width: 100%}
    #top .top-urls .search-box {width: 100%}
    #top .top-urls .search-box input.query {
    width: calc(100% - 40px);
}
}

/* Styl dla linków do plików DOC lub DOCX */
a[href$=".doc" i]::before,
a[href$=".docx" i]::before {
  content: url('/img/icons/doc-icon.png');
  display: inline-block;
  vertical-align: middle;
  width: 45px;
  margin-right: 5px; /* odstęp między ikoną a tekstem */
  height: auto;
  transform: scale(0.5);
    text-decoration: none;
}

/* Styl dla linków do plików PDF */
.entry h3 a[href$=".pdf" i]::before {
    content: url('/img/icons/pdf-icon.png');
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    width: 45px;
    height: auto;
    transform: scale(0.5);
    text-decoration: none;
}

/* Styl dla linków do plików ZIP */
a[href$=".zip" i]::before {
  content: url('/img/icons/zip-icon.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
  width: 45px;
  height: auto;
  transform: scale(0.5);
    text-decoration: none;
}

a.pdf-icon::before {
    content: url('/img/icons/pdf-icon.png');
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    width: 45px;
    height: auto;
    transform: scale(0.5);
    text-decoration: none;
}


body.body-szukaj #header-bg > img {
    display: none;
    cursor: pointer;
}

#menu .fb-icon-mobile, #menu .accessibility-icon-mobile {
    display: none;
    cursor: pointer;
}

@media(max-width: 760px) {
    .accessibility-mobile #top .top-urls ul.urls {
        display: block !important;
    }

    .accessibility-mobile #top .top-urls { 
        width: 0 !important;
    }

    .accessibility-mobile #top .top-urls ul.urls .first-child {
    display: none;
    }

    .accessibility-mobile #top .top-urls ul.urls .font-size-container {
        position: absolute;
        top: 130px;
        right: 57px;
        width: auto;
        background: #36307c;
        z-index: 1000;
        padding: 5px 20px;
        border-top: 2px solid #fff70e;
    }

    .accessibility-mobile #top .top-urls ul.urls .font-size-container::after {
    content: '';
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid yellow;
    }

    #top .top-urls ul.urls .font-size-container button {
    color: white;
    }

    #top .top-urls ul.urls .font-size-container .font-size-btn.active, #top .top-urls ul.urls .font-size-container i {
    color: white !important;
    }

    #menu .fb-icon-mobile {
    position: absolute;
    right: 170px;
    height: 27px;
    margin-top: 11px;
    }

    #menu .accessibility-icon-mobile {
    position: absolute;
    right: 119px;
        height: 27px;
        margin-top: 11px;
    }

    #menu .fb-icon-mobile, #menu .accessibility-icon-mobile {
        display: block;        
    }   
}



/* Styl dla aktywnego elementu głównego menu */
.menu li.current > a,
.menu li.active > a {
  background-color: #007acc; /* lub inny kolor */
  color: #fff;
  font-weight: bold;
}

/* Styl dla aktywnego elementu submenu */
.menu ul.lvl2 li.lvl2-current > a {
  background-color: #005fa3;
  color: #fff;
  font-weight: bold;
}



.responsive-contact-table {
  width: 100%;
  border-collapse: collapse;
}

.responsive-contact-table td {
  padding: 8px;
  border: 1px solid #ccc;
}

/* Mobile-friendly stack */
@media (max-width: 600px) {
  .responsive-contact-table, 
  .responsive-contact-table tbody, 
  .responsive-contact-table tr, 
  .responsive-contact-table td {
    display: block;
    width: 100%;
  }

  .responsive-contact-table tr {
    margin-bottom: 12px;
    border-bottom: 2px solid #eee;
  }

  .responsive-contact-table td:first-child {
    font-weight: bold;
    background-color: #f9f9f9;
  }

  .responsive-contact-table td {
    border: none;
    padding: 6px 12px;
  }
}


@media (max-width: 768px) {
    #page h2 {
    text-align: center;

}

    #breadcrumbs {
        margin-bottom: 30px;
    }

  table {
    display: block;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
  }
}

table {
  border-collapse: collapse;
}

th, td {
  padding: 8px;
  border: 1px solid #ccc;
  text-align: left;
}



table.list tr:not(:has(td.f-title a:is(
    [href*="/admin/page/147"],      /* Dydaktyka */
    [href*="/admin/page/229"],      /* Pracownicze Plany Kapitałowe z PKO TFI */
    [href*="/admin/page/838"]       /* Oferty pracy */
))) {
    display: none;
}



.table-scroll-note {
  display: none;
  font-size: 0.95rem;
  color: #333;
  background: #fff8c4;
  border: 1px solid #e0c200;
  padding: 0.5em;
  margin-bottom: 0.5em;
  text-align: center;
  border-radius: 5px;
}

.table-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.table-wrapper table {
  min-width: 600px; /* szerokość większa niż ekran */
  border-collapse: collapse;
}

@media (max-width: 768px) {
  .table-scroll-note {
    display: block;
  }
}

@media (max-width: 768px) {
    .pagination {
        padding: 0;
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-evenly;
        padding-top: 15px;
    }
  .table-wrapper table {
    font-size: 0.85rem; /* lub np. 13px */
    line-height: 120%;
  }

  .table-wrapper th,
  .table-wrapper td {
    padding: 0.4em 0.5em; /* zmniejszamy padding */
  }
}


.table-wrapper th,
.table-wrapper td {
  white-space: normal;        /* zawijanie tekstu */
  word-break: break-word;     /* łamanie długich słów */
  vertical-align: top;     /* WYŚRODKOWANIE pionowe */
}
.table-wrapper td:first-child,
.table-wrapper th:first-child {
  max-width: 200px; /* lub inna wartość dopasowana do projektu */
}


@media screen and (max-width: 760px) {
    #left-col table td:first-child {
        padding: 16px 16px 16px 16px;
    }
        #left-col table td:last-child {
        padding: 16px 16px 16px 16px;
    }
}


.splide__arrow {height: 3em !important; width: 3em !important}

.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 proporcje */
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}