.img-unit-reservation {
  position: relative;
  top: 12px;
  margin-bottom: -203px;
  left: 0;
}
.unit-reservation {
  position: relative;
  top: 12px;
  margin-bottom: -203px;
  left: 0;
  max-width: 1315px;
  *border: 1px solid #000;
  margin-left:auto;
  margin-right:auto;
}

.kotak {
  position: relative;
  left: 400px;
  top: 25px;
}

.img {
  position: relative;
  top: -93px;
  left: -70px;
}
.img1 {
  position: relative;
  top: -30px;
  left: -140px;
}
.img2 {
  position: relative;
  top: -44px;
  left: -285px;
}
.img3 {
  position: relative;
  top: -92px;
  left: -245px;
}
.img4{
  position: relative;
  top: -38px;
  left: -343px;
}
.img5 {
  position: relative;
  top: -12px;
  left: -399px;
}
.img6{
  position: relative;
  top: -13px;
  left: -385px;
}
.img7{
  position: relative;
  top: -177px;
  left: 703px;
}
.img8{
  position: relative;
  top: -134px;
  left: 547px;
}
.img9{
  position: relative;
  top: -107px;
  left: 405px;
}
.img10{
  position: relative;
  top: -83px;
  left: 257px;
}
.img11{
  position: relative;
  top: -188px;
  left: 652px;
}
.img12{
  position: relative;
  top: -142px;
  left: 676px;
}

.ket1 {
  position: relative; 
  top: -280px; 
  left: 436px; 
}
.ket2 {
  position: relative; 
  top: -267px; 
  left: 464px; 
}
.ket3 {
  position: relative; 
  top: -258px; 
  left: 497px; 
}
.ket4 {
  position: relative; 
  top: -334px; 
  left: 617px; 
}
.ket5 {
  position: relative; 
  top: -259px; 
  left: 549px; 
}
.ket6 {
  position: relative; 
  top: -249px; 
  left: 605px; 
}
.ket7 {
  position: relative; 
  top: -239px; 
  left: 662px; 
}
.ket8 {
  position: relative; 
  top: -371px; 
  left: 864px; 
}
.ket9 {
  position: relative; 
  top: -336px; 
  left: 772px; 
}
.ket10 {
  position: relative; 
  top: -260px; 
  left: 721px; 
}

@media(max-width: 2800px) {
  .img-unit-reservation {
	  display: none;
  }
}
@media(max-width: 1340px) {
  .unit-reservation {
    display: none !important;
  }
  .img-unit-reservation {
    display: inline;
  }
  .dispatch-list {
    padding-top: 68px;
  }
}
@media(max-width: 1260px) {
  .kotak {
    left: 353px;
  }
}
@media(max-width: 1200px) {
  .kotak {
    left: 312px;
  }
}
@media(max-width: 1105px) {
  .kotak {
    left: 257px;
  }
}
@media(max-width: 1050px) {
  .kotak {
    left: 247px;
	width: 550px;
  }
}
@media(max-width: 991px) {
  .kotak {
    left: 174px;
	width: 520px;
  }
  .dispatch-list {
    padding-top: 40px;
  }
}
@media(max-width: 880px) {
  .kotak {
    left: 140px;
	width: 510px;
  }
}
@media(max-width: 788px) {
  .kotak {
    left: 83px;
  }
}
@media(max-width: 700px) {
  .kotak {
    left: 56px;
	width: 490px;
  }
}
@media(max-width: 637px) {
  .kotak {
    left: 42px;
	width: 460px;
  }
}
@media(max-width: 579px) {
  .kotak {
	width: 430px;
  }
}
@media(max-width: 560px) {
  .kotak {
    left: 30px;
	width: 420px;
  }
}
@media(max-width: 523px) {
  .kotak {
    left: 20px;
	width: 406px;
  }
}
@media(max-width: 484px) {
  .kotak {
    left: 11px;
	width: 390px;
  }
}
@media(max-width: 450px) {
  .kotak {
    left: 5px;
	width: 370px;
  }
}
@media(max-width: 425px) {
  .kotak {
	width: 344px;
  }
}
@media(max-width: 399px) {
  .kotak {
	width: 325px;
  }
}
@media(max-width: 377px) {
  .kotak {
    left: -9px;
  }
}
@media(max-width: 360px) {
  .kotak {
	left: -16px;
	width: 315px;
  }
}
@media(max-width: 345px) {
  .kotak {
	width: 300px;
  }
}