@charset "utf-8";
/* CSS Document */
body { font-family: "Oswald", sans-serif; font-optical-sizing: auto; font-weight: 200; font-style: normal; margin: 0px; }
.top_banner {float:left; color: #fff; background-color:#000; width: 100%; height: 50px;}
.top_banner>img {float:left; height: 30px; margin-top:10px; margin-left: 10px;}
.top_banner>a {float:left; color: #FFF; font-family: "Oswald", sans-serif; font-size: 20px; line-height: 50px; margin-left:5px; text-decoration: none;}
.top_banner>a:hover {color:#c02c2c;}
.logo {float:left; width: 20%; height: 150px; display: flex; justify-content: center;  align-items: center; }
.logo>img {float:left; width: 80%; margin: 10%; margin-left: 10%; }
.menu {float:left; width: 80%; height: 150px; position:relative;}
.menu>ul {float:left; width: 100%; padding:0px; margin:0px;  position:relative; height: 100%;}
.menu>ul>li {float:left; list-style: none; width: 25%;  position:relative; height: 100%;}
.menu>ul>li>a {float:left; width: 100%; height: 100%; background-color:#fff; font-size: 24px; text-decoration: none; color: #000; position:relative; display: flex; justify-content: center;  align-items: center; animation-play-state: paused; animation: none; font-weight: 300;}

.menu>ul>li>a>.menu_background {float:left; display: flex;  justify-content: center;  align-items: center; height:100px; animation-play-state: paused;  animation: none;}
.menu>ul>li>a:hover>.menu_background {float:left;width:0px;   animation: rosnie; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards; postion: absolute; z-index: 0; animation-play-state: running;}
#map_c {float: left; width: 100%; min-height: 500px;}
#map {float: left; width: 100%; min-height: 120vw; overflow:visible;}


.banner_contener {float:left; position: relarive; width: 100%;}
.banner {float:left; z-index: 1; width: 100%; height: 800px; overflow:hidden; position:relative; display: flex;  justify-content: center;  align-items: center;}
.banner>img {float:left; height: 100%; bottom:0; object-fit: cover; /* Zapewnia, że obrazek wypełni kontener */  /* Początkowo ukrywa obraz */transition: opacity 0.5s ease-in-out;}
.banner_box {   position: absolute;  margin-top: 5%;  left: 50%;  width:500px;  transform: translateX(-50%);  background: rgba(255,255,255,0.8);  padding: 20px;  z-index: 2;}
.banner_box>img {float: left; width: 50%; margin-left: 25%; margin-top: 10%;   }
.banner_box_text {float:left; width: 90%; margin-left: 5%;  text-align:center; font-size: 1.5vw; font-weight: 300; position:relative;}
.banner_box>a {float: left; width: 80%; margin-left: 10%; font-size: 1.5vw; line-height: 54px; text-align:center; border: 1px solid #9d0000; text-decoration:none; color: #9d0000; margin-top: 5%; font-weight: 300px; margin-bottom: 10%; }
.banner_box>a:hover {animation: tlo; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards;}


  .tile {
  position: absolute;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 0.5s;
  z-index: 1; /* kafelki niżej */
  }

@keyframes tlo {
	0% {background-color: transparent;}
	100% {background-color: #9d0000; color: #FFF;}
	}
	
	@keyframes tlo_2 {
	0% {background-color: #9d0000; color: #FFF;}
	100% {background-color: #FFF; color: #9D0000;}
	}

@keyframes rosnie {
  0% {width: 0%; border: 0px; height:5px;}
  50% {background-color: #9D0000; height: 10px;}
  100% {width: 100%; background-color: #9D0000; height: 100px; color:#FFF;}
}

@keyframes maleje {
  0% {width: 100%; background-color: #9D0000; height: 100px;}
   50% {background-color: #9D0000; height: 10px;}
  100% {width: 0%; border: 0px; height:5px;}
}

.main_content {float:left; width: 100%; }
.main_content>a {float:left; clear: both; font-size: 2vw; line-height: 56px; width: 20%; margin-left: 40%; border: 1px solid #000; text-align:center; text-decoration:none; color: #000; margin-top:2%; margin-bottom: 2%;}
.main_content>a:hover {animation: tlo; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards;}
.main_header {float:left; width: 100%; text-align:center; font-size:2vw; margin-top: 2%; margin-bottom: 2%; font-weight: 400; color: #9D0000; }
.main_header_2 {float:left; width: 100%; text-align:center; font-size:2vw; margin-top: 2%; margin-bottom: 0px; font-weight: 400; color: #FFF; } 
.main_text {float:left; width: 100%;  font-size:2vw; margin-top: 1%; margin-bottom: 1%; text-align:justify; color: #FFF;}
.main_text2 {float:left; width: 100%;  font-size:2vw; margin-top: 1%; margin-bottom: 1%; text-align:justify; color: #000;}
.image_box {float:left; width: 90%; margin: 5%; height: auto; position:relative; margin-top: 0px;}
.image_box>img {float:left; width: 90%; margin: 0px; margin-right: 0px; margin-top: 0px;  border-radius: 20px;}
.prop_box>a {float:left; clear: both; font-size: 28px; line-height: 56px; width: 20%; margin-left: 40%; border: 1px solid #FFF; text-align:center; text-decoration:none; color: #FFF; margin-top:2%; margin-bottom: 2%; position: relative;}
.prop_box>a:hover {animation: tlo_2; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards;}

.prop_box {position:absolute; width: 100%; top: 5%; right: 0;}
.prop_1 {position: relative;  width: 85%; height: auto; background-color: #000; left: 0; padding: 2%; opacity: 0.8; float:right; clear:both; bottom: 0; margin-top: 12%;}
.prop_box>img{float:left; width: 10%; margin-top: 2%; margin-left: 3%; }
.prop_1>a {color: #FFF; text-decoration:none; float:none; display:flex; justify-content: center; font-size: 1.2vw; border: 1px solid #FFF; line-height: 2vw; padding-left: 2%; padding-right: 2%; margin-left: auto; margin-right: auto; width: 200px; }
.prop_1>a:hover {animation: tlo; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards; border: 1px solid #9D000;}
.prop_2 {position: relative;  width: 40%; height: auto; background-color: #000; left: 0; padding: 2%; opacity: 0.8; float:right;  top: 0; margin-top: 5%;}
.prop_2_header {color: #FFF; font-size: 1.5vw;}

.prop_header {float: right; text-align: right; width: 100%; font-size: 1.5vw; color: #fff; font-weight: 400;}
.prop_text {float: right; text-align: justify; width: 100%; font-size: 1.2vw; color: #fff; font-weight: 200; margin-bottom: 2%;}

.right_text_box {float:right; width: 46%; background-color: #9D0000; padding: 2%; margin-right: 5%; margin-top: 1%; position: relative; border-radius: 20px 0px 20px 0px;}
.right_text_box >a {float:left; clear: both; font-size: 28px; line-height: 56px; width: 20%; margin-left: 40%; border: 1px solid #FFF; text-align:center; text-decoration:none; color: #FFF; margin-top:2%; margin-bottom: 2%;}
.right_text_box >a:hover {animation: tlo_2; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards;}

.onas_box_1 {float:left; width: 50%; position: relative; margin-bottom:2%;}
.onas_box_1>img {float:left; width: 100%; border-radius: 0px 30px 0px 0px;}
.onas_box_1_header { background-color:#9D0000; color: #FFF; font-size: 2vw; font-weight: 300; padding: 2%; position: absolute; right: -25px; bottom: -25px; width: 20%; text-align:center; border-radius: 30px 0px 30px 0px;}
.onas_image_box {float:left; width: 80%; margin-left: 10%;}
.onas_image_box>img {float:left; width: 45%; margin: 0px; margin-right: 5%; margin-top: 2%; margin-bottom: 2%;}

.onas_box_2 {float:left; width: 100%; position: relative; margin-bottom:2%; margin-top:5%; margin-bottom: 5%;}
.onas_box_2_text {float:left; width: 80%; margin-left: 10%; color:#FFF; font-size: 1.2vw; text-align:center;}
.onas_box_2>img {float:left; width: 100%; opacity:0.8;}
.logo_onas_box_2 {position: absolute; width: 30%; float:left; margin-left: 35%; margin-top: 5%;}
.logo_onas_box_2>img {float:left; width: 100%;}
.onas_box_2_redbox1 {position: absolute; margin: 2%; bottom: -5vw;  background-image: radial-gradient(circle, #730000, #9D0000, #730000);  width: 21%; height: 21vw;  float:left; animation: gradient-animation 10s infinite linear;  background-size: 400% 100%;box-shadow: 0 4px 8px rgba(0,0,0,0.3);}
.onas_box_2_redbox1>img {float:left; width: 30%; margin: 10%;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.onas_box_2_redbox1>img:hover {rotate: 20deg;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; scale: 1.2;}
.onas_box_2_redbox2 {position: absolute; margin: 2%; bottom: -5vw; margin-left: 27%; background-image: radial-gradient(circle, #730000, #9D0000, #730000);  width: 21%; height: 21vw; float:left; animation: gradient-animation 10s infinite linear;  background-size: 400% 100%;box-shadow: 0 4px 8px rgba(0,0,0,0.3);}
.onas_box_2_redbox2>img {float:left; width: 30%; margin: 10%;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.onas_box_2_redbox2>img:hover {rotate: 20deg;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; scale: 1.2;}
.onas_box_2_redbox3 {position: absolute; margin: 2%; bottom: -5vw; margin-left: 52%; background-image: radial-gradient(circle, #730000, #9D0000, #730000);  width: 21%; height: 21vw; float:left; animation: gradient-animation 10s infinite linear;  background-size: 400% 100%;box-shadow: 0 4px 8px rgba(0,0,0,0.3);}
.onas_box_2_redbox3>img {float:left; width: 30%; margin: 10%;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.onas_box_2_redbox3>img:hover {rotate: 20deg;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; scale: 1.2;}
.onas_box_2_redbox4 {position: absolute; margin: 2%; bottom: -5vw; margin-left: 77%; background-image: radial-gradient(circle, #730000, #9D0000, #730000);  width: 21%; height: 21vw; float:left; animation: gradient-animation 10s infinite linear;  background-size: 400% 100%;box-shadow: 0 4px 8px rgba(0,0,0,0.3);}
.onas_box_2_redbox4>img {float:left; width: 30%; margin: 10%;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.onas_box_2_redbox4>img:hover {rotate: 20deg;-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; scale: 1.2;}

        @keyframes gradient-animation {
            0% { background-position: 0% 50%; } /* Początek animacji */
            50% { background-position: 100% 50%; } /* Środek animacji */
            100% { background-position: 0% 50%; } /* Koniec animacji, wraca do początku */
        }

.onas_text {float:right; width: 50%;  font-size:36px; margin-top: 1%; margin-bottom: 1%; text-align:justify; clear: right;}
.onas_text_box {float: right; font-size: 1.5vw; width: 42%; margin-right: 5%; text-align:justify; margin-bottom: 2%;}

.onas_line1 {float:left; width: 80%; margin-bottom: 2%; margin-left: 10%; height: 400px; }
.onas_line2 {float:left; width: 80%; margin-bottom: 2%; margin-left: 10%; height: 400px; }
.onas_line1>img {float:left; width: 45%; border-radius: 20px; }
.onas_line2>img {float:right; width: 45%; border-radius: 20px;  margin-left:2%;}
.onas_line_text {position: absolute; background-color: #000;  font-size: 1.2vw; width: 22%; margin: 2%; margin-top: 5%; padding: 2%; text-align:justify; float: right; color: #FFF; margin-left: -5%; opacity: 0.8;}
.onas_line_text2 {position: absolute; background-color: #000;  font-size: 1.2vw; width: 22%; margin: 2%; margin-top: 5%; padding: 2%; text-align:justify; float: right; color: #FFF; right: 0; margin-right: 40%; opacity: 0.8;}
.inwest_line {float:left; width: 100%; position: relative; disply: flex; justify-content: center; align-items: center; }
.inwest_line>img {float: right; width: 40%; margin: 5%; margin-bottom: 2%; margin-top: 15%; margin-right: 0px; position: absolute; left: 0; z-index: 1; border: 1px solid #000;  border-radius: 20px;}

.inwest_content {float:left; width: 100%; position: relative;}
.inwest_content>img {float:left; width: 100%}
.inwest_text {width: 50%; right: 0; top: 30%; font-size:1.2vw; margin-top: 1%; margin-bottom: 1%; text-align:justify; color: #000; position: absolute; background-color: #9D0000; padding:2%; color: #FFF; border-radius: 20px 0px 0px 20px;}
.inwest_text>ul {list-style: none;  padding-left: 0;}
.inwest_text>ul>li {list-style: none;}
.inwest_text>ul>li::before { content: ""; display: inline-block; width: 30px; height: 30px; margin-right: 10px; background: url("images/house_logo.png") no-repeat center center; background-size: contain;}


.inwest_header {float:left; width: 130%; text-align:left; font-size:1.5vw; margin-top: 2%; margin-bottom: 5%; font-weight: 400; color: #FFF; margin-left: -50%; padding: 2%;padding-left: 10%; 	 background-color:#000; position: relative; border-radius: 20px;}

.inwest_box {float:right; width: 50%; background-color: #9D0000; padding: 2%; padding-left: 20%;  margin-right: 0px; margin-top: 1%; position: relative; border-radius: 20px 0px 0px 20px; font-size: 1.2vw; color: #fff; text-align:justify; margin-bottom: 2%;}
.inwest_box>ul {list-style: none;  padding-left: 0;}
.inwest_box>ul>li {list-style:none;}
.inwest_box>ul>li::before { content: ""; display: inline-block; width: 1.5vw; height: 1.5vw; margin-right: 10px; background: url("images/checklist_logo_2.png") no-repeat center center; background-size: contain;}
.inwest_box>img {float: right; width: 55%; margin: 5%; margin-bottom: 2%; margin-top: 2%; margin-right: 0px; position: absolute; left: 0;}
.inwest_box>a {float:left; color: #FFF; text-decoration:none; border: 1px solid #FFF; padding:1%; margin-right: 2%; position:relative;}
.inwest_box>a>img {height: 1.2vw; position:relative;  }
.inwest_box>a:hover {background-color: #fff; color: #9D0000;}
.inwest_box_wrap {float:right; width: 11vw; margin-top:2%;position: absolute; margin-right:2%; height: auto; top: 0px; right: 0px;}
.inwest_box_wrap>img {position:relative; width: 100%; right: 0; float: right; border: 0px; }


.bold {font-weight: bold;}

.image_box_2 {float:left; width: 40%; margin-right: 5%; position:relative; margin-top: 0px;}
.image_box_2>img {float:right; width: 80%; margin: 0px; margin-right: 0px; margin-top: 2%; margin-bottom: 2%;  border-radius: 20px 0px 20px 0px;}

.prop_3 {position: relative;  width: 50%; height: auto; background-color: #9D0000; left: 0; padding: 2%; opacity: 0.8; float:left; clear:both; margin-bottom: 5%; }
.prop_3>img{float:left; width: 15%; margin-top: 7%;}
.prop_3_header {float: right; text-align: right; width: 80%; font-size: 1.2vw; color: #fff; font-weight: 400;}
.prop_3_text {float: right; text-align: right; width: 80%; font-size: 1.2vw; color: #fff; font-weight: 200; margin-bottom: 2%;}

.footer {background-color: #000; float: left; min-height: 100px; width: 100%;}
.footer_header {float:left; width: 100%; color: #FFF; font-weight: 400; font-size: 32px; margin-top: 7%;}
.footer_text {float:left; width: auto; color: #FFF; font-weight: 200; font-size: 1.2vw;margin-left: 10%; margin-top: 10%; }
.footer_text>a {color: #fff; text-decoration:none; clear:both;}
.footer_text>a:hover {color: #9d0000;}
.footer_box {float:left; width: 30%; height: auto; margin-bottom:5%;	}
.footer_box>img {float:left; margin-left: 15%; margin-top: 10%; width: 70%;}

.right_strap {position: fixed; right:0; width: 50px; height: auto; background-color: #9D0000; z-index:11; margin-top: 5%; padding-top: 2%; padding-bottom: 2%;overflow:hidden; border-right:0px; border-radius: 20px 0px 0px 20px; z-index: 4;}
.right_strap>img {float:left; width: 80%; margin-left: 10%; margin-right: 10%; margin-top: 20%; margin-bottom: 20%;}
.right_strap>a {float:left; height: 50px; width: 100%;  -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;  display: flex; justify-content: center;  align-items: center; }
.right_strap>a:hover {-moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; background-color: #FFF;}
.right_strap>a:hover>img {filter: opacity(0.5) drop-shadow(0 0 0 blue);}
.right_strap>a>img {float:left; width: 60%;  }
.right_strap_text {float:left; width: 100%; font-size: 0.5vw; color: #FFF; font-weight: 400; text-align:center; margin-bottom: 10%;}

.strap_mail {background-image:url(images/mail_logo_white.png); background-size: 70%; background-position:center; background-repeat: no-repeat;}
.strap_mail:hover {background-image:url(images/mail_logo_red.png); }
.strap_tel {background-image:url(images/tel_logo_white.png);  background-size: 70%; background-position:center; background-repeat: no-repeat;}
.strap_tel:hover {background-image:url(images/tel_logo_red.png);}


 .overlay {
      position: fixed; inset: 0; background: rgba(0,0,0,0.75);
      display: none; justify-content: center; align-items: center;
      z-index: 1000;
    }
    .overlay.open { display: flex; }

 .overlay2 {
      position: fixed; inset: 0; background: rgba(0,0,0,0.75);
      display: none; justify-content: center; align-items: center;
      z-index: 1000;
    }
    .overlay2.open { display: flex; }
	
 .overlay3 {
      position: fixed; inset: 0; background: rgba(0,0,0,0.75);
      display: none; justify-content: center; align-items: center;
      z-index: 1000;
    }
    .overlay3.open { display: flex; }	

 .overlay4 {
      position: fixed; inset: 0; background: rgba(0,0,0,0.75);
      display: none; justify-content: center; align-items: center;
      z-index: 1000;
    }
    .overlay4.open { display: flex; }	

    .modal {
      background: #fff; padding: 20px; border-radius: 10px;
      width: 80%; max-width: 1024px; 
	        transform: translateX(100%);  /* start poza ekranem */
      animation: slideIn 0.4s forwards ease-out; /* animacja wjazdu */
    }
	  .overlay.open .modal { animation: slideIn 0.4s forwards ease-out; }
	  
	      @keyframes slideIn {
      from { transform: translateX(100%); opacity: 0; }
      to   { transform: translateX(0); opacity: 1; }
    }
    .modal h2 { margin-top:0; }
	.modal>p {font-size: 2vw; magin-top: 0px; text-align:center; margin-bottom: 0px;  margin-top:0px; padding: 0px; width: auto;}
	.modal label { display: block; margin-top: 10px; }
    .modal input, .modal textarea {
      width: 95%; padding: 10px; margin-top: 4px;
      border: 1px solid #ccc; border-radius: 6px;
    }
    .modal textarea { resize: vertical; }
    .modal .actions { margin-top: 15px; display:flex; justify-content:flex-end; gap:10px; }
	.modal>table {float:left; width:1024px;}
	.modal>table>tbody>tr {}
	.modal>table>tbody>tr>th {text-align: center; background-color: #CCC;}
	.modal>table>tbody>tr>td {text-align: center; border-bottom: 1px solid #ccc;}	
    .btn { padding: 10px 18px; border:none; border-radius:6px; cursor:pointer; }
    .btn.primary { background:#2563eb; color:#fff; }
    .btn.ghost { background:#eee; }
	
	
.lokalizacja_content {float:left; width: 100%; }
.lokalizacja_content>img {float:left; width: 40%; margin:5%; margin-right: 0px; margin-top: 0px; margin-bottom: 0px; border-radius: 20px;}
.lokalizacja_header {float:left; width: 100%; text-align:center; font-size:2vw; margin-top: 2%; margin-bottom: 2%; font-weight: 400; color: #9D0000; }
.lokalizacja_text_header {float:left; font-size: 3vw; width: 100%; margin: 0px; color: #00C; text-align: justify; font-weight: 400;}
.lokalizacja_text {float:left; color: #000; font-size: 1.2vw; width: 45%; margin: 5%; text-align: justify; margin-top:0px;}


 
     .inwest_gallery {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 16px;
      max-width: 1024px;
      margin: 0 auto;
      padding: 24px;
	  overflow: hidden;
    }

    .inwest_gallery a {
      display: block;
      overflow: hidden;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0,0,0,.1);
    }

    .inwest_gallery img {
      width: 100%;
      aspect-ratio: 1 / 1;   /* kwadrat */
      object-fit: cover;
      transition: transform 0.3s;
    }

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

    /* ===== Lightbox ===== */
    .lightbox {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.85);
      display: none;
      justify-content: center;
      align-items: center;
      padding: 20px;
	  -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;
	  z-index:3;
    }

    .lightbox:target {
      display: flex;
  	  z-index:3;
    }

    .lightbox img {
      max-width: 90vw;
      max-height: 90vh;
      border-radius: 12px;
      box-shadow: 0 6px 20px rgba(0,0,0,.4);
	  -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;
  	  z-index:3;
    }

    .close {
      position: fixed;
      top: 20px;
      right: 20px;
      background: #fff;
      color: #000;
      padding: 8px 14px;
      border-radius: 999px;
      text-decoration: none;
      font-weight: bold;
      box-shadow: 0 4px 12px rgba(0,0,0,.2);
    }
	
	    /* Styl przycisku */
    #scrollTopBtn {
      position: fixed;
      bottom: 30px;
      right: 30px;
      width: 50px;
      height: 50px;
      border: none;
      
      background-color: #9D0000;
      color: white;
      font-size: 24px;
      cursor: pointer;
      display: none; /* ukryty na początku */
      justify-content: center;
      align-items: center;
      box-shadow: 0 4px 8px rgba(0,0,0,0.3);
      transition: opacity 0.4s ease-in-out;
    }

    /* Animacja pojawiania się */
    #scrollTopBtn.show {display: flex; opacity: 1;}
    #scrollTopBtn.hide {opacity: 0;}
	
	#scrollTopBtn>img {float:left; width: 100%;}

.kontakt_form_header {float:left; color: #000; font-size: 1.5vw; margin-left: 10%; color: #9D0000; font-weight: 400; width: 100%;  margin-bottom: 2%;}
.kontakt_form_text {float:left; color: #000; font-size: 1.2vw; margin-left: 10%; color: #000; font-weight: 400; line-height: 3vw; clear: both; margin-bottom:1%;}
.kontakt_form_text>img {float:left; height: 3vw;}
.kontakt_form {float: left; width: 50%;}
.kontakt_form>img {float:left; width: 30%; margin-left: 9%;}
.kontakt_form>form {float: left; width: 80%; margin-left: 10%; margin-bottom: 5%;}
.kontakt_form>form>input {float: left; width: 100%; padding: 1%;  font-family: "Oswald", sans-serif; font-weight: lighter; font-size: 1.2vw; margin-bottom: 2%;}
.kontakt_form>form>input[type=checkbox] {float:left; width:5%; margin-top:2%;  -ms-transform: scale(2); /* IE */  -moz-transform: scale(2); /* FF */  -webkit-transform: scale(2); /* Safari and Chrome */  -o-transform: scale(2); /* Opera */  transform: scale(2);}
.kontakt_form>form>textarea {float:left; width: 100%; height: 20vh; padding: 1%; margin-bottom: 2%;}
.form_label {float:left; width: 100%; font-size: 1.2vw;}
.form_check {float:right; width: 93%; font-size: 1.1vw; text-align:justify; margin-bottom: 2%;}
.g-recaptcha { float:left; }
.gm-style-iw a {
  pointer-events: auto !important;
  z-index: 9999;
  display: inline-block;
  padding: 8px 12px;
}
	.gm-style-iw {  width: auto;   min-height: 280px;  padding: 2%;height:auto;  font: 300 11px "Oswald", sans-serif;	}
	.gm-style-iw-d { overflow: visible !important; /* wyłącz scrollbar */ max-height: none !important;   pointer-events: auto !important;}
#map_k {margin-left: 10%; width: 90%; float: left; margin-bottom: 5%; height: 30vw;}
.map_wrap {width:300px; margin-bottom:8px;}
.map_wrap>img {float:left; width: 100%;}
.map_wrap_text {font-size: 1.2vw; font-weight: 400; text-align:center;}
.map_wrap_text2 {font-size: 1vw; font-weight: lighter; text-align:center; }
.map_wrap_a {display:inline-block; padding:5%; background:#000; color:white; text-decoration:none; border-radius:4px; font-size:1.2vw; line-height: 2vw; width: 70%; margin-left: 10%; text-align:center;pointer-events: auto; }
.map_wrap_a:hover {background-color: #9D0000;}
.wybor_box {float:left; width: 28%; height: auto; background-color:#333; margin: 5%; margin-right: 2.5%; margin-left: 2.5%; margin-top: 0px; padding-bottom: 2%; border-radius: 20px; background-image:url(images/WR_logo_white_pos.png); background-repeat:no-repeat; background-position: 5% 98%; background-size: 20%}
.wybor_box>img {float:left; width: 90%; margin: 5%; border-radius: 20px;}
.wybor_box_header {float:left; width: 90%; margin-left: 5%; color: #fff; line-height: auto; text-align:center; font-size: 1.5vw; font-weight: 400; }
.wybor_box_text {float:left; width: 90%; margin-left: 5%; color: #fff; line-height: auto; text-align:center; font-size: 1.0vw;}
.wybor_box_text>a {float: none; color: #FFF; text-decoration: none;padding:1%; margin-top:2%; line-height: 2vw;}
.wybor_box_text>a:hover {background-color: #9D0000;}
.wybor_text_label {float:left; width:50%; margin-left: 25%; margin-bottom:2%; font-weight: 300; color:#FFF;  line-height: 2vw; text-align:center; font-size: 1.0vw; color:#000; color: #FFF;}
.wybor_text_label>a {float:left; width: 100%; height: 2vw; font-size: 1vw; background-color:#063; color: #FFF; text-decoration: none;}
.wybor_text_label>a:hover {background-color: #FFF; color: #000;}
.wybor_status_dostepne {float:left; width: 50%; margin-left: 25%;  margin-bottom:2%; background-color:#063; color: #fff; text-align:left;  font-size: 1vw; LINE-HEIGHT: 2VW; display: flex; align-items: center; justify-content: center;}
.wybor_status_dostepne>img {float:left; height: 3vw; margin-left: 2%;}
.back_wybierz {float:left; width: 20%; margin-left: 40%; text-align:center; border: 1px solid #000; font-size: 1.2vw; line-height: 2.4vw; text-decoration: none; color: #000;}
.back_wybierz:hover {background-color: #9D0000; color: #fff;}
.prospekt_box {float:left; width: 100%; position:relative; height: 30vw; overflow: hidden; background-image:url(images/prospekt.jpg); background-size: cover; background-repeat:no-repeat; background-position: left;}
.prospekt_box>img {width: 100%; float:left;}
.prospekt_text {position: absolute; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.8); color: #fff;width: 60%; height: auto; display:flex; justify-content: center; align-items: center; font-size: 2vw; line-height: 4vw;margin-bottom: 6%;}
.prospekt_text>a {color: #fff; text-decoration: none; width: 100%; text-align:center;}
.prospekt_text>a>img {height: 2vw; position: absolute; left: 0; height: 6vw; margin-top: -1vw; margin-left: -1vw;}
.prospekt_text>a:hover {background-color: #9D0000;}

@media only screen and (max-width: 1024px) {
.top_banner {float:left; color: #fff; background-color:#000; width: 100%; height: 5vw;}
.top_banner>img {float:left; height: 5vw; margin-top:0px; margin-left: 10px;}
.top_banner>a {float:left; color: #FFF; font-family: "Oswald", sans-serif; font-size: 3vw; line-height: 5vw; margin-left:5px; text-decoration: none;}
.logo {float:left; width: 100%; height: 60px; display: flex; justify-content: center;  align-items: center; }
.logo>img {float:left; height: 50px; margin: 10%; margin-left: 10%; }
.menu {float:left; width: 100%; height: 50px; position:relative;}
	
	
.menu>ul {float:left; width: 100%; padding:0px; margin:0px;  position:relative; height: 100%;}
.menu>ul>li {float:left; list-style: none; width: 25%;  position:relative; height: 100%;}
.menu>ul>li>a {float:left; width: 100%; height: 100%; background-color:#fff; font-size: 3vw; text-decoration: none; color: #000; position:relative; display: flex; justify-content: center;  align-items: center; animation-play-state: paused; animation: none; font-weight: 300;}
.menu>ul>li>a>.menu_background {float:left; display: flex;  justify-content: center;  align-items: center; height:50px; animation-play-state: paused;  animation: none;}
.menu>ul>li>a:hover>.menu_background {float:left;width:0px;   animation: rosnie; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards; postion: absolute; z-index: 0; animation-play-state: running;}
.image_box {float:left; width: 90%; margin: 5%; height: 90vw; position:relative; margin-top: 0px;}	
.main_header {font-size: 4vw;}
.kontakt_form {float: left; width: 90%;}
.kontakt_form_header { font-size: 4vw;}
.kontakt_form_text {font-size: 3vw; line-height:6vw;}
.kontakt_form_text>img {float:left; height: 5vw;}
#map_k {margin-left: 5%; height: 120vw; }
.gm-style-iw a {
  pointer-events: auto !important;
  z-index: 9999;
  display: inline-block;
  padding: 8px 12px;
}
.gm-style-iw {  width: 400px;   min-height: 270px;  padding: 2%; height:auto;  }
.gm-style-iw-d { overflow: visible !important; /* wyłącz scrollbar */ max-height: auto !important; pointer-events: auto !important; height: auto;	}
.map_wrap {width:100%; margin-bottom:8px; }
.map_wrap>img {float:left; width: 80%; margin-left: 10%;}
.map_wrap_text {font-size: 3vw; font-weight: bold; width: 100%; clear: both;}
.map_wrap_text2 {font-size: 3vw;  clear: both;margin-bottom: 2%;}
.map_wrap_a {display:inline-block; padding: 5%; background:#000; color:white; text-decoration:none; border-radius:4px; font-size:4vw; line-height: 6vw; text-align: center; width: 70%; cursor: pointer-events: auto; z-index:156;}
.map_wrap_a:hover {background-color: #9D0000;}
.form_label {float:left; width: 100%; font-size: 2vw; margin-bottom: 1%;}
.form_check {font-size: 2vw; padding-left: 5%; width: 88%;}
.kontakt_form>form>input {font-size:3vw; line-height: 5vw;}
.footer {background-color: #000; float: left; min-height: auto; width: 100%;}
.footer_box {float:left; width: 100%; height: auto; margin-bottom:5%;	}
.footer_box>img {float:left; margin-left: 25%; margin-top: 10%; width: 50%;}

.footer_header {float:left; width: 100%; color: #FFF; font-weight: 400; font-size: 6vw; margin-top: 7%;}
.footer_text {float:left; width: auto; color: #FFF; font-weight: 200; font-size: 3vw;margin-left: 10%; margin-top: 0px; }
.footer_text>a {color: #fff; text-decoration:none; clear:both;}
.footer_text>a:hover {color: #9d0000;}
.inwest_content {float:left; width: 100%; height: auto; overflow: hidden; }
.inwest_content>img {float:left; width: 150%; position: relative;}
.inwest_text {width: 80%; right: 0; top: 25%; font-size:2.4vw; margin-top: 1%; margin-bottom: 1%; text-align:justify; color: #000; position: absolute; background-color: #9D0000; padding:5%; color: #FFF; opacity: 0.8;}
.banner {height: 400px;}
.banner_box {   position: absolute;  margin-top: 5%;  left: 50%;  width:50%;  transform: translateX(-50%);  background: rgba(255,255,255,0.8);  padding: 0px;  z-index: 2;}
.banner_box>img {float: left; width: 40%; margin-left: 30%; margin-top: 10%;   }
.banner_box_text {float:left; width: 90%; margin-left: 5%;  text-align:center; font-size: 3vw; font-weight: 300; position:relative;}
.banner_box>a {font-size: 3vw; line-height: 6vw;}

.inwest_line {width: 100%;}
.inwest_box {font-size: 2.4vw; width:80%; padding-left: 5%; }
.inwest_box>ul>li::before { content: ""; display: inline-block; width: 3vw; height: 3vw; margin-right: 10px; background: url("images/checklist_logo_2.png") no-repeat center center; background-size: contain;}

.inwest_header {float:left; width: 100%; text-align:left; font-size:3vw; margin-top: 2%; margin-bottom: 5%; font-weight: 400; color: #FFF; margin-left: -20%; padding: 2%;padding-left: 10%; 	background-color:#000; position: relative; line-height: 5vw;}
.inwest_line>img {float: right; width: 40%; margin: 5%; margin-left: 0px; margin-bottom: 2%;  margin-right: 0px; position: absolute; left: 0; bottom:0; z-index: 2; border: 1px solid #000; display:none;}

.inwest_box_wrap {float:right; width: 25%; margin-top:3%;position: absolute;  height: auto; top: 0px; right: 0px;}
.inwest_box_wrap>img {position:relative; width: 100%; right: 0; float: right; border: 0px;}

.lokalizacja_content>img {float:left; width: 90%; margin:5%; margin-right: 0px;}
.lokalizacja_text {float:left; color: #000; font-size: 2.5vw; width: 90%; margin: 5%; text-align: justify;}
.lokalizacja_header {font-size: 4vw;}
.prop_1 {position: relative;  width: 80%; height: auto; background-color: #000; left: 0; padding: 2%; opacity: 0.8; float:right; clear:both; bottom: 0; margin-top: 0px;}
.prop_box>img{float:left; width: 8%; margin-top: 2%; margin-left: 3%; position:absolute;}
.prop_1>a {color: #FFF; text-decoration:none; float:none; display:flex; justify-content: center; font-size: 4vw; border: 1px solid #FFF; line-height: 8vw; padding-left: 2%; padding-right: 2%; margin-left: auto; margin-right: auto; width: 200px; }
.prop_1>a:hover {animation: tlo; animation-duration: 0.3s; animation-iteration-count: 1; animation-fill-mode: forwards; border: 1px solid #9D000;}
.prop_2 {position: relative;  width: 40%; height: auto; background-color: #000; left: 0; padding: 2%; opacity: 0.8; float:right;  top: 0; margin-top: 5%; margin-bottom: 5%;}
.prop_2_header {color: #FFF; font-size: 3vw;}

.prop_header {float: right; text-align: right; width: 100%; font-size: 4vw; color: #fff; font-weight: 400;}
.prop_text {float: right; text-align: justify; width: 100%; font-size: 3vw; color: #fff; font-weight: 200; margin-bottom: 2%;}
.prop_box {position:absolute; height: auto; z-index: 3;}
.onas_box_2_text {float:left; width: 98%; margin-left: 1%; color:#FFF; font-size: 1.8vw; text-align:center;}

.onas_line1 {float:left; width: 80%; margin-bottom: 10%; margin-left: 10%; height: 100px; }
.onas_line2 {float:left; width: 80%; margin-bottom: 10%; margin-left: 10%; height: 100px; }
.image_box_2 {width: 80%; margin-left: 10%;}
.image_box2>img {width: 100%;}
.onas_line_text {font-size: 2vw; width: 50%;}
.onas_line_text2 {font-size: 2vw; width: 50%;}

.prop_3 {position: relative;  width: 55%; height: auto; background-color: #9D0000; left: 0; padding: 2%; opacity: 0.8; float:left; clear:both; margin-bottom: 5%; }
.prop_3>img{float:left; width: 15%; margin-top: 3%;}
.prop_3_header {float: right; text-align: right; width: 80%; font-size: 2.2vw; color: #fff; font-weight: 400;}
.prop_3_text {float: right; text-align: right; width: 80%; font-size: 2.2vw; color: #fff; font-weight: 200; margin-bottom: 2%;}

@keyframes rosnie {
  0% {width: 0%; border: 0px; height:5px;}
  50% {background-color: #9D0000; height: 10px;}
  100% {width: 100%; background-color: #9D0000; height: 50px; color:#FFF;}
}

@keyframes maleje {
  0% {width: 100%; background-color: #9D0000; height: 50px;}
   50% {background-color: #9D0000; height: 10px;}
  100% {width: 0%; border: 0px; height:5px;}
}



    .modal {
      background: #fff; padding: 20px; border-radius: 10px;
      width: 90%; max-width: 480px;
	        transform: translateX(100%);  /* start poza ekranem */
      animation: slideIn 0.4s forwards ease-out; /* animacja wjazdu */
    }
	  .overlay.open .modal { animation: slideIn 0.4s forwards ease-out; }
	  
	      @keyframes slideIn {
      from { transform: translateX(100%); opacity: 0; }
      to   { transform: translateX(0); opacity: 1; }
    }
    .modal h2 { margin-top:0;  }
    .modal label { display: block; margin-top: 10px; }
	.modal>p {font-size: 5vw; magin-top: 0px; text-align:center; margin-bottom: 0px;  margin-top:0px; }
	.modal>a {width: 100%; font-size: 5vw; float: left; text-align:center; text-decoration:none; color: #9D0000; font-weight:400; }
    .modal input, .modal textarea {
      width: 95%; padding: 10px; margin-top: 4px;
      border: 1px solid #ccc; border-radius: 6px;
    }
    .modal textarea { resize: vertical; }
    .modal .actions { margin-top: 15px; display:flex; justify-content:flex-end; gap:10px; }
	.modal>table {float:left; max-width:100%;}
	.modal>table>tbody>tr {}
	.modal>table>tbody>tr>th {text-align: center; background-color: #CCC;  font-size: 1.5vw;}
	.modal>table>tbody>tr>td {text-align: center; border-bottom: 1px solid #ccc; font-size: 1.5vw;}	
    .btn { padding: 10px 18px; border:none; border-radius:6px; cursor:pointer; }
    .btn.primary { background:#2563eb; color:#fff; }
    .btn.ghost { background:#eee; }
	
	.right_strap {width: 30px; }
.right_strap>a {height: 30px;}
.wybor_box {width: 90%;}
.wybor_box_header {line-height: auto; font-size: 6vw; font-weight: 400; }
.wybor_box_text {font-size: 4vw;}
.wybor_text_label {float:left; width:50%; margin-left: 25%; margin-bottom:2%; font-weight: 300; color:#FFF;  line-height: 8vw; text-align:center; font-size: 4vw; color:#000; color: #FFF;}
.wybor_text_label>a {float:left; width: 100%; height: 8vw; font-size: 4vw; background-color:#063; color: #FFF; text-decoration: none;}
.wybor_text_label>a:hover {background-color: #FFF; color: #000;}
.wybor_status_dostepne {font-size: 4vw; line-height: 8vw; display: flex; align-items: center; justify-content: center;}
.wybor_status_dostepne>img {float:left; height: 8vw; margin-left: 2%;}
.back_wybierz {font-size:3vw; line-height: 6vw;}
.prospekt_text {width: 80%; font-size: 4vw; line-height: 8vw;margin-bottom: 6%;}
.prospekt_text>a>img {height: 2vw; position: absolute; left: 0; height: 10vw; margin-top: -1vw; margin-left: -1vw;}
}