body {
  counter-reset: Serial;
}



table {
  
  margin: auto;
  border-collapse: collapse;
  width: 85%;
  /*! max-width: 800px; */
}

table th,
table td {
  padding: 8px;
  text-align: left;
  vertical-align: middle;
  border: 1px solid #ddd;
}

table th {
  background-color: #f2f2f2;
}

table caption {
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
  caption-side: top;
}

table thead th {
  text-align: center;
}



tr td:first-child:before {
  counter-increment: Serial;
  content: counter(Serial);

}


tr>td:nth-child(1) {
  text-align: center;
}



tr>td:nth-child(2) {
  text-align: center;
}


tr>td:nth-child(3) {
  text-align: center;
}


tr>td:nth-child(4) {
  text-align: center;
}



tr>td:nth-child(5) {
  text-align: center;
}



tr>td:nth-child(6) {
  text-align: center;
}



/* notifying user */

  #notifyUser {
    width: fit-content;
    margin: auto;
    display: none;
    margin-top: 15px;
  margin-bottom: -7px;
  }
  
  

  /* input prompt  */
  #prompt-container-backcover{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #cdcbc9e0;
    z-index: 9999;
    text-align: center;
    padding-top: 15%;
  }
  
  #prompt-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 20px;
    border: 1px solid black;
    width: 400px;
  }
  
  #prompt-container label {
    display: block;
    margin-bottom: 10px;
  }
  
  #prompt-container input {
    width: 100%;
    margin-bottom: 10px;
  }
  
  #prompt-container button[id="prompt-ok"] {
    width: 100px;
  background-color: #36ff2f;
  color: white;
  font-size: 20px;
  margin-right: 19px;
  padding: 0px 10px;
   
  }
  
  #prompt-container button[id="prompt-cancel"] {
    background-color: #e61313;
    color: white;
    font-size: 20px;
    padding: 0px 20px;
  }
  


  


  #formForTakingLocationId{
    padding: 20px;
     margin-left: auto;
    margin-right: auto;
    width: fit-content;
    margin-top: 20px;
  }
  

  #formForTakingLocationId input{
  padding-left: 10px;
  height: 33px;
}

  #formForTakingLocationId button{
    background: #0543ff;
    border: none;
    color: white;
    padding: 2px 10px;
    font-size: 18px;
    margin-left: 20px;
  }
  


  .buyButton{
    border: none;
    width: 72px;
    font-size: 18px;
    font-weight: 600;
    color: white;
    background: #16e330;
    border-radius: 10px;
  }


  
  .buyButton:hover{
    border-radius: 0px;
    box-shadow: 2px 2px 2px gray;
  }