Chat List

Show All

  • A
  • B
  • D
  • J
  • O
Chat with Khelesh

Online

Hi, how are you samim? 8:40 AM, Today
Hi Khalid i am good tnx how about you? 8:55 AM, Today
I am good too, thank you for your chat template 9:00 AM, Today
You are welcome 9:05 AM, Today
I am looking for your next templates 9:07 AM, Today
Ok, thank you have a good day 9:10 AM, Today
Bye, see you 9:12 AM, Today
Hi, how are you samim? 8:40 AM, Today
Hi Khalid i am good tnx how about you? 8:55 AM, Today
I am good too, thank you for your chat template 9:00 AM, Today
You are welcome 9:05 AM, Today
I am looking for your next templates 9:07 AM, Today
Ok, thank you have a good day 9:10 AM, Today
Bye, see you 9:12 AM, Today
Notications

Show All

  • SEVER STATUS
  • KK
  • SOCIAL
  • RU
  • SEVER STATUS
  • AU
  • MO
Notes

Add New Nots

Default Accordion

Default accordion. Add accordion class in root

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

			<div class="accordion accordion-primary" id="accordion-one">
			  <div class="accordion-item">
				<h2 class="accordion-header">
				  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#default-collapseOne" aria-expanded="true" aria-controls="default-collapseOne">
					Accordion Header One
				  </button>
				</h2>
				<div id="default-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-one">
				  <div class="accordion-body">
					Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
				  </div>
				</div>
			  </div>
			  <div class="accordion-item">
				<h2 class="accordion-header">
				  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#default-collapseTwo" aria-expanded="false" aria-controls="default-collapseTwo">
					Accordion Header Two
				  </button>
				</h2>
				<div id="default-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-one">
				  <div class="accordion-body">
					 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
				  </div>
				</div>
			  </div>
			  <div class="accordion-item">
				<h2 class="accordion-header">
				  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#default-collapseThree" aria-expanded="false" aria-controls="#default-collapseThree">
					Accordion Header Three
				  </button>
				</h2>
				<div id="default-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-one">
				  <div class="accordion-body">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					
				  </div>
				</div>
			  </div>
			</div>

Accordion bordered

Accordion with border. Add class accordion-bordered with the class accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

			<div class="accordion accordion-danger-solid" id="accordion-two">
				<div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#bordered_collapseOne">
						Accordion Header One
					  </button>
					</h2>
					<div id="bordered_collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-two">
					  <div class="accordion-body">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div>
					</div>
				</div>
				<div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#bordered_collapseTwo">
						Accordion Header Two
					  </button>
					</h2>
					<div id="bordered_collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-two">
					  <div class="accordion-body">
						 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div>
					</div>
				</div>
				<div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#bordered_collapseThree">
						Accordion Header Three
					  </button>
					</h2>
					<div id="bordered_collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-two">
					  <div class="accordion-body">
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						
					  </div>
					</div>
				</div>
			</div>
		  

Accordion without space

Add accordion-no-gutter class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

				<div class="accordion accordion-no-gutter accordion-header-bg" id="accordion-three">
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#no-gutter-collapseOne">
						Accordion Header One
					  </button>
					</h2>
					<div id="no-gutter-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-three">
					  <div class="accordion-body">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div>
					</div>
				  </div>
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#no-gutter-collapseTwo">
						Accordion Header Two
					  </button>
					</h2>
					<div id="no-gutter-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-three">
					  <div class="accordion-body">
						 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div>
					</div>
				  </div>
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#no-gutter-collapseThree">
						Accordion Header Three
					  </button>
					</h2>
					<div id="no-gutter-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-three">
					  <div class="accordion-body">
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						
					  </div>
					</div>
				  </div>
				</div>
			

Accordion without space with border

Add accordion-no-gutter accordion-bordered class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

				<div class="accordion accordion-no-gutter accordion-bordered" id="accordion-four">
					<div class="accordion-item">
						<h2 class="accordion-header">
						<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#bordered-no-gutter-collapseOne">
						Accordion Header One
						</button>
						</h2>
						<div id="bordered-no-gutter-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-four">
						  <div class="accordion-body">
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						  </div>
						</div>
					</div>
					<div class="accordion-item">
						<h2 class="accordion-header">
						  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#bordered-no-gutter-collapseTwo">
							Accordion Header Two
						  </button>
						</h2>
						<div id="bordered-no-gutter-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-four">
						  <div class="accordion-body">
							 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						  </div>
						</div>
					</div>
					<div class="accordion-item">
						<h2 class="accordion-header">
						  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#bordered-no-gutter-collapseThree">
							Accordion Header Three
						  </button>
						</h2>
						<div id="bordered-no-gutter-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-four">
						  <div class="accordion-body">
								Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
							
						  </div>
						</div>
					</div>
				</div>
			

Accordion indicator in left position

Add accordion-start-indicator class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

			<div class="accordion accordion-left-indicator" id="accordion-five">
				<div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#left-indicator-collapseOne">
						
						<span class="accordion-header-indicator"></span>
						<span class="accordion-header-text">Accordion Header One</span<
					  </button>
					</h2<
					<div id="left-indicator-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-five"<
					  <div class="accordion-body"<
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div<
					</div<
				</div>
				<div class="accordion-item"<
					<h2 class="accordion-header"<
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#left-indicator-collapseTwo"<
						Accordion Header Two
					  </button<
					</h2<
					<div id="left-indicator-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-five"<
					  <div class="accordion-body"<
						 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div<
					</div<
				</div<
				<div class="accordion-item"<
					<h2 class="accordion-header"<
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#left-indicator-collapseThree"<
						Accordion Header Three
					  </button<
					</h2<
					<div id="left-indicator-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-five"<
					  <div class="accordion-body"<
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						
					  </div<
					</div<
				</div<
			</div<
			
											

Accordion with icon

Add accordion-with-icon class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
	<div class="accordion accordion-with-icon" id="accordion-six">
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#with-icon-collapseOne">
					   <span class="accordion-header-icon"></span>
						<span class="accordion-header-text">Accordion Header One</span>
						<span class="accordion-header-indicator indicator-bordered"></span>
					  </button>
					</h2>
					<div id="with-icon-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-six">
					  <div class="accordion-body">
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						
					  </div>
					</div>
				  </div>
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#with-icon-collapseTwo">
						 <span class="accordion-header-icon"></span>
						<span class="accordion-header-text">Accordion Header One</span>
						<span class="accordion-header-indicator indicator-bordered"></span>
					  </button>
					</h2>
					<div id="with-icon-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-six">
					  <div class="accordion-body">
						 Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					  </div>
					</div>
				  </div>
				  <div class="accordion-item">
					<h2 class="accordion-header">
					  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#with-icon-collapseThree">
					   <span class="accordion-header-icon"></span>
						<span class="accordion-header-text">Accordion Header Three</span>
						<span class="accordion-header-indicator indicator-bordered"></span>
					  </button>
					</h2>
					<div id="with-icon-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-six">
					  <div class="accordion-body">
							Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
						
					  </div>
					</div>
				  </div>
				</div>

Accordion header background

Add accordion-header-bg class with accrodion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
<div class="accordion accordion-header-bg accordion-bordered" id="accordion-seven">
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-primary">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-bg-collapseOne">
												   <span class="accordion-header-icon"></span>
													<span class="accordion-header-text">Accordion Header One</span>
													<span class="accordion-header-indicator indicator-bordered"></span>
												  </button>
												</h2>
												<div id="header-bg-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-seven">
												  <div class="accordion-body">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-info">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-bg-collapseTwo">
												   <span class="accordion-header-icon"></span>
													<span class="accordion-header-text">Accordion Header Two</span>
													<span class="accordion-header-indicator indicator-bordered"></span>
												  </button>
												</h2>
												<div id="header-bg-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-seven">
												  <div class="accordion-body">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-primary">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-bg-collapseThree">
												   <span class="accordion-header-icon"></span>
													<span class="accordion-header-text">Accordion Header Three</span>
													<span class="accordion-header-indicator indicator-bordered"></span>
												  </button>
												</h2>
												<div id="header-bg-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-seven">
												  <div class="accordion-body">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
										</div>

Accordion solid background

Add class accordion-solid-bg with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
<div class="accordion accordion-solid-bg" id="accordion-eight">
			<div class="accordion-item">
				<h2 class="accordion-header accordion-header-primary">
				  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#solid-bg-collapseOne">
				   <span class="accordion-header-icon"></span>
					<span class="accordion-header-text">Accordion Header One</span>
					<span class="accordion-header-indicator indicator-bordered"></span>
				  </button>
				</h2>
				<div id="solid-bg-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-eight">
				  <div class="accordion-body rounded-0">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					
				  </div>
				</div>
			</div>
			<div class="accordion-item">
				<h2 class="accordion-header accordion-header-primary">
				  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#solid-bg-collapseTwo">
				   <span class="accordion-header-icon"></span>
					<span class="accordion-header-text">Accordion Header two</span>
					<span class="accordion-header-indicator indicator-bordered"></span>
				  </button>
				</h2>
				<div id="solid-bg-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-eight">
				  <div class="accordion-body rounded-0">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					
				  </div>
				</div>
			</div>
			<div class="accordion-item">
				<h2 class="accordion-header accordion-header-primary">
				  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#solid-bg-collapseThree">
				   <span class="accordion-header-icon"></span>
					<span class="accordion-header-text">Accordion Header One</span>
					<span class="accordion-header-indicator indicator-bordered"></span>
				  </button>
				</h2>
				<div id="solid-bg-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-eight">
				  <div class="accordion-body rounded-0">
						Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
					
				  </div>
				</div>
			</div>
		</div>

Accordion active background

Add class accordion-active-header with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

													<div class="accordion accordion-active-header" id="accordion-nine">
														<div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#active-header-collapseOne">
															   <span class="accordion-header-icon"></span>
																<span class="accordion-header-text">Accordion Header One</span>
																<span class="accordion-header-indicator indicator-bordered"></span>
															  </button>
															</h2>
															<div id="active-header-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-nine">
															  <div class="accordion-body rounded-0">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														  </div>
														  <div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#active-header-collapseTwo">
															   <span class="accordion-header-icon"></span>
																<span class="accordion-header-text">Accordion Header Two</span>
																<span class="accordion-header-indicator indicator-bordered"></span>
															  </button>
															</h2>
															<div id="active-header-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-nine">
															  <div class="accordion-body rounded-0">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														  </div>
														  <div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#active-header-collapseThree">
															   <span class="accordion-header-icon"></span>
																<span class="accordion-header-text">Accordion Header Three</span>
																<span class="accordion-header-indicator indicator-bordered"></span>
															  </button>
															</h2>
															<div id="active-header-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-nine">
															  <div class="accordion-body rounded-0">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														</div>
													</div>
												

Accordion header shadow

Add accordion-header-shadow and accordion-rounded class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
<div class="accordion accordion-header-shadow accordion-rounded" id="accordion-ten">
														<div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-shadow-collapseOne">
															   
																<span class="accordion-header-text">Accordion Header One</span>
																
															  </button>
															</h2>
															<div id="header-shadow-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-ten">
															  <div class="accordion-body">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														</div>
														<div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-shadow-collapseTwo">
															  
																<span class="accordion-header-text">Accordion Header Two</span>
																
															  </button>
															</h2>
															<div id="header-shadow-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-ten">
															  <div class="accordion-body">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														</div> 
														<div class="accordion-item">
															<h2 class="accordion-header accordion-header-primary">
															  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#header-shadow-collapseThree">
															 
																<span class="accordion-header-text">Accordion Header Three</span>
																
															  </button>
															</h2>
															<div id="header-shadow-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-ten">
															  <div class="accordion-body">
																	Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
																
															  </div>
															</div>
														</div>
													</div>
												

Accordion rounded stylish

Add accordion-rounded-stylish class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
<div class="accordion accordion-rounded-stylish accordion-bordered" id="accordion-eleven">
													<div class="accordion-item">
														<h2 class="accordion-header accordion-header-primary">
														  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#rounded-stylish-collapseOne">
														   
															<span class="accordion-header-text">Accordion Header One</span>
															
														  </button>
														</h2>
														<div id="rounded-stylish-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-eleven">
														  <div class="accordion-body rounded-0">
																Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
															
														  </div>
														</div>
													</div>
													<div class="accordion-item">
														<h2 class="accordion-header accordion-header-primary">
														  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#rounded-stylish-collapseTwo">
														   
															<span class="accordion-header-text">Accordion Header Two</span>
															
														  </button>
														</h2>
														<div id="rounded-stylish-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-eleven">
														  <div class="accordion-body rounded-0">
																Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
															
														  </div>
														</div>
													</div>
													<div class="accordion-item">
														<h2 class="accordion-header accordion-header-primary">
														  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#rounded-stylish-collapseThree">
														   
															<span class="accordion-header-text">Accordion Header Three</span>
															
														  </button>
														</h2>
														<div id="rounded-stylish-collapseThree" class="accordion-collapse collapse show" data-bs-parent="#accordion-eleven">
														  <div class="accordion-body rounded-0">
																Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
															
														  </div>
														</div>
													</div>
												</div>
											

Accordion gradient

Add accordion-gradient class with accordion

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
<div class="accordion accordion-rounded-stylish accordion-gradient" id="accordion-twelve">
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-primary">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#gradient-collapseOne">
												   
													<span class="accordion-header-text">Accordion Header One</span>
													
												  </button>
												</h2>
												<div id="gradient-collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordion-twelve">
												  <div class="accordion-body rounded-0">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-primary">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#gradient-collapseTwo">
												   
													<span class="accordion-header-text">Accordion Header Two</span>
													
												  </button>
												</h2>
												<div id="gradient-collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordion-twelve">
												  <div class="accordion-body rounded-0">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
											<div class="accordion-item">
												<h2 class="accordion-header accordion-header-primary">
												  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#gradient-collapseThree">
												   
													<span class="accordion-header-text">Accordion Header Three</span>
													
												  </button>
												</h2>
												<div id="gradient-collapseThree" class="accordion-collapse collapse" data-bs-parent="#accordion-twelve">
												  <div class="accordion-body rounded-0">
														Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
													
												  </div>
												</div>
											</div>
										</div>