.btn {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #000;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  background-color: #e9ecef;
  border: 1px solid #e9ecef;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.btn *,
.btn *::before,
.btn *::after {
  box-sizing: inherit;
}
.btn img,
.btn svg {
  display: inline-flex;
  vertical-align: -0.125em;
  width: 1em;
  height: 1em;
}
.btn:hover {
  text-decoration: none;
  background-color: hsl(210, 15.7894736842%, 102.5490196078%);
}
.btn:focus {
  outline: none;
}
.btn.disabled, .btn:disabled {
  opacity: 0.65;
  pointer-events: none;
}

.btn.primary {
  background-color: #007bff;
  border-color: #007bff;
  color: #fff;
}
.btn.primary:hover {
  text-decoration: none;
  background-color: rgb(51, 149.4, 255);
}

.btn.outline {
  background-color: transparent;
  border-color: #e9ecef;
}
.btn.outline:hover {
  text-decoration: none;
  background-color: #e9ecef;
}
.btn.outline.primary {
  border-color: #007bff;
  color: #007bff;
}

.btn.link {
  background-color: transparent;
  color: #007bff;
  border-color: transparent;
}
.btn.link:hover {
  background-color: #e9ecef;
}

.btn.block {
  width: 100%;
  display: block;
}

.btn.small {
  padding: 0.1rem 0.4rem;
}