body{
	font-family: 'Noto Sans TC', sans-serif;
}

button:active {
  background-color: #d1d1d1; /* Darken color on click */
  transform: translateY(2px); /* Moves button down slightly */
}

img.img-responsive {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.bg-readonly{
  background-color: red;
}

.highlighted {
  border: 1px solid red;
  color: red;
}

.error-div {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */
  height: 100vh;
  width: 100vw;
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  left: 0;
  top: 0px;
  display: none;
  background-color: rgba(255,255,255, 0.9); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
  text-align: center;
  font-size: 6vmin;
  color: #900000;
  padding-top: 49vh;
}

.ajax-loader {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */
  height: 100vh;
  width: 100vw;
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  left: 0;
  top: 0px;
  display: none;
  background-color: rgba(255,255,255, 0.6); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

img.img-responsive {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}