@import url(https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;500;700&family=Montserrat:wght@300;500;700&display=swap);



html {
  font-family: Montserrat, "Noto Sans TC", sans-serif !important;
  line-height: 1.5;
  /* 2 */
  font-size: 20px !important;
}

p {
  font-weight: 200;
}

select {
  color: rgb(64, 66, 66) !important;
  font-weight: 300 !important;
}

@font-face {
  font-family: GenRyuMin;
  font-weight: 300;
  src: url(fonts/GenRyuMinTW-Light.ttf) format("truetype");
}

@font-face {
  font-family: GenRyuMin;
  font-weight: 500;
  src: url(fonts/GenRyuMinTW-Medium.ttf) format("truetype");
}

@font-face {
  font-family: GenRyuMin;
  font-weight: 700;
  src: url(fonts/GenRyuMinTW-Bold.ttf) format("truetype");
}

.text,
h2 {
  font-family: Montserrat, GenRyuMin, "Noto Sans TC", sans-serif;
  /*font-weight: 500;*/
}

.container {
  /*max-width: 1300px;*/
}

label {
  font-family: Montserrat, "Noto Sans TC", sans-serif;
  font-size: 20px !important;
  line-height: 1.5;
  font-weight: 300;
}

button,
input[type='text'],
input[type='email'],
select {
  border: 1px solid rgb(123, 128, 128) !important;
  background-color: rgba(221, 224, 209, 1) !important;
  height: 50px;
  font-size: 20px !important;
  font-weight: 300;
  line-height: 30px;
  border-radius: 0 !important;
}

textarea {
  border: 1px solid rgb(123, 128, 128) !important;
  background-color: rgba(221, 224, 209, 1) !important;
  font-size: 20px !important;
  font-weight: 300;
  line-height: 30px;
  border-radius: 0 !important;
}

input::placeholder {
  color: gray !important;
}



input[type="checkbox"] {
  border: 1px solid rgb(123, 128, 128) !important;
  background-color: #404242 !important;
  border-radius: 0 !important;
  accent-color: rgb(123, 128, 128) !important;
}

input[type="checkbox"]:not(:checked):not(:disabled) {
  background-color: rgb(221, 224, 209, 1) !important;
}

input[type="radio"] {
  background-color: #404242 !important;
  border: 1px solid rgb(123, 128, 128) !important;
}

input[type="radio"]:not(:checked):not(:disabled) {
  background-color: rgb(221, 224, 209, 1) !important;
  border: 1px solid rgb(123, 128, 128) !important;
}

.living-city-option { 
  cursor: pointer; 
}

#reg_summary_table td {
  height: 80px;
}

.table td,
.table th {
  background-color: rgba(221, 224, 209, 1) !important;
}

#reg_summary_table2 td {
  background-color: rgba(221, 224, 209, 1) !important;
  border: none;
}

#reg_summary_table2 .header {
  background-color: rgba(190, 192, 180, 1) !important;
  height: 30px;
}

#reg_summary_table2 {
  border: 1px solid rgba(190, 192, 180, 1);
}

.modal_EG_style {
  background-color: rgba(190, 192, 180, 1) !important;
  height: 500px;
}

.modal .input_style2 {
  border: none !important;
  border-bottom: 1px solid black !important;
  background-color: rgba(190, 192, 180, 1) !important;
}

.modal .button_style2 {
  background-color: rgba(190, 192, 180, 1) !important;
}

/*
|--------------------------------------------------------------------------
| TNC modal
|--------------------------------------------------------------------------
*/
.modal-body {
  padding: 0;
  margin: 0;
}

.modal-content {
  border-radius: 0;
  border: 2px solid black;
}

.modal-open {
  overflow: hidden;
  overflow-y: scroll;
  padding-right: 0 !important;
}

/*
|--------------------------------------------------------------------------
| Data table
|--------------------------------------------------------------------------
*/
#table_staffList #table_staffList_wrapper {
  background-color: rgba(190, 192, 180, 1) !important;
}

/*
|--------------------------------------------------------------------------
| QR Screen
|--------------------------------------------------------------------------
*/
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

canvas {
  width: 200pt;
  height: 200pt;
  border: 0px solid lightgrey;
}