body{
    background-image: url('tlo.png');
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.contentglowny{
  width: 1216px;
    height: 100%;
    margin: auto;
    border: solid 1px ;
    background-color: white;
    overflow: auto;
}

.content{
    width: 1080px;
    height: 100%;
    margin: auto;
    border: solid 1px ;
    background-color: white;
}
img{
  height: 100%;
  width: 100%;
}

p,li{
    margin-left: 10%;
    margin-right: 10%;
  }
.p1{
    margin-left: 10%;
    margin-right: 10%;
}
h1,h2{
    margin-left: 10%;
    margin-right: 10%;
}

.hred{
    width: 90%;
    border-bottom: solid 2px rgb(175, 17, 29);
}

td{
    padding-left: 10%;
}

  
.mapa {
  width: 1216px;
  height: 859.85px;
  object-fit: contain;
  position: relative;
  text-align: center;
  font-size: 40px;
  }

.lewyDUO{
  position:absolute;
  margin-left:29.6%;
  margin-top: 4%;
  width: 4%;
  height: 5.7%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:4px;
  object-fit: contain;
}


.lewyDUO:hover{
box-shadow: 10px 10px 10px rgba(50, 50, 50, 50);
margin-left:29%;
margin-top: 2.9%;
width: 6.5%;
height: 9.5%;
}


.dot{
  position:absolute;
  margin-left: 42%;
  margin-top: 4%;
  width: 4%;
  height: 6%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:4px;
}

.dot:hover{
  box-shadow: 10px 10px 10px rgba(50, 50, 50, 50);
  position:absolute;
  margin-left: 41%;
  margin-top: 2.9%;
  width: 7%;
  height: 10.6%;
}

.polon3000{
  position:absolute;
  margin-left: 16.4%;
  margin-top: 18%;
  width: 12.5%;
  height: 22.5%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:4px;
}

.polon3000:hover{
  position:absolute;
  margin-left: 14.4%;
  margin-top: 16%;
  width: 15.5%;
  height: 27%;
}

.EKS{
  position:absolute;
  margin-left: 18.67%;
  margin-top: 8.5%;
  width: 6.35%;
  height: 8%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:4px;
}

.EKS:hover{
  position:absolute;
  margin-left: 18%;
  margin-top: 8%;
  width: 9.5%;
  height: 11.6%;
}

.SAW{
  position:absolute;
  margin-left: 32.1%;
  margin-top: 42.8%;
  width: 4.6%;
  height: 6%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:3px;
}

.SAW:hover{
  position:absolute;
  margin-left: 31.1%;
  margin-top: 41.8%;
  width: 6.3%;
  height: 7.6%;
}

.rop{
  position:absolute;
  margin-left: 63.1%;
  margin-top: 22.8%;
  width: 3.3%;
  height: 4.8%;
  border: 5px dashed #000;
  animation: color-change 1.5s infinite;
  padding:4px;

}

@keyframes color-change {
  0% {
    border-color: #000;
  }
  25% {
    border-color: rgb(250, 60, 60);
  }
  50% {
    border-color: rgb(227, 32, 32);
  }
  75% {
    border-color: rgb(110, 9, 9);;
  }
  100% {
    border-color: #000;
  }
}

.rop:hover{
  margin-left: 62.6%;
  margin-top: 22.5%;
  width: 4.8%;
  height: 7%;
}

.rop2{
  position:absolute;
  margin-left: 63.8%;
  margin-top: 23.5%;
  width: 3.3%;
  height: 4.4%;
}

.rop2:hover{
  margin-left: 63.1%;
  margin-top: 23.1%;
  width: 4.4%;
  height: 5.9%;
}

.container {
    display: flex;
    width: 100%;
    margin: auto;
    padding-left: 2%;
}

.left-column {
    width: 48%;
    margin: auto;
    margin-top: 5%;
}

.right-column {
    width: 48%;
    margin-right: 5%;
    margin-left: auto;
    padding-top: 5%;
}


#myAudio {
  width: 100%;
}

.audiodiv{
width: 150px;
position: fixed;
}

.kwadrat{
  background-color: rgb(175, 17, 29);
  height: 32px;
  width: 32px;
}

.stopka1{
  width: 90%;
  height: 1.8%;
  font-size: 20px;
  margin-left: 40px;
  margin-right: 40px;
  border-bottom: solid 4px rgb(175, 17, 29);
}

.stopka2{
  width: 90%;
  height: 1.8%;
  font-size: 20px;
  margin-left: 40px;
  margin-right: 40px;
}