@font-face {
  font-family: "lora_variable";
  src: url(Lora/Lora-Italic-VariableFont_wght.ttf);
}
@font-face {
  font-family: "Crimson_text";
  src: url(Crimson_Text/CrimsonText-Regular.ttf);
}
* {
  font-family: "lora_variable", "Crimson_text", "Times New Roman", Times, serif;
  font-style: normal;
}
#body {
  background-color: #6e6e6e;
}
#navbar {
  background-color: aliceblue;
  border-bottom: 2px solid black;
}
#lower_navbar {
  position: sticky;
  top: 0px;
  z-index: 2;
}
#button_navbar {
  background-color: black;
  border-bottom: 2px solid #ffc107;
  border-top: 2px solid #ffc107;
  position: sticky;
  top: 0px;
  z-index: 2;
}

#search_bar {
  border: 0px solid #545454;
  border-radius: 5p;
}

#search_field {
  border-style: none;
  width: max-content;
  border-radius: 5px 0px 0px 5px;
}
#search_field:focus {
  border-style: none;
  outline: none;
}
#search_btn {
  border-style: none;
  border-radius: 0px 4px 4px 0px;
  font-weight: 400;
  color: #ffc107;
  background-color: #545454;
  transition: all 0.7s ease;
}
#search_btn:hover {
  color: #545454;
  background-color: #ffc107;
}
#toggle_icon {
  background-color: #545454;
  border: 2px solid #ffc107;
  border-radius: 5px;
}
#home {
  color: #ffc107;
  transition: all 0.7s ease;
  border-radius: 5px;
}
#home:hover {
  color: black;
  background-color: #ffc107;
}
#navbarDropdown {
  color: #ffc107;
  transition: all 0.7s ease;
  border-radius: 5px;
}
#navbarDropdown:hover {
  color: black;
  background-color: #ffc107;
}
#aboutus {
  color: #ffc107;
  transition: all 0.7s ease;
  border-radius: 5px;
}
#aboutus:hover {
  color: black;
  background-color: #ffc107;
}
#contact {
  color: #ffc107;
  transition: all 0.7s ease;
  border-radius: 5px;
}
#contact:hover {
  color: black;
  background-color: #ffc107;
}
#footer {
  background-color: aliceblue;
}
a {
  text-decoration: none;
}