@import url("settings.css");

header {background: #fff}
h1 {font-size: 28px; line-height: 1.2em; font-family: var(--header-font); color: var(--color1); }
h2 {font-size: 28px; line-height: 1.2em; font-family: var(--header-font); color: #000; margin-top:20px}
/*h2::after{ content: ''; background: var(--color1); display: block; width: 30px; height:5px;  margin-top:5px;}*/
h3 {margin-top: 20px; color: var(--color1); margin-bottom:10px; line-height: 1.5em; font-size: 20px}
h4 {margin-top: 20px; color: #000; margin-bottom:10px; line-height: 1.5em; font-size: 1.3em}
h5 {margin-top: 20px; font-weight: bold; color: var(--color1); padding-bottom: 5px; margin-bottom:10px; line-height: 1.5em; font-size: 1.3em; border-bottom: 1px solid var(--color1)}
h6 {margin-top: 20px; font-weight: bold; color: #000; line-height: 1em; font-size: 0.8em}

.page-content .news .news {margin-bottom:10px}
.page-title {text-align:center}
.page-title i {font-size: 2em}
.sidebar .tile h3 {font-family: var(--header-font);color: var(--color1)}
.sidebar .tile .tile-icon,header .topbar .address,header .topbar .address a:hover {color: var(--color1)}
.sidebar .tile {border-bottom-color: #ccc}
#top_navbar {flex-direction: column; padding:0}
button.btn-white{background: var(--color1);color:#fff;}
#chooselang_google_content {background: none}
header .topbar .search input {color: #333}
header .topbar .search input:focus, header .search input:active {border: 1px solid #ddd}
#top_navbar .nav-container {width:100%; background: var(--color2);-webkit-box-shadow: 0px 1px 11px -5px rgba(66, 68, 90, 1); -moz-box-shadow: 0px 1px 11px -5px rgba(66, 68, 90, 1);                            box-shadow: 0px 1px 11px -5px rgba(66, 68, 90, 1);}
#menu_sidebar .navbar-brand, header .navbar-brand {padding: 30px 0; font-size: 40px }
#menu_sidebar .navbar-brand small, header .navbar-brand small {color: #74b4f3; letter-spacing:2px}
#menu_top {justify-content: center; background: var(--color2)}
#menu_sidebar ul.navbar-nav li a, header ul.navbar-nav li a {background: var(--color2); color: #fff;border-left:1px solid rgba(255,255,255,0.2);}
#menu_sidebar ul.navbar-nav li a:last-child, header ul.navbar-nav li a:last-child {border-right:1px solid rgba(255,255,255,0.2)}
.content .list2 a p, .content .list2 a em {color: #333;}
header ul.navbar-nav li a i {color: #eee}
header {position:relative}
.navbar-nav .dropdown-menu {background: var(--color2)}
#menu_top a:hover,ul.navbar-nav li.show > a  {background: var(--color1); filter: brightness(90%)}
#menu_sidebar .dropdown-menu, header .dropdown-menu {width:330px !important}
header .topbar {background: unset}
header .topbar .address a {color: var(--color1)}
footer .copyright {background:#1e4076}
#top_navbar .nav-container {z-index:2}
footer .footer-box h4 {color: #fff; text-shadow:unset}
footer a {color: #fff}
.content h2.home a {color: var(--color1)}
footer {color: #fff}
.page-content {background: #fff}
.pagination .page-link:active span, .pagination .page-item.active .page-link {color: #fff}
.header_bg {position: absolute; top: 0; left: 0; object-fit:cover; display:block; width:100%;height:100%; opacity:0.05}
.slider-image>img, .slider-image video {height: unset; object-fit: unset; position: unset; top: unset; left: unset}
#menu_sidebar .navbar-brand, header .navbar-brand {display:flex; flex-direction: column; align-items: center}
#menu_sidebar .navbar-brand img, header .navbar-brand img {margin:10px 0; float: none;   width:200px; height:200px; border-radius:100px; border: 1px solid var(--color1); display:block}
.page-content {padding: 30px 15px}
.sidebar img {height: auto}
.nav-container>.container-lg {position:relative}
/*.logo-round {position:absolute; display:flex; justify-content:center; align-items:flex-start; overflow:hidden; bottom:-50px; left: 50px; width:200px; height:2700px; background:var(--color2);border: 7px solid #fff; border-radius: 100px}*/
.logo-round {position:absolute; display:flex; justify-content:center; align-items:flex-start; overflow:hidden; bottom:-100px; left: -125px; width:300px; height:300px; background:var(--color2);border: 7px solid #fff; border-radius: 50%}

.logo-round i {color: #fff; font-size:80px}
.logo-round img {max-width:100%}
.slider .customNavigation a {background: #fff; color: var(--color1); z-index:2}
.slider .owl-theme .owl-dots .owl-dot.active span {background: var(--color1)}
.slider .owl-theme .owl-dots .owl-dot span{height:30px}
.slider .carousel-one {background: rgba(255,255,255,0.9); color: var(--color1); display:flex !important; flex-direction:column; padding-bottom:30px; justify-content:center; align-items: center; top: 0; right:0;height:100%; width: 350px; left:unset; bottom:unset; transform: unset}
.slider .carousel-one h1 {color: var(--color1);font-family: 'Open Sans';}
.slider .carousel-one p {font-style: normal;text-transform: unset; letter-spacing:2px; font-size: 14px}
.slider .carousel-one a {border-color: var(--color1); color: var(--color1); margin-top:5px}
.slider .carousel-one h1 {font-size:25px}
.slider .carousel-one a:hover {border-color: var(--color2);}


.sidebar a.button  {background:var(--color1);}
.sidebar a.button:hover  {background:var(--color2); color:#fff}

.slider-youtube {height: var(--slider-height)}
.slider-youtube iframe {width:100%;}
.slider-youtube .carousel-one {background: rgba(0,0,0,0.7); color: #fff}
.slider-youtube .carousel-one h1 { color: #fff}
.slider-youtube .carousel-one a { color: #fff; border: 1px solid #fff}
@media (max-width: 1600px){
    .logo-round {left:-50px; bottom: -75px; width:250px; height:250px;}
  
}
@media (max-width: 992px) { 
   
    header .topbar {border-top: 1px solid rgba(255,255,255,0.2);margin-top:5px}
    #top_navbar {flex-direction: unset}
    #menu_sidebar .navbar-brand, header .navbar-brand {margin: 0}
    button.btn-white{background: #fff; color: var(--color1);}
}
@media (max-width: 1400px){
  .logo-round {left:0px; }
    .sidebar {min-width:365px; width:365px}
       #menu_top {justify-content:right}
}
@media (max-width: 1200px) {
     #menu_sidebar .navbar-brand small, header .navbar-brand small  {line-height:20px} 
 
    .sidebar {min-width:265px; width:265px}
    .content .sacraments_nav a {width: 30%; min-height:80px; height:fit-content}
      .logo-round {bottom:-50px; left: 0px; width:200px; height:200px;}
}

@media (max-width: 992px) {
    .slider {height: auto}
.slider .owl-carousel, .slider .owl-carousel .item {height: auto}
     .sidebar .tile .tile-icon, header .topbar .address, header .topbar .address a:hover {color:#fff}
    .nav-container>.container-lg {position:unset}
    .logo-round {display:none}
     .slider .owl-theme .owl-dots .owl-dot span{height:15px; width:15px}
    #chooselang_google_content {background: var(--color1)}
    #menu_sidebar .navbar-brand small, header .navbar-brand small,header .topbar .address a{color: #fff;}
    #menu_top {margin-top:3px}
    header {position:fixed; background: var(--color1)}
    #menu_sidebar .navbar-brand, header .navbar-brand {padding:5px 0}
    .content .sacraments_nav a {width:45%}
    .content .mod-gallery .thumbnail {height: 100px;background-size:cover}
    .slider {margin-top:110px}
    .content .imagebar img {width: 100%}
    #menu_sidebar .navbar-brand, header nav.navbar .navbar-brand {flex-direction: column;margin-top:5px; margin-left:15px; align-items: start; color: #fff}
    #menu_sidebar .navbar-toggler, header .navbar-toggler {right:5px}
    #menu_sidebar .navbar-brand div, header nav.navbar .navbar-brand div {font-family: var(--font-family); flex-direction: row; display:flex; font-size:15px; line-height:1.2em}
    #menu_sidebar .navbar-brand img, header .navbar-brand img {margin: 5px; width:unset; height:50px; float:left; }
    header nav.navbar .navbar-brand div {display: block}
/*    header nav.navbar .navbar-brand div br {display: none}
    header nav.navbar .navbar-brand div span {display: block}*/
    footer img {margin: 0 auto}
    header .navbar-brand small br  {display:none}
    #chooselang_google_content {display:none; top:0; width: 160px}
    #chooselang_google{display: flex}
    #menu_sidebar .dropdown-menu, header .dropdown-menu {width:100% !important}
       #menu_sidebar .navbar-brand small, header .navbar-brand small {font-family: var(--header-font); line-height:19px; font-size: 11px}
}
@media (max-width: 767px) {
    .slider .carousel-one  {background:none; color: #fff}
    .slider .carousel-one h1 {color: #fff; font-size:15px; margin:0;line-height:1.2em; margin-top:30px}
    .slider .carousel-one p {color: #fff; font-size:12px; margin:5px 0;line-height:1.2em}
    .slider .carousel-one a {padding:5px; font-size:10px; margin-top:0px; color: #fff; border-color: #fff}
     .slider .owl-carousel .carousel-one {top:30px; left:0}
    .slider .owl-theme .owl-dots {bottom:0}
    .customNavigation {display:none}
     #menu_sidebar .navbar-brand, header .navbar-brand {padding:0}
    .sidebar {min-width:365px; width:100%}
    .content .mod-gallery .thumbnail {height: 250px}
    .content h2.home {margin-top:10px}
    .page-content {margin-top:0; padding:5px}
/*    .content {padding:0}
    #spowiedz, #kancelaria, #msza, #wcag-options {height: calc(100vh - 158px)}*/
}
@media (max-width: 576px) { 
    .gallery-search input, .gallery-search select {font-size:11px} 
    .content .mod-gallery .thumbnail p {font-size: 11px}
     .content h2.home {font-size: 22px}
    .tile h4{text-align:center}
    #menu_top a:hover {background: #f7f7f7}
    #menu_sidebar ul.navbar-nav li a, header ul.navbar-nav li a {background: #fff}
    .content .mod-gallery .thumbnail {height: 200px !important}
    body {background: #fff}
    header .topbar .address {padding-left:5px}
    a.wcag-button {top:61px;}
    #msza img {display:none}
}