@font-face {
  font-family: "PeydaWeb";
  src: url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.eot");
  src: url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.eot?#iefix") format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.woff2") format("woff2"),
    url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.woff") format("woff"),
    url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.ttf") format("truetype"),
    url("https://db.onlinewebfonts.com/t/bad932b256c899a3f6f0651b9ca19470.svg#PeydaWeb") format("svg");
}

body {
  padding: 0;
  position: relative;
}

.imgToolbar {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 1%;
  right: 5%;
  justify-content: center;
}

.toolbar1 {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 1%;
  right: 30%;
  justify-content: center;
}

.toolbar2 {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 1%;
  left: 23%;
  justify-content: center;
}

.frstCntnr1 {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 14%;
  left: 10%;
  justify-content: center;
}

.frstCntnr2 {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 14%;
  left: -2%;
  justify-content: center;
}

.midCntnr {
  position: absolute;
  width: 69%;
  text-align: center;
  justify-content: center;
  display: flex;
  top: 68%;
  left: 16%;
  justify-content: center;
}

.lastCntnr1 {
  position: absolute;
  width: 100%;
  text-align: center;
  justify-content: center;
  display: flex;
  bottom: 1%;
  right: 0;
  justify-content: center;
}

.lastCntnr2 {
  position: absolute;
  width: 36%;
  text-align: center;
  justify-content: center;
  display: flex;
  bottom: 1%;
  left: 26%;
  justify-content: center;
}

.toolBtn1 {
  width: 30%;
  height: 64px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0);
  color: #000;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  z-index: 999;
}

.toolBtn2 {
  width: 30%;
  height: 64px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0);
  color: #000;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  z-index: 999;
}

.modalBtn1 {
  width: 30%;
  height: 64px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0);
  color: #ff4f01;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  z-index: 999;
  border: 1px solid #ff4f01;
}

.modalBtn2 {
  width: 30%;
  height: 64px;
  border-radius: 8px;
  background-color: #ff4f01;
  color: white;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  z-index: 999;
}

.modalBtn3 {
  width: 30%;
  height: 64px;
  border-radius: 8px;
  background-color: #ff4f01;
  color: white;
  border: none;
  font-family: PeydaWeb;
  font-size: 24px;
  cursor: pointer;
  z-index: 999;
}

.modalBtn4 {
  width: 20%;
  height: 64px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0);
  color: white;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  z-index: 999;
  margin-right: 5px;
  margin-left: 5px;
  border: 1px solid white;
}

.modalBtn5 {
  width: 20%;
  height: 64px;
  border-radius: 8px;
  background-color: white;
  color: #ff4f01;
  border: none;
  font-family: PeydaWeb;
  font-size: 20px;
  cursor: pointer;
  margin-right: 5px;
  margin-left: 5px;
  z-index: 999;
}

@media (max-width: 768px) {

  .toolbar1,
  .toolbar2 {
    top: 0%;
  }

  .toolBtn1,
  .toolBtn2 {
    font-size: 7px;
    width: 50%;
  }

  .modalBtn1,
  .modalBtn2,
  .modalBtn3 {
    font-size: 8px;
    height: 22px;
    width: 51%;
  }

  .modalBtn4,
  .modalBtn5 {
    font-size: 8px;
    height: 22px;
    width: 30%;
  }

  .frstCntnr1 {
    width: 40%;
    left: 18%;
    top: 17%;
  }

  .frstCntnr2 {
    width: 40%;
    left: -20;
    top: 17%;
  }

  .lastCntnr1 {
    bottom: 2%;
    width: 100%;
  }

  .lastCntnr2 {
    left: 22%;
    width: 40%;
    bottom: 2%;
  }
}

@media (max-width: 380px) {}