body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
}
p,p1,a,h2 {
  cursor: default;
}
@font-face {
    font-family: myFont1;
    src: url("../font/Lato/Lato-Black.ttf");
 }
 
 /* navbar */
 ul1 {
    z-index: 999;
    list-style-type: none;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    position: fixed;
    width: 100%;
    height: 46px;
    -webkit-box-shadow: 0px 8px 19px 0px rgba(66, 68, 90, 1);
  -moz-box-shadow: 0px 8px 19px 0px rgba(66, 68, 90, 1);
  box-shadow: 0px 8px 19px 0px rgba(66, 68, 90, 1);
  }
  
  li1.left {
    float: left;
  }
  li1.right {
    float: right;
  }
  .logonazwa {
    color: white;
    font-size: 21px;
    font-weight: bold;
    background-color: #056722;
  }
  /*body.light-mode .logonazwa {
    color: black;
  }*/
  
  li1 {
    cursor: pointer;
    display: block;
    color: white;
    text-align: center;
    text-decoration: none;
  } 
  a3 {
    margin: 1px 3px;
    display: flex;
    color: white;
    text-align: center;
    padding: 10px 15px;
    border-radius: 22px;
    text-decoration: none;
    -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
  }
  a4 {
    margin-left: 8px;
    cursor: pointer;
    display: grid;
    color: white;
    text-align: center;
    padding: 11px;
    text-decoration: none;
  }
  a4:hover {
    background-color: rgb(255, 231, 133);
  }
  a1:hover:not(.active) {
    background-color: #111;
  }
  .active1 {
    background-color: #056722;
    font-size: auto;
  }
/* koniec navbar */
/* zdięcia start */
.strweb1 {
    width: auto;
    aspect-ratio: 16/6;
    animation: strimg1 24s;
animation-iteration-count: infinite;
object-fit: cover;
margin: 0;
padding: 0;
display: grid;
  /*box-shadow: 0 0 5px rgb(0, 0, 0 / 15%);
  filter: blur(2px);*/
}
@keyframes strimg1 {
    0% { background: url("../image/slides/1.1.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden; }
    20% { background: url("../image/slides/2.1.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden; }
    40% { background: url("../image/10.jpg")no-repeat center center;
        background-size: cover; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;}
    60% { background: url("../image/4.jpg")no-repeat center center;
        background-size: cover; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden; }
    80% { background: url("../image/2.jpg")no-repeat center center;
        background-size: cover; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;}
    100% { background: url("../image/3.jpg")no-repeat center center;
        background-size: cover; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden; }
    }

.strwebpost {
  display: flex;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(4px);
  /*background-color: rgb(255, 255, 255 / 5%);
  /*box-shadow: 0 0 5px rgb(0, 0, 0 / 15%);
  backdrop-filter: blur(2px);
  padding: 20px;
  border-radius: 20px;*/
}
h1.strtext1 {
    justify-content: center;
    text-align: center;
    text-wrap: balance;
    font-family: myFont1;
    color: aliceblue;
    font-size: 7vw;
    margin-block-start: 0;
    margin-block-end: 0;
    cursor: default;
    font-weight: bold;
    text-transform: uppercase;
    /*-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: rgba(112, 112, 112, 0.799);*/
}
.strbtt {
  transform: translateY(-20px);
    display: flex;
    justify-content: center;
}
button.strbtt1 {
  transition: 0.3s;
  text-transform: uppercase;
  font-size: 110%;
    margin-left: 8px;margin-right: 8px;
    width: clamp(95px, 200px, 570px);
    border: 0px solid; /*#056722;*/
    border-radius: 20px;
    background-color: rgb(68, 119, 80);
    padding-top: 1.5vw;
    padding-bottom: 1.5vw;
}
button.strbtt1:hover {
  transition: 0.3s;
  transform: translateY(-5px);
  box-shadow: 0px 0px 76px 9px #056722;
}
a.linespace {
    transform: translateY(11px);
    background-color: #333;
    width: 32vw;
    height: 2px;
}
/* kafelki miesszkan */
.ctr1 {
  /*display: flex;
  justify-content: center;
  align-content: center;*/
    font-family: Arial, Helvetica, sans-serif;
    margin-left: 10%;
    margin-right: 10%;
}
p.mieszkanianazwa {
  text-align: center;
  margin-block-start: 0.3em;
  margin-block-end: 0.3em;
  font-size: x-large;
  font-weight: 900;
  text-transform: uppercase;
}

.mieszkania {
display: grid;
grid-template-columns: repeat(3,1fr);
gap: 1rem;
}
img.photoimgelement {
  width: 100%;
  border-radius: 8px 8px 0px 0px;
}
@media (max-width: 767px) {
    .mieszkania {grid-template-columns: repeat(2,1fr);}
    .ctr1 {
        margin-left: 0;
        margin-right: 0;
    }
    .ctr2 {
        margin-left: 0;
        margin-right: 0;
    }
    .strweb1 {
        aspect-ratio: 16/7;
    }
    a6.wbrqtext1 {
        font-size: 1em;
    }
    p.wbrqtext2 {
        font-size: 0.55em;
    }
    .sorter1 {
        margin-right: 0px !important;
    }
    #butonf2l {
      margin-right: 0px !important;
      width: 90% !important;
    }
    #butonf2r {
      margin-left: 0px !important;
      width: 90% !important;
    }
    a.flagsoldon {
      font-size: small !important;
    }
}
@media (max-width: 480px) {
    .mieszkania {grid-template-columns: repeat(1,1fr);}
    .ctr1 {
        margin-left: 0;
        margin-right: 0;
    }
    #butonf2l {
      margin-right: 0px !important;
      width: 90% !important;
    }
    #butonf2r {
      margin-left: 0px !important;
      width: 90% !important;
    }
    a.flagsoldon {
      font-size: large !important;
    }
}
.content {
width: 100%;
aspect-ratio: 16 / 11;
background-color: #333;
border-radius: 8px;
margin-bottom: 10px;
padding-bottom: 12px;
}
.photocontent {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 8px;
}
p1.miniopislokalu {
  color: #3b3b3b;
} 
p1.miniopislokalu2 {
  color: #6b6b6b;
  font-size: small;
}
button.butoncheck {
  font-weight: bold;
    transition: 0.3s;
    background-color:/*rgb(250, 250, 250)*/ transparent;
    padding: 9px 25px 9px 25px;
    border: 4px solid rgb(68, 119, 80);
    border-radius: 8px;
    cursor: pointer;
}
button.butoncheck:hover {
    transition: 0.3s;
    color: aliceblue;
    scale: 1.1;
    background-color:rgb(68, 119, 80);
    /*border: 4px solid rgb(68, 119, 80);*/
    box-shadow: 0px 0px 76px 9px #056722;
}
button {
  cursor: pointer;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
i.material-icons {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
  margin: auto;
}
.flagsold {
  position: relative;
  text-align: center;
}
a.flagsoldon {
  position: absolute;
  bottom: 30px;
  right: 30px;background-color: #ffd700;
  padding: 8px;
  border-radius: 8px;
  font-size: medium;
  font-weight: 500;
  text-transform: uppercase;
}
a.flagsoldoff {
  visibility: 0;
  position: absolute;
}
/* koniec kafelki mieszkań */
/* kafelki prom*/
.ctr2 {
    margin-left: 5%;
    margin-right: 5%;
}
/* kafelki zdięcia */
.wbrbox6 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo6.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.wbrbox1 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo1.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.wbrbox2 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo2.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.wbrbox3 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo3.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.wbrbox4 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo4.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.wbrbox5 {
    border-radius: 8px;
    width: auto;
    aspect-ratio: 2/1;
    background: url("../image/promo5.jpeg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
/* koniec kafelki zdięcia */
.wbrboxtext {
    width: auto;
    aspect-ratio: 2/1;
    text-align: center;
    background: linear-gradient(to top, #252525cd,#33333333);
    display: grid;
    align-items: end;
    font-size: 0.7rem;
}
h1.wbrtext1 {
    text-wrap: balance;
    font-size: 1.4em;
    margin-block-end: 6px;
    margin-block-start: 0px;
    cursor: default;
}
h2.wbrtext2 {
    text-wrap: balance;
    font-size: 1.07em;
    color: white;
    margin-block-start: 2px;
    margin-block-end: 8px;
}
a9.wbrtext1 {
  text-wrap: balance;
  font-size: x-large;
  cursor: default;
  color: white;
}
a9.wbrtext2 {
  text-wrap: balance;
  font-size: medium;
  color: white;
}
.wbrboxteks2 {
  transform: translateY(-10px);
}
/* koniec kafelki prom*/
/* text prezentacja */
.wbrq1 {
    display: grid;
    justify-content: center;
    font-size: 1.4em;
    margin-top: 36px;
}
a6.wbrqtext1 {
  font-size: 1.4em;
    text-wrap: balance;
    text-align: center;
    font-family: myFont1;
    margin-block-end: 1px;
    cursor: default;
}
p.wbrqtext2 {
    text-align: center;
    font-family: myFont1;
    margin-block-start: 1px;
}
/* koniec text prezentacja */
/* sorter */
.sorter1 {
    display: flex;
    justify-content: end;
    margin-right: 10%;
    margin-bottom: 8px;
}
button.sorterbtt {
    font-size: 1vh;
    font-family: myFont1;
    border: 1px solid #056722;
    border-radius: 5px;
    background-color: white;
    margin-left: 3px;margin-right: 3px;
}
/* koniec sorter */
/* box mapa */
.mapainfo {
    width: clamp(80px,100%,1000px);
    background-color: #121212;
    border-radius: 8px;
    margin-bottom: 30px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
  .mapmap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto;
    padding: 0vh 4vh 4vh 4vh;
  }
  
  #maps {
    width: 100%;
    border: 0;
    aspect-ratio: 19/9;
    border-radius: 8px;
  }
/* box mapa koniec */
/* diagram faz */
  img.diagramimg {
    border-radius: 8px;
    width: 90%;
  }
  .diagramboxctrimg {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .diagrambox {
    width: clamp(80px,100%,1000px);
    padding: 20px 0px 20px 0px;
    border-radius: 8px;
    background-color: #121212;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
/* koniec diagram faz */
/* tooter */
  .tooter {
    background-color: #121212;
    padding: 20px;
    text-align: center;
    margin: 0;
    margin-left: 0;
    margin-right: 0;
    text-decoration: none;
  }
  p.stupka { 
    margin: 2%;
    color: aliceblue;
    margin-left: 1;
    margin-right: 1;
  }
  a.stupka2 {
    text-decoration: none;
    color: aliceblue;
    font-size: 1,3vh;
  }
/* koniec tooter */
/* prezentacja fazy 2 */
.content2 {
    width: 100%;
    aspect-ratio: 16 / 6;
    background-color: rgb(237, 242, 244);
  }
  .content2imgbox {
    width: auto;
    aspect-ratio: 16/4;
    background: url("../image/slides/2.1.jpg")no-repeat center center;
        background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
        -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
        -moz-background-size: cover; /* optional for Firefox 3.6 */ 
        -o-background-size: cover; /* for Opera 9.5 */
        margin: 0; /* to remove the default white margin of body */
        padding: 0; /* to remove the default white margin of body */
        overflow: hidden;
}
.content3imgbox {
  width: auto;
  aspect-ratio: 16/4;
  background: url("../image/slides/1.1.jpg")no-repeat center center;
      background-size: 100%; /* for IE9+, Safari 4.1+, Chrome 3.0+, Firefox 3.6+ */
      -webkit-background-size: cover; /* for Safari 3.0 - 4.0 , Chrome 1.0 - 3.0 */
      -moz-background-size: cover; /* optional for Firefox 3.6 */ 
      -o-background-size: cover; /* for Opera 9.5 */
      margin: 0; /* to remove the default white margin of body */
      padding: 0; /* to remove the default white margin of body */
      overflow: hidden;
}
.content2teksbox {
    aspect-ratio: 16/4;
    width: auto;
    text-align: center;
    background: linear-gradient(to top, #252525a7,#3333331a);
    display: grid;
    align-items: center;
}
.content2teks2box {
  display: grid;
    color: white;
}
a8.content2teksbox1 {
  margin: auto;
    text-wrap: balance;
    margin-block-start: 0px;
    margin-block-end: 0px;
    font-size: 6vw;
    text-transform: uppercase;
    cursor: default;
    font-weight: 900;
}
a7.content2teksbox2 {
  margin: auto;
    text-wrap: balance;
    margin-block-start: 0px;
    margin-block-end: 0px;
    font-size: 3.6vw;
    text-transform: uppercase;
    cursor: default;
    font-weight: 700;
}
/* koniec prezentacji fazy 2 */
.heartsystem {
    float: right;
    transform: translateY(-22px) translateX(-8px);
    cursor: pointer;
  }
  .heartsystem i.fa {
    color: rgb(30, 30, 30);
    font-size: xx-large;
    font-weight: 999;
  }
.imginfobox {
    display: grid;
grid-template-columns: repeat(1,1fr);
gap: 1rem;
    width: clamp(80px,90%,980px);
    padding: 10px;
    border-radius: 8px;
    background-color: #121212;
}
.imginfo {
    width: clamp(60px,100%,980px);
}
img.infopng {
    width: 100%;
    aspect-ratio: 16/9;
  }
body.light-mode button.strbtt1 {
    color: white;
  }
/* dark mod start */
body.light-mode {
	background-color: rgb(223, 229, 232);
}
body.light-mode ul1 {
	background-color: white;
}
body.light-mode .content {
    background-color: rgb(237, 242, 244);
}
body.dark-mode {
  background-color: #212121;
  color: aliceblue;
} 
body.light-mode #bbritness {
  color: #212121;
}
body.light-mode h1 h1 {
  color: white;
}
body.light-mode a6.wbrqtext1 {
  color: black;
}
body.light-mode .diagrambox {
  background-color: rgb(237, 242, 244);
}
body.light-mode .mapainfo {
  background-color: rgb(237, 242, 244);
}
body.dark-mode h1 h1 {
  color: aliceblue !important;
}
body.dark-mode .content2 {
  color: aliceblue !important;
  background-color: #333 !important;
}
body.dark-mode .heartsystem i.fa {
  color: #ed5454;
}
body.dark-mode button.butoncheck {
  background-color: /*#333*/ transparent;
  color: aliceblue;
}
body.dark-mode button.butoncheck:hover {
  background-color: #056722;
}
body.dark-mode p1.miniopislokalu {
  color: #d8d8d8;
} 
body.dark-mode p1.miniopislokalu2 {
  color: #b6b6b6;
  font-size: small;
}
body.dark-mode a.faza2infobutton {
  color: white;
}
/* dark mod end */
.show {
  visibility: 1;
}
.filterDiv {
  visibility: 0;
}
.btn {
  font-family: myFont1;
  border: 2px solid #63b4fa;
  border-radius: 8px;
  background-color: #63b4fa;
  margin-left: 3px;margin-right: 3px;
}
a.faza2infobutton {
  text-decoration: none;
  color: black;
}
#butonf2l {
  margin-right: 8px;margin-bottom: 6px;
  width: 40%;
}
#butonf2r {
  margin-left: 8px;
  width: 40%;
}
#chaticobox {
  background-color: #63b4fa;
}
#chaticobox:hover {
  background-color: #bd4ce2;
}
#phoneicobox {
  /*background-color: #056722;*/
  background-color: #50c938;
}
#phoneicobox:hover {
  background-color: #f1e86a;
}