:root {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.container {
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container { max-width: 540px; }
}
@media (min-width: 768px) {
  .container { max-width: 720px; }
}
@media (min-width: 992px) {
  .container { max-width: 960px; }
}
@media (min-width: 1200px) {
  .container { max-width: 1140px; }
}
@media (min-width: 1400px) {
  .container { max-width: 1320px; }
}

.d-none { display: none !important; }
.d-flex { display: flex !important; }

.flex-column { flex-direction: column !important; }
.flex-grow-1 { flex-grow: 1 !important; }
.align-items-center { align-items: center !important; }
.justify-content-center { justify-content: center !important; }

@media (min-width: 992px) {
  .flex-lg-row { flex-direction: row !important; }
}

.text-center { text-align: center !important; }
.text-white { color: #fff !important; }
.text-warning { color: #ffc107 !important; }

@media (min-width: 992px) {
  .text-lg-start { text-align: left !important; }
}

.bg-dark { background-color: #212529 !important; }
.bg-light { background-color: #f8f9fa !important; }
.bg-white { background-color: #fff !important; }

.min-vh-100 { min-height: 100vh !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: .25rem !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.me-2 { margin-right: .5rem !important; }
.me-3 { margin-right: 1rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

@media (min-width: 992px) {
  .mb-lg-0 { margin-bottom: 0 !important; }
  .me-lg-4 { margin-right: 1.5rem !important; }
}

.p-4 { padding: 1.5rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

.rounded { border-radius: .375rem !important; }
.shadow { box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important; }

.img-fluid {
  max-width: 100%;
  height: auto;
}

.input-group {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  width: 100%;
}

.input-group > .form-control,
.input-group > .btn {
  position: relative;
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
}

.input-group > .btn {
  flex: 0 0 auto;
  width: auto;
}