html, body {
  background-color: white;
  height: 100vh;
  min-height: 100vh;
  max-height: 100vh;
  padding: 0;
  margin: 0;
  font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;
  box-sizing: border-box;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
}

body{
  padding: 5px;
}

input, select{
  margin: 3px;
  display: block;
  background: transparent;
  font-size: inherit; 
  box-sizing: border-box;
  border: none;
  background-color: transparent;
  outline: none; 
  border-bottom: 2px solid #adadad;
}

input.search{font-size: 5vh; text-align: center;}

input:focus {
  border-color: #007bff; /* Highlight border when focused */
  outline: 2px solid #80bdff; /* Add a custom outline */
  outline-offset: 2px; /* Distance between outline and input */
}

textarea{
  margin: 3px;
  display: block;
  background: transparent;
  width: calc(100% - 12px);
  font-size: inherit; 
  box-sizing: border-box;
  border: none;
  background-color: transparent;
  outline: none; 
  border-bottom: 2px solid #adadad;
}

.hidden {
  display: none;
  width: 0;
}


button.cornerButton{
  position: absolute;
  border-width: inherit;
  border-color: inherit;
  border-radius: 0 5px 0 5px;
  box-sizing: content-box;

  cursor: pointer;
}