html,
body {
  height: 100vh;
}

main {
  height: 100vh;
  overflow-x: hidden;
}

.w-20 {
  width: 20%;
}

.w-30 {
  width: 30%;
}

.active {
  /* font-weight: bold; */
  border-radius: 0.375rem;
  background-color: rgb(84, 44, 230);
  color: white !important;
}

.vr {
  margin-left: 8px;
  margin-right: 8px;
}

.nav-item {
  margin-left: 6px;
  margin-right: 6px;
}

.alert {
  text-align: center;
}

.custom-file-button{
  width: auto !important;
}

.custom-file-button input[type=file] {
  width: 200px;
  margin-left: -2px !important;
}

.custom-file-button input[type=file]::-webkit-file-upload-button {
  display: none;
}

.custom-file-button input[type=file]::file-selector-button {
  display: none;
}

.custom-file-button:hover input {
  background-color: #f0f0f0;
}

.content {
  max-height: 90%;
  width: 95%;
}

.overlay {
  position: fixed;
  z-index: 10;
}

.greyfade {
  position: fixed;
  background-color: black;
  opacity: 0.5;
  width: 100%;
  height: 100%;
}

.loader {
  position: fixed;
  width: 8rem;
  height: 8rem;
  top: 50%;
  left: 50%;
  margin-top: -100px;
  margin-left: -100px;
}