@font-face {font-family: 'Roboto';font-style: normal;font-weight: 400;src: local('Roboto'),url('roboto.woff2') format('woff2');font-display: swap}
body {background-color:#FFFFFF;font-family: 'Roboto';font-size:19px;text-align:left;color:#000000;line-height:1.4; margin:0}

 h1 {text-align: left; font-size:120%; color: #80790D}
 h2 {text-align: right; font-size:90%; color: #605B0E; font-style: italic}
 h3 {text-align: right; font-size:88%; color: #605B0E; font-style: italic}
 h4 {text-align: right; font-size:85%; color: #605B0E; font-style: italic}
 h5 {text-align: right; font-size:82%; color: #605B0E; font-style: italic}
 h6 {text-align: right; font-size:80%; color: #605B0E; font-style: italic}
 
 img.n {width:350px; height:70px}
 img.ft {width:50px; height:50px}
 img.main0 {width:1300px; height:215px}
 img.wet2  {width:1200px; height:850px} 
 img.main2 {width:1200px; height:620px}
 img.main3 {width:1200px; height:620px}
 img.wet3 {width:1200px; height:550px} 
 img.bio1 {width:1000px; height:580px}
 img.main4 {width:1000px; height:550px}
 img.indeks {width:900px; height:465px}
 img.wet1  {width:550px; height:820px} 
 img.main5 {width:550px; height:667px}
 img.wyst2 {width:550px; height:410px}
  img.art1 {width:550px; height:390px} 
 img.wyst3 {width:550px; height:380px}
 img.woda1 {width:550px; height:367px} 
 img.media {width:550px; height:367px}
 img.bunt1 {width:550px; height:367px} 
 img.wyst1 {width:550px; height:310px}
 img.wyst4 {width:550px; height:300px}
 img.af    {width:500px; height:267px}
 img.woda2 {width:400px; height:600px}
 img.bunt2 {width:400px; height:593px} 
 img.art2  {width:400px; height:560px} 
 img.bio2  {width:167px; height:192px; float: left}
 img.ikonki {width:30px; height:30px}
 img.komp-img2 {width:40px; height:40px}
 img.mode {width:70px; height:40px}
 img.komp-img4 {width:200px; height:40px}
 img.komp-img {width: 35px; height: 35px; padding: 10px; object-fit: contain}

 ul.r {border: 1px solid #999999;border-radius: 5px;padding: 5px; margin:0; box-shadow: 2px 2px 5px; list-style-type: none; width:90%}
 ul.p {margin-left: auto;margin-right: auto}
 li.tlo {background-color: #605B0E; color: #FFFFFF}
 li.cena {border-top: #9D6E05 solid 1px; margin:0}

 img.r {border: 1px solid #999999;border-radius: 5px;padding: 10px; box-shadow: 5px 5px 10px}
 img.p {display: block;margin-left: auto;margin-right: auto}
 img.nav {width:64px; height:64px}
 img.gorastrony {width:30px; height:30px}
 img.foot {width:24px; height:24px}
 img.pdf {width:108px; height:110px}

 nav.hamburger-menu {position: fixed !important; z-index: 9999; background-color: #FFFFFF; width: 100% !important; top: 0 !important; left:0 !important; border-bottom: #9D6E05 solid 1px}
.nav-logo {display: flex; align-items: center; background-color: #FFFFFF}
.menu-toggle {display: none}
.menu-icon {display: flex; flex-direction: column; justify-content: space-between; width: 30px; height: 20px; cursor: pointer}
.menu-icon span {display: block;height: 3px;width: 100%; background-color: #000000}
.menu-list {display: none;list-style: none;padding: 10px 0;margin: 10px 0 0 0;background: #FFFFFF;border: 1px solid #000000;width: 98%;position: absolute;top: 100%;left: 0;box-shadow: 2px 2px 4px}
.menu-list li a {display: flex;align-items: center;padding: 10px 10px;color: #000000;text-decoration: none;font-size: 17px}
.menu-list li a:hover {background-color: #FFFFFF}
.menu-img {width: 30px; height: 30px; margin-right: 15px; object-fit: contain}
.menu-toggle:checked ~ .menu-list {display: block} 

 nav.komputer {position: fixed; z-index: 9999; background-color: #FFFFFF; width: 100%; top: 0; left:0; text-align: center; align-items: center;border-bottom: #9D6E05 solid 1px}
 div.komp-logo {text-align: center;  padding: 0px 10px; height: 40px; align-items: center; object-fit: contain}
 div.komp a {display: inline-block; text-align: center; align-items: center;  padding: 1px 12px; text-decoration: none; color: #000000;  font-size: 14px}
 div.komp a:visited {text-decoration:none; color:#000000}
 div.komp a:hover {text-decoration:none; color:#9D6E05}
 div.komp a:active {text-decoration:none}

 footer {position: fixed; bottom: 0; text-align: center; background-color: #FFFFFF; width: 100%; color:#000000; border-top: #9D6E05 solid 1px}
 footer a {display: inline-block; text-align: center; padding: 1px 15px; text-decoration: none; color: #000000; font-size: 14px}
 footer a:visited {text-decoration:none; color:#000000}
 footer a:hover {text-decoration:none; color:#9D6E05}
 footer a:active {text-decoration:none}
 
 strong.m {color:#846b00; font-size:100%}
 strong.cytat {color:#846b00; font-size:70%; text-align: right; float: right}
 strong.aa {color:#7b7249}

 main {background-color: #FFFFFF;  text-align: left; margin: 200px 5px 50px 5px}
 main a {color:#000000}

 .youtube-video {aspect-ratio: 16 / 9; width: 97%; max-width: 1200px; border: 1px solid #999999;border-radius: 5px;padding: 10px; box-shadow: 5px 5px 10px}
 table {width:100%; border-collapse: collapse}
 td {border: solid 0px ; padding: 5px; text-align: center}
 td.f {border: solid 0px ; padding: 5px; text-align: center; font-size: 14px}
 td.ff {border-top: #9D6E05 solid 1px} 
 th {border: solid 0px ; padding: 10px; text-align: left}
 th.f {border: solid 0px ; padding: 10px; text-align: center; font-size: 14px}

 #menu1 {position: fixed; top: 50%; right: 2%}
 #menu2 {position: fixed; top: 45%; right: 2%} 
  
 form {text-align: center; align-content: center}  
 input {min-width: 300px; border: 1px solid #ccc; box-sizing: border-box; border-radius: 10px; padding: 3px 10px 3px 10px;} 
 textarea {min-width: 300px; min-height: 100px; border: 1px solid #ccc; box-sizing: border-box; border-radius: 10px; padding: 3px 10px 3px 10px;} 
 button.szukaj {background: #605B0E;color: white;border: none; font-size: 14px; border-radius: 10px; padding: 3px 10px 3px 10px; cursor : pointer}
 button.dark {background: #FFFFFF; border: none; border-radius: 10px; padding: 3px 10px 3px 10px; cursor : pointer}
 button.szukaj:hover {background: #846b00} 
 #div_box, #div_box2 {background-color: #FFFFFF}
  
 body.dark-mode {background-color:#000000; color:#EEEEEE}
 body.dark-mode button.dark {background: #000000}
 body.dark-mode img.nav {filter: invert(1)} 
 body.dark-mode img.ft {filter: invert(1)} 
 body.dark-mode img.pdf {filter: invert(1)}
 body.dark-mode img.ikonki {filter: invert(1)}
 body.dark-mode img.foot {filter: invert(1)}
 body.dark-mode img.menu-img {filter: invert(1)}
 body.dark-mode img.komp-img {filter: invert(1)}
 body.dark-mode img.komp-img2 {filter: invert(1)}

 body.dark-mode h1 {color: #D4CB43}
 body.dark-mode img.twitter {filter: invert(1)}
 body.dark-mode h2, body.dark-mode h3, body.dark-mode h4 {color: #A8A13B}
 body.dark-mode img.r {border: 1px solid #444444; box-shadow: 5px 5px 15px rgba(255, 255, 255, 0.5)}
 body.dark-mode nav {background-color: #000000; color: #CCCCCC}
 body.dark-mode nav a {color: #A0A5B0}
 body.dark-mode nav a:hover {color:#EDE351}
 body.dark-mode footer {background-color: #000000; color:#EEEEEE}
 body.dark-mode footer a {color: #EEEEEE}
 body.dark-mode footer a:hover {color:#EDE351}
 body.dark-mode strong.m {color:#FFDF5D}
 body.dark-mode main {background-color: #000000}
 body.dark-mode main a {color:#EDE351}
 body.dark-mode input {background-color: #242424; color: #EEEEEE; border: 1px solid #444444}
 body.dark-mode textarea {background-color: #242424; color: #EEEEEE; border: 1px solid #444444}
 body.dark-mode #div_box, body.dark-mode #div_box2 {background-color: #000000}
 body.dark-mode .hamburger-menu {background-color: #000000;}
 body.dark-mode .nav-logo {background-color: #000000}
 body.dark-mode .menu-icon span {background-color: #FFFFFF}
 body.dark-mode .menu-list {background: #000000;border: 1px solid #FFFFFF}
 body.dark-mode .menu-list li a {color: #FFFFFF}
 body.dark-mode .menu-list li a:hover {background-color: #000000}
 body.dark-mode nav.komputer {background-color: #000000}
 body.dark-mode div.komp a {color: #FFFFFF}
 body.dark-mode div.komp a:visited {color:#FFFFFF}
 
@media only screen and (min-width: 1000px)  {nav.hamburger-menu {display:none} } 
 @media only screen and (max-width: 1700px) {textarea {min-width: 700px} img.komp-img {width:32px; height:auto} img.main0 {width:100%; height:auto} img.wet1 {width:500px; height:auto} img.wet2,img.wet3 {width:990px; height:auto}}
 @media only screen and (max-width: 1000px) {textarea {min-width: 500px} nav.komputer {display:none}  main {margin: 80px 5px 50px 5px} img.af {width:440px; height:auto} img.wet1 {width:450px; height:auto} img.wet2,img.wet3 {width:700px; height:auto} img.wyst1,img.wyst2,img.wyst3,img.wyst4 {width:350px; height:auto} img.art1,img.woda1,img.woda2,img.bunt1,img.bunt2 {width:450px; height:auto} th.f,td.f {font-size: 12px} img.indeks {width:800px; height:auto}}
 @media only screen and (max-width: 850px)  {textarea {min-width: 400px} img.af {width:340px; height:auto} img.wet1 {width:400px; height:auto} img.wet2,img.wet3 {width:600px; height:auto} img.wyst1,img.wyst2,img.wyst3,img.wyst4 {width:250px; height:auto} img.indeks {width:550px; height:auto} img.main5,img.art1,img.art2,img.woda1,img.woda2,img.bunt1,img.bunt2 {width:350px; height:auto} img.main4 {width:700px; height:auto}}
 @media only screen and (max-width: 575px)  {textarea {min-width: 400px} img.af {width:240px; height:auto} img.wet1 {width:350px; height:auto} img.wet2,img.wet3 {width:400px; height:auto} img.mode {width:60px; height:auto} img.main5,img.art1,img.art2,img.woda1,img.woda2,img.bunt1,img.bunt2 {width:250px; height:auto} img.wyst1,img.wyst2,img.wyst3,img.wyst4 {width:200px; height:auto} img.main4 {width:550px; height:auto} img.indeks,img.media,img.bio1 {width:450px; height:auto} h1 {font-size: 16px} img.n {width:200px; height:auto} img.r {border-radius: 2px;padding: 5px; box-shadow: 2px 2px 5px} body.dark-mode img.r {border: 1px solid #444444; box-shadow: 2px 2px 5px rgba(255,255,255,0.5)}}
 @media only screen and (max-width: 440px)  {img.af {width:140px; height:auto} img.wet1,img.wet2,img.wet3 {width:300px; height:auto} img.main5,img.media,img.wyst1,img.wyst2,img.wyst3,img.wyst4,img.art1,img.art2,img.woda1,img.woda2,img.bunt1,img.bunt2  {width:150px; height:auto} img.bio1 {width:300px; height:auto} img.main4 {width:330px; height:auto} img.indeks {width:340px; height:auto} img.n {width:180px; height:auto} footer a {padding: 1px 10px} img.ikonki {width:20px; height:auto}}