.grafika-obal .left-b, .grafika-obal .right-b, .grafika-obal .predchozi-tl, .grafika-obal .dalsi-tl, .grafika-obal .tl-predchozi, .grafika-obal .tl-dalsi, .grafika-obal .prevBtn, .grafika-obal .nextBtn {
  display: block;
  width: 60px;
  height: 60px;
  position: absolute;
  top: calc(50% - 45px);
  z-index: 5;
  opacity: 1;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 25px;
  background-color: #1B69BF;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.25s;
}
.grafika-obal .cerna .left-b, .grafika-obal .cerna .right-b, .grafika-obal .cerna .dalsi-tl, .grafika-obal .cerna .predchozi-tl, .grafika-obal .cerna .tl-dalsi, .grafika-obal .cerna .tl-predchozi, .grafika-obal .cerna .prevBtn, .grafika-obal .cerna .nextBtn {
    background-color: #05171F;
}
.grafika-obal .cervena .left-b, .grafika-obal .cervena .right-b, .grafika-obal .cervena .dalsi-tl, .grafika-obal .cervena .predchozi-tl, .grafika-obal .cervena .tl-dalsi, .grafika-obal .cervena .tl-predchozi, .grafika-obal .cervena .prevBtn, .grafika-obal .cervena .nextBtn {
    background-color: #DA1630;
}
.grafika-obal .zelena .left-b, .grafika-obal .zelena .right-b, .grafika-obal .zelena .dalsi-tl, .grafika-obal .zelena .predchozi-tl, .grafika-obal .zelena .tl-dalsi, .grafika-obal .zelena .tl-predchozi, .grafika-obal .zelena .prevBtn, .grafika-obal .zelena .nextBtn {
    background-color: #48A9A6;
}

.grafika-obal .left-b, .grafika-obal .predchozi-tl, .grafika-obal .tl-predchozi, .grafika-obal .prevBtn {
  background-image: url('https://graphics.stdout.cz/common1/chevron-left._0_.svg');
  left: -20px;
}

.grafika-obal .right-b, .grafika-obal .dalsi-tl, .grafika-obal .tl-dalsi, .grafika-obal .nextBtn {
  background-image: url('https://graphics.stdout.cz/common1/chevron-right._0_.svg');
  right: -20px;
}
.grafika-obal.desktop .left-b:hover, .grafika-obal.desktop .right-b:hover, .grafika-obal.desktop .dalsi-tl:hover, .grafika-obal.desktop .predchozi-tl:hover, .grafika-obal.desktop .tl-dalsi:hover, .grafika-obal.desktop .tl-predchozi:hover, .grafika-obal.desktop .prevBtn:hover, .grafika-obal.desktop .nextBtn:hover {
  transform: scale(1.1);
}


@media screen and (max-width: 1100px) {
  .grafika-obal .left-b, .grafika-obal .predchozi-tl, .grafika-obal .tl-predchozi, .grafika-obal .prevBtn {
    left: 0; transform: scale(0.95);
  }
  .grafika-obal .right-b, .grafika-obal .dalsi-tl, .grafika-obal .tl-dalsi, .grafika-obal .nextBtn {
    right: 0; transform: scale(0.95);
  }
}
@media screen and (max-width: 880px) {
  .grafika-obal .left-b, .grafika-obal .predchozi-tl, .grafika-obal .tl-predchozi, .grafika-obal .prevBtn {
    transform: scale(0.8); background-color: rgba(27, 105, 191, 0.8);
  }
  .grafika-obal .right-b, .grafika-obal .dalsi-tl, .grafika-obal .tl-dalsi, .grafika-obal .nextBtn {
    transform: scale(0.8); background-color: rgba(27, 105, 191, 0.8);
  }

  .grafika-obal .cerna .left-b, .grafika-obal .cerna .right-b, .grafika-obal .cerna .dalsi-tl, .grafika-obal .cerna .predchozi-tl, .grafika-obal .cerna .tl-dalsi, .grafika-obal .cerna .tl-predchozi, .grafika-obal .cerna .prevBtn, .grafika-obal .cerna .nextBtn {
      background-color: rgba(5, 23, 31, 0.8);
  }
  .grafika-obal .cervena .left-b, .grafika-obal .cervena .right-b, .grafika-obal .cervena .dalsi-tl, .grafika-obal .cervena .predchozi-tl, .grafika-obal .cervena .tl-dalsi, .grafika-obal .cervena .tl-predchozi, .grafika-obal .cervena .prevBtn, .grafika-obal .cervena .nextBtn {
      background-color: rgba(218, 22, 48, 0.8);
  }
  .grafika-obal .zelena .left-b, .grafika-obal .zelena .right-b, .grafika-obal .zelena .dalsi-tl, .grafika-obal .zelena .predchozi-tl, .grafika-obal .zelena .tl-dalsi, .grafika-obal .zelena .tl-predchozi, .grafika-obal .zelena .prevBtn, .grafika-obal .zelena .nextBtn {
      background-color: rgba(72, 169, 166, 0.8);
  }
  .grafika-obal .mapa-leaflet .predchozi-tl {
    left: -15px;
  }
  .grafika-obal .mapa-leaflet .dalsi-tl {
    right: -15px;
  }

}

@media screen and (max-width: 550px) {
  .grafika-obal .left-b, .grafika-obal .predchozi-tl, .grafika-obal .tl-predchozi, .grafika-obal .prevBtn {
    transform: scale(0.65);
  }
  .grafika-obal .right-b, .grafika-obal .dalsi-tl, .grafika-obal .tl-dalsi, .grafika-obal .nextBtn {
    transform: scale(0.65);
  }
}
