/* css for about page */ 

#div_about1 {
  display: none; 
  position: absolute; 
  top: 4em; /* give space for logo & head/title */ 
  left: 1%; 
  
  text-align: justify; 
  width: 96%; 
  /* margin: -1em 0 1em 0;  */
  margin: auto; 

  padding: 1.8em; /* more padding for about article, page width paragrap easier to read */ 

  background-color: white; /* to cover the detail div background */ 
  background-image: url("../img/receipt-book-watermark2.png");
  
}

#div_QnA {
  display: none; 
  position: absolute; 
  top: 4em; /* give space for logo & head/title */ 
  left: 1%; 
  
  text-align: justify; 
  width: 96%; 
  margin: auto; 

  padding: 1em 0 0 0; /* less padding for bullet type questions n answers */ 

  background-color: white;   /* can cover background cuz of the list */ 
  background-image: url("../img/receipt-book-watermark2.png");
}

/* contact */
#div_contact1 {
  display: none; 
  position: absolute; 
  top: 4em; 
  left: 1%; 
  
  width: 96%; 
  margin: auto; 

  padding: 1em 2em 0 2em; 

  /* background-color: white;  */
  background-image: url("../img/receipt-book-watermark2.png");
}

/* for 1 digit/char left margin, the question started with 2 digit: 1, 2 .. etc */
.accordion-body {
  margin-left: 1.2em; 
  font-size: 90%; 
}

/* for 2 digit/char left margin, the question started with 2 digit: 10, 11 .. etc */
.char2 {
  margin-left: 1.8em; 
}


.accordion-header {
  font-size:110%; 
}
/* end of about */ 

/* somehow got a huge space at top, temp fix here without knowing the cause */ 
h4 {
  margin-top: -1em; 
}

#name1, #email1, #message1 {
  margin-bottom: 1em; 
}

/* not enabled yet, until email ready */ 
#id_signup_new_email {
  color: gray;
  font-size: 90%;
}

#close_about1, #close_QnA {
  margin: auto;
  margin-bottom: 1em; 
  width: 100%; 
}

.ul_about_how_to_use {
  margin-left: -3.2em;
  list-style-image: url(../img/tick_green4.png);
}

.ul_about_how_to_use0 {
  margin-left: 1.5em; 
  list-style-image: url('../img/person1.png');
}