<ul class="nav bg-primary-transparent">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav justify-content-center bg-primary-transparent">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav flex-column bg-primary-transparent">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav nav-tabs">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav nav-pills">
		<li class="nav-item">
			lt;a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

<ul class="nav nav-underline">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav nav-pills nav-fill">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Much longer nav link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav nav-tabs">
		<li class="nav-item">
			<a class="nav-link active" aria-current="page" href="#">Active</a>
		</li>
		<li class="nav-item dropdown">
			<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false">Dropdown</a>
			<ul class="dropdown-menu">
				<li><a class="dropdown-item" href="#">Action</a></li>
				<li><a class="dropdown-item" href="#">Another action</a></li>
				<li><a class="dropdown-item" href="#">Something else here</a></li>
				<li><hr class="dropdown-divider"></li>
				<li><a class="dropdown-item" href="#">Separated link</a></li>
			</ul>
		</li>
		<li class="nav-item">
			<a class="nav-link" href="#">Link</a>
		</li>
		<li class="nav-item">
			<a class="nav-link disabled" aria-disabled="true">Disabled</a>
		</li>
	</ul>

	<ul class="nav nav-tabs" id="myTab" role="tablist">
		<li class="nav-item" role="presentation">
			<button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home-tab-pane" type="button" role="tab" aria-controls="home-tab-pane" aria-selected="true">Home</button>
		</li>
		<li class="nav-item" role="presentation">
			<button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#profile-tab-pane" type="button" role="tab" aria-controls="profile-tab-pane" aria-selected="false">Profile</button>
		</li>
		<li class="nav-item" role="presentation">
			<button class="nav-link" id="contact-tab" data-bs-toggle="tab" data-bs-target="#contact-tab-pane" type="button" role="tab" aria-controls="contact-tab-pane" aria-selected="false">Contact</button>
		</li>
		<li class="nav-item" role="presentation">
			<button class="nav-link" id="disabled-tab" data-bs-toggle="tab" data-bs-target="#disabled-tab-pane" type="button" role="tab" aria-controls="disabled-tab-pane" aria-selected="false" disabled>Disabled</button>
		</li>
	</ul>
	<div class="tab-content pt-3" id="myTabContent">
		<div class="tab-pane text-body fade show active" id="home-tab-pane" role="tabpanel" aria-labelledby="home-tab" tabindex="0">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus ipsa quia exercitationem delectus expedita illo quo aut. Asperiores delectus vero fugit ea incidunt minima soluta possimus, necessitatibus voluptatum quasi? Exercitationem?</div>
		<div class="tab-pane text-body fade" id="profile-tab-pane" role="tabpanel" aria-labelledby="profile-tab" tabindex="0">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus ipsa quia exercitationem delectus expedita illo quo aut. Asperiores delectus vero fugit ea incidunt minima soluta possimus, necessitatibus voluptatum quasi? Exercitationem?</div>
		<div class="tab-pane text-body fade" id="contact-tab-pane" role="tabpanel" aria-labelledby="contact-tab" tabindex="0">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus ipsa quia exercitationem delectus expedita illo quo aut. Asperiores delectus vero fugit ea incidunt minima soluta possimus, necessitatibus voluptatum quasi? Exercitationem?</div>
		<div class="tab-pane text-body fade" id="disabled-tab-pane" role="tabpanel" aria-labelledby="disabled-tab" tabindex="0">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus ipsa quia exercitationem delectus expedita illo quo aut. Asperiores delectus vero fugit ea incidunt minima soluta possimus, necessitatibus voluptatum quasi? Exercitationem?</div>
	</div>

	<div class="d-flex align-items-start">
		<div class="nav flex-column nav-pills me-3" id="v-pills-tab" role="tablist" aria-orientation="vertical">
			<button class="nav-link active" id="v-pills-home-tab" data-bs-toggle="pill" data-bs-target="#v-pills-home" type="button" role="tab" aria-controls="v-pills-home" aria-selected="true">Home</button>
			<button class="nav-link" id="v-pills-profile-tab" data-bs-toggle="pill" data-bs-target="#v-pills-profile" type="button" role="tab" aria-controls="v-pills-profile" aria-selected="false">Profile</button>
			<button class="nav-link" id="v-pills-disabled-tab" data-bs-toggle="pill" data-bs-target="#v-pills-disabled" type="button" role="tab" aria-controls="v-pills-disabled" aria-selected="false" disabled>Disabled</button>
			<button class="nav-link" id="v-pills-messages-tab" data-bs-toggle="pill" data-bs-target="#v-pills-messages" type="button" role="tab" aria-controls="v-pills-messages" aria-selected="false">Messages</button>
			<button class="nav-link" id="v-pills-settings-tab" data-bs-toggle="pill" data-bs-target="#v-pills-settings" type="button" role="tab" aria-controls="v-pills-settings" aria-selected="false">Settings</button>
		</div>
		<div class="tab-content mt-3" id="v-pills-tabContent">
			<div class="tab-pane text-body fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab" tabindex="0">
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse, assumenda asperiores! Omnis magni qui debitis laborum autem alias eius tenetur cupiditate, amet voluptas, nulla sequi quam inventore blanditiis repudiandae. Expedita?
			</div>
			<div class="tab-pane text-body fade" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab" tabindex="0">
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse, assumenda asperiores! Omnis magni qui debitis laborum autem alias eius tenetur cupiditate, amet voluptas, nulla sequi quam inventore blanditiis repudiandae. Expedita?
			</div>
			<div class="tab-pane text-body fade" id="v-pills-disabled" role="tabpanel" aria-labelledby="v-pills-disabled-tab" tabindex="0">
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse, assumenda asperiores! Omnis magni qui debitis laborum autem alias eius tenetur cupiditate, amet voluptas, nulla sequi quam inventore blanditiis repudiandae. Expedita?
			</div>
			<div class="tab-pane text-body fade" id="v-pills-messages" role="tabpanel" aria-labelledby="v-pills-messages-tab" tabindex="0">
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse, assumenda asperiores! Omnis magni qui debitis laborum autem alias eius tenetur cupiditate, amet voluptas, nulla sequi quam inventore blanditiis repudiandae. Expedita?
			</div>
			<div class="tab-pane text-body fade" id="v-pills-settings" role="tabpanel" aria-labelledby="v-pills-settings-tab" tabindex="0">
				Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse, assumenda asperiores! Omnis magni qui debitis laborum autem alias eius tenetur cupiditate, amet voluptas, nulla sequi quam inventore blanditiis repudiandae. Expedita?
			</div>
		</div>
	</div>