Indexpage

Hidden

Index

Indexpage1

Componets

Accordion

Use the below code to display Accordion.

											
												<!-- Accordion Structure -->
												<section id="home_faq_sec">
												<div class="container">
												<div class="home_faq_accodian_area">
												<div class="home_faq_accodian_item">
												<div class="home_faq_accodian_title active">
												...
												</div>
												<div class="home_faq_accodian_tab">
												...
												</div>
												</div>

												<div class="home_faq_accodian_item">
												<div class="home_faq_accodian_title">
												...
												</div>
												<div class="home_faq_accodian_tab">
												...
												</div>
												</div>

												</div>
												</div>
												</section>

											
										

Counter

Use the below code to display Counter.

											
												<!-- Counter Structure -->
												<section class="fw_counter_sec">
												<div class="container">
												<div class="counter_box">
												<div class="counter_img">
												...
												</div>  
												<div class="counter_info">
												...
												</div>  
												</div>  

												<div class="counter_box">
												<div class="counter_img">
												...
												</div>  
												<div class="counter_info">
												...
												</div>  
												</div>  
												</div>  
												</section>
																				
										

Breadcrumb

Use the below code to display Breadcrumb.

											
												<!-- Breadcrumb Structure -->
												<section class="page_hero_sec">
												<div class="container">
												...
												<div class="common_banner">
												<div class="page_hero_titles">
												<a href="index1.html">...</a>  > ...
												</div> 
												</div> 
												...
												</div>  
												</section>
											
										

Card

Use the below code to display Card.

											
											<!-- Card Structure -->
											<section class="pricing_plan_sec">
											<div class="container">
											...
											<div class="pricing_tabs_content">
											<div id="tabs1" class="pricing_content_tabs">
											<div class="pricing_plan_box">
											...
											</div>  
											</div>  

											<div id="tabs2" class="pricing_content_tabs">
											<div class="pricing_plan_box">
											...
											</div> 
											</div>  											 
											</div>  
											</div>  
											</section>  
											
										

Slider Structure

Sudan refer a simple slider structure.

											
												<!-- Slider Structure -->
												<section id="client_testimonials_sec">
												<div class="container">
												...
												<div class="client_testimonials_area">
												<div class="client_testimonials_list">
												<div class="client_testimonials_item">
												<div class="client_testimonials_box">
												...
												</div>
												</div>

												<div class="client_testimonials_item">
												<div class="client_testimonials_box">
												...
												</div>
												</div>												
												</div>
												</div>
												</div>
												...
												</section>  
											
										

Pagination Structure

Use the below code to display Pagination.

											
												<!-- Pagination Structure -->
												<div class="project_pagenation">                  
												<div class="container">                  
												<ul class="project_pagenation_list">                  
												<li class="project_pagenation_item active"><a href="javascript:void(0)">...</a></li>              
												<li class="project_pagenation_item"><a href="javascript:void(0)">...</a></li>              
												<li class="project_pagenation_item"><a href="javascript:void(0)">...</a></li>              
												<li class="project_pagenation_item"><a href="javascript:void(0)">...</a></li>              
												</ul>
												</div>
												</div>
											
										

Tabs

Use the below code to display Tabs.

											
												<!-- Tabs Structure -->
												<div class="our_services_slider">                  
												<ul class="our_services_slider_tabs">                  
												<li class="active">                  
												<a href="#tabs-1">                  
												...
												</a>
												</li>

												<li>                  
												<a href="#tabs-2">                  
												...
												</a>
												</li>

												<li>                  
												<a href="#tabs-3">                  
												...
												</a>
												</li>
												</ul>

												<div class="our_services_slider_content">
												<div id="tabs-1" class="our_services_slider_content_tab">
												<div class="our_services_slider_box">
												...
												</div>
												</div>

												<div id="tabs-2" class="our_services_slider_content_tab">
												<div class="our_services_slider_box">
												...
												</div>
												</div>

												<div id="tabs-3" class="our_services_slider_content_tab">
												<div class="our_services_slider_box">
												...
												</div>
												</div>
												</div>
												</div>
											
										
Tools

Modes

light

light

dark

dark

Sidebar

Backgrounds

default

Default

bg-1

Bg-1

bg-2

Bg-2

bg-3

Bg-3

bg-4

Bg-4

bg-5

Bg-5

Box Design

default

Default

box-1

Box-1

box-2

Box-2

box-3

Box-3