# Navigation
### Navbar
We have worked with the default Bootstrap Navbar and created three variations in colour: `.navbar-white`, `.navbar-black` and `.navbar-navy`. You can see an example of a white navbar below:
```markup
```
### Double Navbar
If you have a lot of links in your navigation or you just want to display more information, you can use the double navbar. This basically means having 2 navbars, one with the class `.top-navbar` and one with the class `.bottom-navbar`.
### Overlays
If you want a link in your navbar to open an overlay navigation (a layer that takes up the whole page), you can use the overlay functionality. You can see an example below:
```markup
```
```javascript
//javascript that opens and closes the overlay
$('.open-overlay').click(function() {
var id = $(this).data('overlay');
document.getElementById("overlay-" + id).style.height = "100%";
});
$('.close-overlay').click(function() {
var id = $(this).data('overlay');
document.getElementById("overlay-" + id).style.height = "0%";
});
```
### Footer
There are three colour possibilities for the footer `.footer-white`, `.footer-black` and `.footer-navy`. Here is an example of a white footer.
```markup
```
### Double Footer
If you have a lot of information to display in the footer or you want to add a subscribe form, you can use the double footer. Like in the case of the navbar, you will need the `.footer-top` class for the div that is on top and the `.footer-bottom` class for the one at the bottom.
Here is an example:
```markup
```
If you want to see more examples and properties please check the official [Bootstrap Documentation](https://getbootstrap.com/docs/4.1/components/navbar/).
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://bootstrapbay.gitbook.io/grace-ui-kit/components/navigation.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.