<!DOCTYPE html>
<html lang="en">
	<head>
		<!-- Meta -->
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1"> 
		<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
		<meta name="description" content="Penn - Education HTML Template">
		<meta name="keywords" content="theme_ocean, college, course, e-learning, education, high school, kids, learning, online, online courses, school, student, teacher, tutor, university">
		<meta name="author" content="theme_ocean">
		<!-- SITE TITLE -->
		<title>Penn - Education HTML Template</title>			
		<!-- Latest Bootstrap min CSS -->
		<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">		
		<!-- Google Font -->
		<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
		<!-- Font Awesome CSS -->
		<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
		<link rel="stylesheet" href="assets/fonts/themify-icons.css">
		<!--- owl carousel Css-->
		<link rel="stylesheet" href="assets/owlcarousel/css/owl.carousel.css">
		<link rel="stylesheet" href="assets/owlcarousel/css/owl.theme.css">				
		<!--slicknav Css-->
        <link rel="stylesheet" href="assets/css/slicknav.css">		
		<!-- MAGNIFIC CSS -->
		<link rel="stylesheet" href="assets/css/magnific-popup.css">	
		<!-- animate CSS -->
		<link rel="stylesheet" href="assets/css/animate.css">			
		<!-- Style CSS -->					
		<link rel="stylesheet" href="assets/css/style.css" />				
		<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
		  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
		  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
		<![endif]-->
</head>
<body>
	
	<!-- START PRELOADER -->
    <div id="loader-wrapper">
        <div id="loader"></div>
        <div class="loader-section section-left"></div>
        <div class="loader-section section-right"></div>
    </div>
	<!-- END PRELOADER -->

	<!-- START LOGO WITH CONTACT -->
	<section class="logo-contact">
		<div class="container">
			<div class="row">
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
					<div class="single-top-contact">
						<i class="fa fa-phone"></i>
						<h4>+880 1934 781924</h4>
					</div>
				</div><!--- END COL -->	
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
					<div class="single-top-contact">							
						<i class="fa fa-envelope"></i>
						<h4><a href="mailto:example@gmail.com">example@mail.com</a></h4>	
					</div>
				</div><!--- END COL -->	
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
					<div class="single-top-contact">
						<i class="fa fa-clock-o"></i>
						<h4>Mon to sat Open: 9am - 6pm</h4>
					</div>
				</div><!--- END COL -->	
				<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
					<div class="top_social_profile">
						<ul>
							<li><a href="#" class="top_f_facebook"><i class="fa fa-facebook" title="Facebook"></i></a></li>
							<li><a href="#" class="top_f_twitter"><i class="fa fa-twitter" title="Twitter"></i></a></li>
							<li><a href="#" class="top_f_instagram"><i class="fa fa-instagram" title="Instagram"></i></a></li>
							<li><a href="#" class="top_f_linkedin"><i class="fa fa-linkedin" title="LinkedIn"></i></a></li>
						</ul>
					</div>
				</div><!--- END COL -->						
			</div><!--- END ROW -->
		</div><!--- END CONTAINER -->
	</section>
	<!-- END LOGO WITH CONTACT -->
	
	<!-- START NAVBAR -->  
	<div id="navigation" class="navbar-light bg-faded site-navigation">
		<div class="container">
			<div class="row">
				<div class="col-lg-2 col-md-3 col-sm-4">
					<div class="site-logo">
						<a href="index.html"><img src="assets/images/all-img/logo.png" alt=""></a>          			        				
					</div>
				</div><!--- END Col -->
				
				<div class="col-lg-6 col-md-9 col-sm-8 ">
					<div class="header_right ">
						<nav id="main-menu" class="ms-auto">
							<ul>
							  <li><a class="nav-link" href="index.html">Home <span class="ti-angle-down"></span></a>
								<ul>
									<li><a class="nav-link" href="index.html">Home 01</a></li>
									<li><a class="nav-link" href="index_2.html">Home 02</a></li>
									<li><a class="nav-link" href="index_3.html">Home 03</a></li>
								</ul>
							   </li>
							    <li><a class="nav-link" href="#">Pages <span class="ti-angle-down"></span></a>
									<ul>
										<li><a class="nav-link" href="about.html">About Us</a></li>										
										<li><a class="nav-link" href="team.html">Instructor</a></li>
										<li><a class="nav-link" href="team-details.html">Instructor Details</a></li>
										<li><a class="nav-link" href="faq.html">FAQ's</a></li>
										<li><a class="nav-link" href="event.html">Event</a></li>
										<li><a class="nav-link" href="event_single.html">Event Single</a></li>
										<li><a class="nav-link" href="error.html">404 Page</a></li>										
										<li><a class="nav-link" href="login.html">Login</a></li>
										<li><a class="nav-link" href="register.html">Register</a></li>
									</ul>
								</li>
								<li><a class="nav-link" href="course.html">Courses <span class="ti-angle-down"></span></a>
									<ul>
										<li><a class="nav-link" href="course.html">Courses 01</a></li>
										<li><a class="nav-link" href="course2.html">Courses 02</a></li>
										<li><a class="nav-link" href="course3.html">Courses 03</a></li>
										<li><a class="nav-link" href="course-sidebar.html">Course Sidebar</a></li>
										<li><a class="nav-link" href="single_course.html">Course details</a></li>
									</ul>
								</li>
								<li><a class="nav-link" href="shop.html">Shop <span class="ti-angle-down"></span></a>
									<ul>
										<li><a class="nav-link" href="shop.html">Shop</a></li>
										<li><a class="nav-link" href="single_shop.html">Single Shop</a></li>
										<li><a class="nav-link" href="cart.html">Cart Page</a></li>
										<li><a class="nav-link" href="checkout.html">Checkout page</a></li>
									</ul>
								</li>
								<li><a class="nav-link" href="blog.html">Blog <span class="ti-angle-down"></span></a>
									<ul>
										<li><a class="nav-link" href="blog.html">Blog List</a></li>
										<li><a class="nav-link" href="blog_single.html">Single Blog</a></li>
									</ul>
								</li>
							    <li><a class="nav-link" href="contact.html">Contact</a></li>
							</ul>
						</nav>
						<div id="mobile_menu"></div>
					</div>
				</div><!--- END Col -->
				<div class="col-lg-4 col-md-3 col-sm-8">
					<div class="call_to_action">
						<a class="btn_one" href="contact.html">Contact Us</a>
						<a class="btn_two" href="register.html">My Account</a>
					</div><!--- END SOCIAL PROFILE -->					
				</div><!--- END Col -->
			</div><!--- END ROW -->
		</div><!--- END CONTAINER -->
	</div> 	  
	<!-- END NAVBAR -->
								
	