/* break through tech colors:
neon green: #C1F325
green: #81D742
dark blue: #092D45

*/

.container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; /* Three columns */
    grid-template-rows: 100px 1fr 100px; /* Three rows */
    grid-template-areas:
      "nav nav nav"
      "hero hero hero"
      "faq faq faq"
      "footer footer footer";
    background-color: #092D45;
}

@media (max-width: 768px) { /* Adjust breakpoint as needed */
    .container {
      grid-template-columns: 1fr; /* Single column */
    }

    nav ul {
      flex-direction: column; /* Vertical menu on smaller screens */
    }

    nav li {
      margin: 10px 0; /* Adjust margin for vertical menu */
    }

    .hero {
      height: auto; /* Adjust height for smaller screens */
    }
}

nav {
    background-color: #092D45; /* Navy Blue from Breakthrough Tech */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px; /* Adjust padding as needed */
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

nav li {
    margin: 0 20px; /* Adjust margin as needed */
}

nav ul li:last-child a {
    padding: 15px 35px;
    background-color: #FFFFFF;
    color: #092D45;
  }
nav a {
    color: #C1F325;
    text-decoration: none;
    font-weight: bold;
}

nav a:hover {
    text-decoration: underline;
}

.guestbook-entries {
    text-align: center;
}

.hero {
    background-color: #FFFFFF;
    background-size: cover;
    background-position: center;
    height: 300px; /* Adjust height as needed */
    display: flex;
    align-items: center;
    justify-content: center;

}

.hero-content {
    text-align: center;
    color: black; /* Change to match background color */
}

.hero-button {
    background-color: #C1F325;
    color: #092D45;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 20px; /* Adjust the value as needed */
}

#chatbot {
    padding: 20px;
}

#faq {
    background-color: #092D45; /* Replace with your desired background color */
    color: #C1F325; /* Replace with your desired text color */
    padding: 20px; /* Optional: Add padding for spacing */
}

#faq h1{
    color: #FFFFFF;
}
.answer {
    color:#092D45;
    padding: 20px;
}

#qna {
    list-style-type: none;
    padding: 0;
}

#qna li {
    text-align: center;
}

#qna h4 {
    margin: 0;
}

#faq p {
    color:#FFFFFF;
}

body {
    font-family: 'Ubuntu', sans-serif;
    color: #000000;
    font-weight: bold;
    text-align: center;
}

nav a {
    color: #C1F325;
    text-decoration: none;
    font-weight: bold;
}