/* CSS Document */


/*
* makieta 2d
*/
.wrap-makieta2d {
  display: block;
  width: 1140px; max-width: 100%;
  margin: auto auto 50px; }
  .wrap-makieta2d a.powrot-osiedle {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 400;
    margin: 0;
    position: absolute; z-index: 2; 
	right: 0;
	  border: 1px solid #877f77;
    padding: 5px 1em;
    border-radius: 8px;
    color: #877f77;
	  background: rgba(227, 224, 217, .35);
	  width: 175px;
		text-align: center;
}
.wrap-makieta2d a.powrot-osiedle i {
	margin-right: 5px;
}

  .wrap-makieta2d h4 {
    font-size: clamp(16px, 3vw, 25px);
    text-align: left;
    line-height: 1;
    margin: 0 0 50px 50px;
    font-weight: 300;
    color: #877F77; }
    .wrap-makieta2d h4 span {
      display: inline-block; }
      .wrap-makieta2d h4 span.t {
        text-decoration: underline; }
      .wrap-makieta2d h4 span.i {
        font-weight: 400; }
  .wrap-makieta2d .head-start {
    margin: 50px 0; }
    .wrap-makieta2d .head-start img {
      width: 100%; }

.wrap-makieta2d [data-zoom] {display: none;}
.wrap-makieta2d[data-zoom="0"] [data-zoom="0"],
.wrap-makieta2d[data-zoom="1"] [data-zoom="1"],
.wrap-makieta2d[data-zoom="2"] [data-zoom="2"] {display: block;}

.wrap-makieta2d .poj-bud {display: none;}
.wrap-makieta2d .poj-bud.is-visible {display: block;}

.wrap-makieta2d .kond {display: none;}
.wrap-makieta2d .kond.is-visible {display: block;}


  .wrap-makieta2d .poj-bud {
    position: relative;
    top: 0;
    left: 0;
    }


.wrap-makieta2d .poj-bud img {position: relative; width: 100%;}
.wrap-makieta2d .poj-bud svg {position: absolute; z-index: 1; width: 100%; top: 0; left: 0;}


.wrap-makieta2d ._container {position: relative;}
.wrap-makieta2d ._container .svg-cursor {cursor: pointer;}
.wrap-makieta2d[data-zoom="1"] ._container .svg-cursor {fill: #4E4943;  opacity: 0; transition: 0.5s;}
.wrap-makieta2d[data-zoom="1"] ._container .svg-cursor:hover {opacity: 0.7;}

.wrap-makieta2d .INF {display: none;}

.wrap-makieta2d .INF .infM {
          display: none;
          opacity: 0;
          font-size: 14px; }

          .wrap-makieta2d .INF .infM.on {
            display: block;
            opacity: 1; }
          .wrap-makieta2d  .INF .infM text {
            fill: #424242; }
            .wrap-makieta2d .INF .infM text.nr {
              font-weight: 700; }
            .wrap-makieta2d  .INF .infM text.opis {
              font-size: 13px;
              font-weight: 700; }
            .wrap-makieta2d .INF .infM text.cena {
              font-size: 15px; }
            .wrap-makieta2d .INF .infM text.status {
              text-transform: lowercase;
              font-size: 11px; }
            .wrap-makieta2d .INF .infM text.Zobacz-plan {
              fill: #81A187;
              font-size: 11px; }
          .wrap-makieta2d .INF .infM .ramkaTlo {
            filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.5)); }
            .wrap-makieta2d .INF .infM .ramkaTlo path {
              fill: #FFF;
              opacity: 1; }
.wrap-makieta2d .INF .infM[data-promocja="1"] .ramkaTlo path {
          stroke: var(--kolor0); fill: var(--kolor01); }


   
   
  .makieta2d .buttons {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin: 10px 0; }
    .makieta2d .buttons .button {
      color: var(--kolorOFB);
      font-size: 12px;
      font-weight: 400;
      text-transform: uppercase;
      border: 1px solid var(--kolorOFB);
      background: #FFF;
      padding: .75em 1em;
		min-width: auto;
      display: -webkit-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
      -webkit-justify-content: space-between;
      justify-content: space-between;
      margin: 0 5px 10px;
      border-radius: 8px;
      cursor: pointer; }
      .makieta2d .buttons .button span {
        margin: auto;
        line-height: 1; }
      .makieta2d .buttons .button.is-visible {
        background: #bf48002b;
        line-height: 1;
		
        text-align: center; }
      .makieta2d .buttons .button.off {
        opacity: .5;
        cursor: auto; }
    .makieta2d .buttons .powrot {
      margin: 0 0 auto auto;
      font-weight: 400;
		font-size: 11px;
      display: flex;
		justify-content: center;
		gap: 5px;
		align-items: center;
      cursor: pointer; 
		text-transform: uppercase;
border: 1px solid var(--kolorOFB);
    padding: 5px 1em;
    border-radius: 8px;
    color: var(--kolorOFB);
	  background: rgba(227, 224, 217, .35);
		width: 175px;
		text-align: center;
}
      
     
.plany-garaze {display: none; position: relative;}
.plany-garaze.is-visible {display: block;}

.plany-garaze .MKS-msc polygon, 
.plany-garaze .MKS-msc rect, 
.plany-garaze .MKS-msc path {
          cursor: pointer;
          opacity: 0.8; 
	fill: var(--kolorw);
}

.plany-garaze .MKS-msc[data-status="Sprzedane"] polygon, 
.plany-garaze .MKS-msc[data-status="Sprzedane"] rect, 
.plany-garaze .MKS-msc[data-status="Sprzedane"] path,
.plany-garaze .MKS-msc[data-status="Niedostępne"] polygon, 
.plany-garaze .MKS-msc[data-status="Niedostępne"] rect, 
.plany-garaze .MKS-msc[data-status="Niedostępne"] path {
          fill: var(--kolors); cursor: auto; opacity: 0;}

.plany-garaze .MKS-msc[data-status="Rezerwacja"] polygon, 
.plany-garaze .MKS-msc[data-status="Rezerwacja"] rect, 
.plany-garaze .MKS-msc[data-status="Rezerwacja"] path {
          fill: var(--kolorr); }

.plany-garaze .MKS-msc .arrow path {fill: #000; stroke: #000; opacity: 1;}

  .wrap-makieta2d .head-start-budynek {
    
    margin: 50px 0;
    position: relative; }
  .wrap-makieta2d .head-budynek-kondygnacje {
    
    margin: 50px 0;
    position: relative; }


.wrap-makieta2d .MKS-mieszkanie polygon, 
.wrap-makieta2d .MKS-mieszkanie rect, 
.wrap-makieta2d .MKS-mieszkanie path {
          cursor: pointer;
          opacity: 0.4; 
	fill: var(--kolorw);
}

.wrap-makieta2d .MKS-mieszkanie[data-status="Sprzedane"] polygon, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Sprzedane"] rect, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Sprzedane"] path,
.wrap-makieta2d .MKS-mieszkanie[data-status="Niedostępne"] polygon, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Niedostępne"] rect, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Niedostępne"] path {
          fill: var(--kolors); cursor: auto;}

.wrap-makieta2d .MKS-mieszkanie[data-status="Rezerwacja"] polygon, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Rezerwacja"] rect, 
.wrap-makieta2d .MKS-mieszkanie[data-status="Rezerwacja"] path {
          fill: var(--kolorr); }

.wrap-makieta2d .MKS-mieszkanie text {
          fill: #424242;
          font-weight: 300;
          font-size: 12px; }


 .wrap-makieta2d .osiedle-plan-svg {
    position: relative; }
    .wrap-makieta2d .osiedle-plan-svg svg {
      position: relative;
		
      
      width: 100%;
      z-index: 1; }
      .wrap-makieta2d .osiedle-plan-svg svg .obrys-kondygnacja .obrys {
        cursor: pointer;
        fill: #F4E7D4;
        opacity: 0;
	transition: 0.5s;
}

.wrap-makieta2d .osiedle-plan-svg svg .obrys-podpis { opacity: 0; transition: 0.5s; }
        .wrap-makieta2d .osiedle-plan-svg svg .obrys-kondygnacja:hover .obrys {
          opacity: .5; }
		.wrap-makieta2d .osiedle-plan-svg svg .obrys-kondygnacja:hover .obrys-podpis {
          opacity: 1; }
    .wrap-makieta2d .osiedle-plan-svg img {
      position: absolute;
		top: 0;
      left: 0; width: 100%;  z-index: 0;
       }
    .wrap-makieta2d .osiedle-plan-svg .podpisy {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      right: 0; 
	font-size: clamp(12px, 3vw, 17px);
}
      .wrap-makieta2d .osiedle-plan-svg .podpisy .p1 {
        background: #4E4943;
        color: #E3E0D9;
        border-radius: 1.5em;
    	padding: 0.5em 1em;
        text-align: center;
        width: max-content;
        filter: drop-shadow(0, 10px, 20px, #E3E0D9);
        position: absolute;
        line-height: 1;
        z-index: 1; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1 .t {
          font-weight: 700;
          position: relative;
          z-index: 1;
          line-height: 1.3; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1 .m {
          font-weight: 300;
          position: relative;
          z-index: 1;
          line-height: 1.3; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1:before {
          content: '';
          width: 20px;
          height: 20px;
          transform: rotate(45deg);
          background: #4E4943;
          top: calc(100% - 10px);
          left: calc(50% - 20px);
          position: absolute;
          z-index: 0; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pA {
          top: -10px;
          left: 25%; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pB {
          bottom: 5%;
          right: 50%; }
          .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pB:before {
            top: -10px; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pC {
          top: 30%;
          left: 45%; }
        .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pD {
          bottom: 20%;
          right: 15%; }
          .wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pD:before {
            top: -10px; }
  .wrap-makieta2d .head {
    text-align: left; }
    .wrap-makieta2d .head h4 {
      font-size: 25px;
      font-weight: 300;
      line-height: 1;
      margin: 0; }
  
  

    .wrap-makieta2d [data-zoom="2"] .legenda {
      display: -webkit-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
      flex-flow: row wrap;
      -webkit-justify-content: center;
      justify-content: center;
      margin-bottom: 25px; }
      .wrap-makieta2d [data-zoom="2"] .legenda > div {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-flow: row wrap;
        flex-flow: row wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        margin: 5px 0; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div:before {
          content: '';
          width: 15px;
          height: 15px;
          border: 1px solid #000;
          background: none;
          margin: auto 5px; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div span {
          display: inline-block;
          text-align: left;
          margin: auto 0;
          font-size: 9px;
          text-transform: uppercase; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div.rezerwacja:before {
          background: var(--kolorr); opacity: 0.5; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div.sprzedane:before {
          background: var(--kolors); opacity: 0.5; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div.wolne:before {
          background: var(--kolorw); opacity: 0.5; }
        .wrap-makieta2d [data-zoom="2"] .legenda > div.r-U {
          display: none; }
          .wrap-makieta2d [data-zoom="2"] .legenda > div.r-U:before {
            background: #F4E7D4; }
  
    .wrap-makieta2d.kondygnacje-zoom .head-budynek-kondygnacje .container {
      margin: 50px 0; }
    .wrap-makieta2d.kondygnacje-zoom .head-budynek-kondygnacje .buttons {
      margin-left: 50px; }
  
.pozostale-tooltip__content {
	text-align: left;
    display: flex;
    flex-direction: column;
    gap: 5px;
    line-height: 1.2;
}
.pozostale-tooltip {position: relative;}

.pozostale-tooltip__content.promocja:before {
	content: '';
	position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	
	background: var(--kolorOFB);
	opacity: 0.1;
}



/* Responsywność – mniejsze ekrany */
@media (max-width: 768px) {
    
}

@media only screen and (max-width: 1024px) {
	.wrap-makieta2d h4 {margin-left: 0;}
	
}

@media only screen and (max-width: 800px) {
	
}

@media only screen and (max-width: 800px) and (orientation: landscape){

	
	
}
@media only screen and (max-width: 800px) and (orientation: portrait){
	
	
	.wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pC {top: 20%;}
	.wrap-makieta2d .osiedle-plan-svg .podpisy .p1.pD {bottom: 10%; right: 4%;}
	.wrap-makieta2d a.powrot-osiedle {position: relative; margin-bottom: 20px;}
}