/* ===== GLOBAL STYLES ===== */
html {
  scroll-behavior: smooth; /* Smooth scrolling */
  box-sizing: border-box;
  font-family: Arial, sans-serif;
  scroll-padding-top: 70px; /* Offset for sticky header */
  margin: 0;
  padding: 0;
}


.searchForm > input{
  border-radius: 10px solid black !important;
  border:1px solid rgb(122, 122, 122) !important
}
.searchForm > button{  
  padding:.75rem 1rem
}
@media (max-width:576px){
  .logo {
  margin-left: .5rem;
  width: 6rem;
}
header > .row > div >a> button{
  font-size:xx-small
}

}
/* Logo */
.logo {
  margin-left: 1rem;
  width: 12rem;
}
.successBox,.errorBox {
  position: fixed;
  top: 6rem;
  left: 0;
  width: 100%;
  z-index: 9999; /* stays above everything */
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  padding: 12px;
  font-weight: bold;
  transition: opacity 1s ease,transform 1s ease;
}
.fadeOut{
  opacity:0;
  transform: translateY(-2rem);
}
header{
  position: sticky !important;
top: 0;
z-index: 1020;
}