/* styles.css */
/*Do not make changes unless you were instructed */
body {
  font-family: 'Open Sans', sans-serif;
}

/* Navbar styling */
nav.navbar {
  background-color: #0078D4; /* Dark background color */
}

nav.navbar a.navbar-brand,
nav.navbar a.nav-link {
  color: #ffffff; /* White text color for the brand and links */
}

/* Media query for mobile view */
@media (max-width: 767px) {
  /* Push the content down to make room for the fixed navbar */
  body {
    padding-top: 56px;
  }

  /* Move the burger menu to the left */
  button.navbar-toggler {
    order: -1;
  }

  /* Style the burger menu icon */
  button.navbar-toggler span.icon-bar {
    background-color: #ffffff; /* White color for the burger menu icon bars */
  }
}

a {
  color: black;
}

img.carousel {
  width: 10px;
}

a.btn.btn-primary {
  background-color: #0078D4;
  border: none;
}

div.container.mt-5 {
  border-bottom: 2px solid lightslategray;
}

h1.times {
  font-family: 'Times New Roman', Times, serif;
}

.navbar-brand {
  max-width: 250px; /* Adjust based on your preference */
  width: 100%;
  height: auto;
  position: relative;
}

a.navbar-toggler {
  order: -1;
}

.js-warning {
  display: none;
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
  color: #721c24;
  padding: 10px;
  margin-top: 20px;
  border-radius: 5px;
  text-align: center;
}

/* Footer styles */
footer {
  background-color: #0078D4;
  color: #ffffff;
  text-align: inherit;
  padding: 20px 0;
}

.footer-content {
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer-text {
  margin: 0;
  font-size: 14px;
}

/* GitHub icon styles */
.github-icon {
  font-size: 24px;
  color: #ffffff;
  margin-left: 10px;
}

p6.date {
  color: grey;
  font-size: small;
}
h2.times {
  font-family: 'Times New Roman', Times, serif;
}
#js-disabled-warning {
  display: none;
  background-color: #f8d7da; /* Bootstrap's danger color */
  color: #0078D4; /* Bootstrap's dark red color */
  padding: 10px;
  margin: 10px;
  border-radius: 5px;
  text-align: center;
}
h1.logo {
  font-size: medium;
  font-family: 'Audiowide', cursive;
}
/* styles.css */
.loading-spinner {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}
