/* Bootstrap over-rides ======= */
:root {
  /* Self  */
  --transition: all 300ms ease;
  --thirdly: #f8fbff;
  /* Bootstrap  */
  --bs-body-font-family: "Poppins", sans-serif;
  --bs-btn-hover-bg: #3d69b7;
  --bs-primary: #2a4e8b;
  --bs-primary-rgb: 28, 57, 108;
  --bs-primary-bg-subtle: #ffdbd9;
  --bs-secondary-bg-subtle: #f2f3f6;
}
.btn {
  --bs-btn-padding-x: 1rem;
  --bs-btn-padding-y: 0.75rem;
  --bs-btn-border-radius: var(--bs-border-radius-xl);
}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-btn-hover-bg);
  --bs-btn-hover-bg: var(--bs-btn-hover-bg);
  --bs-btn-hover-border-color: var(--bs-btn-hover-bg);
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0a58ca;
  --bs-btn-active-border-color: #0a53be;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
}
.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: 13,110,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0d6efd;
  --bs-btn-active-border-color: #0d6efd;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #0d6efd;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #0d6efd;
  --bs-gradient: none;
}
.bg-thirdly {
  background-color: var(--thirdly);
}
section {
  scroll-margin-top: 50px;
}
/* Bootstrap over-rides ======= */

/* Head utils ======= */
.bar {
  max-width: 100%;
  width: 500px;
  height: 3px;
  background-color: var(--bs-primary);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
}
.form-control {
  border-radius: var(--bs-border-radius-lg);
}
.form-floating>.form-control, .form-floating>.form-control-plaintext {
  padding: 1rem 1.4rem;
}
.form-floating>label {
  padding: 1rem 1.4rem;
}
/* Head utils ======= */

img {
  width: 100%;
  height: auto;
}
.w-fit {
  width: fit-content;
}
.max-w-100 {
  max-width: 100%;
}
.max-w-90 {
  max-width: 90%;
}
.h-full {
  height: 100%;
}
.inset-0 {
  inset: 0;
}
.flex-middle {
  display: flex;
  align-items: center;
}
.flex-column {
  display: flex;
  flex-direction: column;
}
.flex-middle-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-middle-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex-column-between {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.h-full-stretched {
  height: 100%;
  display: flex !important;
  flex-direction: column;
  justify-content: space-between;
}
.shadow-1 {
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.cursor-grab {
  cursor: grab;
}
.cursor-grab:active, .cursor-grab:focus {
  cursor: grabbing;
}
/* Hover & Animations ================ */
.transition {
  transition: var(--transition);
}
.hover\:p .hover\:c,
.hover\:p.hover\:c {
  transition: var(--transition);
}
.hover\:p.active .c-bg,
.hover\:p.active.c-bg,
.hover\:p:hover .c-bg,
.hover\:p:hover.c-bg {
  --h-bg-value: var(--bs-white);
  background-color: var(--h-bg-value) !important;
}
.hover\:p.active .c-shadow,
.hover\:p.active.c-shadow,
.hover\:p:hover .c-shadow,
.hover\:p:hover.c-shadow {
  --h-bg-value: var(--bs-box-shadow-lg);
  box-shadow: var(--h-bg-value) !important;
}
.hover\:p.active .c-shadow-2,
.hover\:p.active.c-shadow-2,
.hover\:p:hover .c-shadow-2,
.hover\:p:hover.c-shadow-2 {
  --h-bg-value: var(--bs-box-shadow-lg);
  box-shadow: var(--h-bg-value) !important;
}
.hover\:p:hover .c-color {
  color: var(--bs-primary);
}
.hover\:p:hover .c-scale {
  transform: scale(1.1);
}
.hover\:p:hover .c-rotate {
  transform: rotate(180deg);
}

/* Media Queries ============ */

@media (max-width: 576px) {
  .bar {
    width: 200px;
  }
  section {
    scroll-margin-top: 360px;
  }
}