/*
Theme Name: Osiedla Wroclaw 
Theme URI: http://osiedla-wroclaw.pl
Author: inford.eu
Author URI: http://inford.eu
Description: Template for Osiedla-Wroclaw.pl
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: inford
Tags: INFORD
*/



:root {
 --main1: #393935; 
}

html {
 margin:0!important;
 margin-top:0!important;
 padding: 0; 
}

body {
 margin: 0;
 padding:0;
 background: #fff;
 width:100%; 
 color:#000;
 font-weight:400;
 font-size: 16px;
 line-height:1.7;
 font-family: 'Montserrat', sans-serif; 
 animation-name: fadeIn;
 animation-duration: 1.5s; 
}

    @keyframes fadeIn {
      0%	  { opacity: 0;}	 
	  100% { opacity: 1;}
	}


.mobile {
 display: none;	
}

.menu-button {
 position: absolute;
 right: 10px;
 top:14px;
}

a {
 color: #234267;	
 transition: all .3s ease;
 text-decoration: none; 
}


h2 {
 font-size: 2rem;	
}

h3 {
	
}

.fs-12 {
 font-size: 12px; 
}

.fs-13 {
 font-size: 13px; 
}

.fs-14 {
 font-size: 13px; 
}

img {
 max-width: 100%;
 height: auto; 
}

.bg-gray {
 background: #f1f1f1; 	
}

.btn-slide-more {
 background-color: var(--main1);
 border: none;
 color: #fff;
 font-size: 14px;
 padding: 8px 14px;
 text-align: center;
}

#header {
 padding: 15px 10px 10px 10px;
 position: fixed;
 margin-bottom: 15px;
 top:0;
 left: 0;
 right: 0;
 height: auto;
 width: 100%;
 color: #000;
 z-index: 9999999;  
 transition: all .3s ease;
 background: transparent;
}

#header.header-fixed {
 background: rgba(255,255,255,.95);
}

.page #header {
 background: #f9f9f9;
} 

#header .logo {
 max-height: 80px;	
 transition: all .3s ease; 
}

#header.header-fixed .logo {
 max-height: 50px;	
}

.top-menu-wrapper {
  position: relative;
}


/* Podstawowe menu */
.main-menu {
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.main-menu > li {
 
}
.main-menu a {
  display: block;
  padding: 10px 14px;
  text-decoration: none;
  color: #222;
}

.home #header:not(.header-fixed) .main-menu a {
 color: #fff;	
}

/* Wspólne style podmenu */
.main-menu li > ul {
  position: absolute;
  top: 100%;
  list-style: none;
  margin: 0;
  padding: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  z-index: 1000;
  display: none;
}

/* Standardowe dropdowny */
.main-menu li:hover > ul,
.main-menu li:focus-within > ul {
  display: grid;
}

/* --- MEGAMENU --- */
.main-menu li.megamenu-1 > ul {
  /* bazowo ukryte przez display:none */
  left: 0;
  right: 0;
  width: 100%;
  max-width: none;

  /* nadpisujemy pozycjonowanie względem wrappera, a nie <li> */
  position: absolute;
  top: 100%;
  padding: 24px;
  gap: 20px;
  /* siatka */
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

/* Pokazanie megamenu jako GRID */
.main-menu li.megamenu-1:hover > ul,
.main-menu li.megamenu-1:focus-within > ul {
  display: grid;
}

/* Linki w megamenu */
.main-menu li.megamenu-1 ul li a {
  padding: 6px 8px;
  color: #222;
  font-weight: 500;
}
.main-menu li.megamenu-1 ul li a:hover {
  color: #0073aa;
}




/* Przycisk menu (desktop ukryty) */
.menu-button {
  display: none;
  background: #0073aa;
  color: #fff;
  border: 0;
  padding: 10px 14px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 4px;
}

/* Toggler podmenu (dodamy JS-em) */
.submenu-toggle {
  display: none; /* desktop: ukryty */
  border: 0;
  background: transparent;
  padding: 10px;
  margin-left: auto;
  font-size: 16px;
  cursor: pointer;
}

/* MOBILE */
@media (max-width: 768px) {
  #top-menu-wrapper { position: relative; }

  .menu-button { display: inline-flex; align-items: center; gap: .5rem; }

  /* panel mobilny */
  .main-menu {
    position: absolute;
    top: 100%;
    left: 0; right: 0;
    display: none;                 /* ukryty domyślnie */
    flex-direction: column;
    gap: 0;
    background: #fff;
    border-top: 1px solid #ddd;
    z-index: 1000;
  }
  .main-menu.active { display: flex; }

  .main-menu > li {
    display: flex;                 /* żeby móc mieć przycisk toggle po prawej */
    align-items: center;
    border-bottom: 1px solid #eee;
    position: static;              /* ważne: wyłączamy absolute z desktopu */
  }

  .main-menu > li > a {
    flex: 1 1 auto;
    padding: 12px 14px;
  }

  /* pokaż przyciski rozwijania podmenu */
  .submenu-toggle { display: inline-block; }

  /* wszystkie podmenu w mobile są statyczne i zwinięte */
  .main-menu li > ul {
    position: static;
    display: none;
    padding: 10px 14px;
    background: #f9f9f9;
    box-shadow: none;
    width: 100%;
  }
  .main-menu li.open > ul { display: block; }

  /* MEGAMENU w mobile = zwykła lista na 1 kolumnę */
  .main-menu li.megamenu-1 > ul {
    display: none;
    grid-template-columns: 1fr;    /* nadpisanie siatki */
    padding: 10px 14px;
    width: 100%;
  }
  .main-menu li.megamenu-1.open > ul { display: block; }
}




#stickySlider,
.carousel-inner,
.carousel-item {
 height: 100%;
}

.carousel-caption {
 left: 0;
 right: 0;
 bottom: 0; 
 padding: 30px 15px;
 text-align: left;
 background: rgba(12, 33, 83, 0.7);	
}

#home-slider .carousel-inner h2 {
 font-size: 2.3rem;
 text-shadow: 1px 1px 4px rgba(0,0,0,.5);
 line-height: 1.1;	
}



.home-main-right .wrapper  p {
 margin-bottom: 0;
}

.page-top {
 margin-top: 100px;	
}

.page-title {
 margin-bottom: 30px;	
}

.std-section {
 padding-top: 40px;
 padding-bottom: 40px; 
}

.home-category-area  .sticky-thumbnail {
 margin-bottom: 6px;	
}

.home-category-area h2 {
 color: #111;
 font-size:20px; 
}

.home-category-area h3 {
 font-size: 17px;	
 color: #111; 
}

.home-category-area h2 a,
.home-category-area h3 a {
 color: inherit;	
}

.home-category-area .desc {
 font-size: 95%;
 line-height: 1.4; 
 
}

.category-area-title {
 margin-bottom: 12px; 
}

.category-area-title a {
 color: inherit;	
}


.category-area-title span {
 font-weight: 300; 
 text-transform: uppercase;
 color: #fff;
 display: inline-block;
 padding: 2px 10px; 
 margin-bottom: 0px; 
}

.category-area-title a.cat-right {
 display: inline-block;
 float: right;
 background: transparent!important;
 color: rgba(0,0,0,.6);
 font-size: 90%; 
 padding-left: 15px;
 padding-left: 15px; 
}

.hcat-1 .category-area-title span {
 background: #4caf50; 
}

.hcat-1 .category-area-title {
 border-bottom: 1px solid #4caf50; 
}

.hcat-2 .category-area-title span {
  background: #4db2ec;
}

.hcat-2 .category-area-title {
 border-bottom: 1px solid #4db2ec; 
}

.hcat-3 .category-area-title span {
  background: #f9c100;
}

.hcat-3 .category-area-title {
 border-bottom: 1px solid #f9c100; 
}.carousel-caption {
 left: 0;
 right: 0;
 bottom: 0; 
 padding: 30px 15px;
 text-align: left;
 background: rgba(12, 33, 83, 0.7);	
}

.home-main-right .wrapper  p {
 margin-bottom: 0;
}


.home-category-area  .sticky-thumbnail {
 margin-bottom: 6px;	
}

.home-category-area h2 {
 color: #111;
 font-size:20px; 
}

.home-category-area h3 {
 font-size: 17px;	
 color: #111; 
}

.home-category-area h2 a,
.home-category-area h3 a {
 color: inherit;	
}

.home-category-area .desc {
 font-size: 95%;
 line-height: 1.4; 
 
}

.category-area-title {
 margin-bottom: 12px; 
}

.category-area-title a {
 color: inherit;	
}


.category-area-title span {
 font-weight: 300; 
 text-transform: uppercase;
 color: #fff;
 display: inline-block;
 padding: 2px 10px; 
 margin-bottom: 0px; 
}

.category-area-title a.cat-right {
 display: inline-block;
 float: right;
 background: transparent!important;
 color: rgba(0,0,0,.6);
 font-size: 90%; 
 padding-left: 15px;
 padding-left: 15px; 
}

.hcat-1 .category-area-title span {
 background: #4caf50; 
}

.hcat-1 .category-area-title {
 border-bottom: 1px solid #4caf50; 
}

.hcat-2 .category-area-title span {
  background: #4db2ec;
}

.hcat-2 .category-area-title {
 border-bottom: 1px solid #4db2ec; 
}

.hcat-3 .category-area-title span {
  background: #f9c100;
}

.hcat-3 .category-area-title {
 border-bottom: 1px solid #f9c100; 
}



/*-------------------------------------- single ---------------------------------*/

#tags {
 justify-content: flex-start;
 flex-wrap: wrap;
}

#tags h4 {
 padding-bottom: 5px;	
 border-bottom:1px solid #eee;	
}

#tags a:before {
 font-style: normal;
 content: "#";
 font-weight: normal;
 padding-right: 0.2rem;	
}

#tags a {
 font-size: .80rem;
 border-radius: 1px!important;
 background: #234267;
 color: #fff;
 margin-right: 10px;
 padding: .3rem 1rem;
 margin-bottom: .4rem;
 text-transform: capitalize;
 font-weight: 700;
}

#tags a:hover {
 background: #fe9043;
 color: #fff; 
}

#sidebar h2,
#sidebar h3,
#sidebar h4 {
 margin-bottom: 15px;	
}


#sidebar img {
 transition: all .3s ease;  
}

#sidebar img:hover {
 opacity: 0.8;	
}


#copyright {
 background: #f3f3f3;
 padding: 20px 10px; 
}