HOME

Mini Shell 1.0
DIR:/home/htlwork.com/www/dev/navvibhor-new/final/
Current File : //home/htlwork.com/www/dev/navvibhor-new/final/profile.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Nav Vibhor</title>
    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
	<link href="css/swiper.min.css" rel="stylesheet" type="text/css">
	<link rel="stylesheet" href="dist/aos.css" />

    <!-- Custom CSS -->
    <link href="style.css" rel="stylesheet">
	
	<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
	
	<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
	
	<link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/owl.theme.default.min.css">
	
    <!-- Custom Fonts -->
	<link href="font-awesome/css/all.min.css" rel="stylesheet" type="text/css">
    <script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	
	<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css" rel="stylesheet" media="all"> 
   
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.6/isotope.pkgd.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.js"></script>		
   
    <!--If you want to change #bootstrap-touch-slider id then you have to change Carousel-indicators and Carousel-Control  #bootstrap-touch-slider slide as well
        Slide effect: slide, fade
        Text Align: slide_style_center, slide_style_left, slide_style_right
        Add Text Animation: https://daneden.github.io/animate.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/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->    
	
<script>
$(window).scroll(function() {
    if ($(this).scrollTop() > 20){  
        $('.header').addClass("sticky");
    }
    else{
        $('.header').removeClass("sticky");
    }
});

$(window).scroll(function() {
    if ($(this).scrollTop() > 20){  
        $('.back-to-top').addClass("scroll");
    }
    else{
        $('.back-to-top').removeClass("scroll");
    }
});
</script>

</head>
<body data-aos-easing="ease-out-back" data-aos-duration="1000" data-aos-delay="0">
<header class="header"> 
  <section class="head-top">   
    <div class="container">
      <div class="row">
      
	    <div class="col-sm-7 head-left">
		  <ul>
            <li><a href="tel:+91 8278794401"><i class="fa-solid fa-phone"></i> <small class="hidden">Call Us</small><span>Call: +91 8278794401</span></a></li>
            <li><a href="mailto:navvibhorschool@gmail.com"><i class="fa-solid fa-envelope"></i> <small class="hidden">Email Us</small><span>Email: navvibhorschool@gmail.com</span></a></li>
          </ul>
        </div>
	  
	    <div class="col-sm-5 head-right">
		  <div class="icon-top">
		    <a href="#" target="_blank"><i class="fa-brands fa-facebook-f facebook"></i></a>
		    <a href="#" target="_blank"><i class="fa-brands fa-youtube youtube"></i></a>
		  </div>	
		  
		  <div class="book-now">
		    <a href="#" class="btn">Admission Enquiry <i class="fa fa-long-arrow-right" aria-hidden="true"></i> <span class="s1"></span><span class="s2"></span><span class="s3"></span><span class="s4"></span></a>
          </div>
        </div>	
                
      </div><!--/ row -->
    </div>
  </section>
  
  <section class="head-center">   
    <div class="container">
      <div class="row align-items-center">
      
	    <div class="col-sm-7 logo">
		  <a href="#"><img src="images/logo.png" al="image"><h1>Nav Vibhor Public Sen. Sec. School <small>Sulgwan, Teh. Bhoranj Distt. Hamirpur (H.P.)<small><b>School Code 1716</b><b>Affiliation No. 14027</b></small></small></h1></a>
        </div>
	  
	    <div class="col-sm-5 right-grid">
		  <div class="phn-detail">
		    <ul>
			  <li><a href="#"><i class="fa-solid fa-clock"></i><span>8:00AM - 5:00PM</span><small>Our Opening Hours Mon - Sat</small></a></li>
			  <li><a href="tel:+91 01972-263021"><i class="fa-solid fa-phone-volume"></i><span>01972-263021</span><small>Call Us For Free Consultation</small></a></li>			
            </ul>
		  </div>
        </div>	
                
      </div><!--/ row -->
    </div>
  </section>
  
  <nav>
    <div class="container">
      <div class="navbar">
        
		<i class='fa fa-navicon bx bx-menu'></i>
	    <!--div class="logo"><a href="index.html"><img src="images/logo.png" al="image"></a></div-->
		
        <div class="nav-links">
	    
		  <div class="sidebar-logo">
		    <span class="logo-name"><img src="images/logo.png" al="image"> <span>Nav Vibhor Public Sen. Sec. School <small>Sulgwan, Teh. Bhoranj Distt. Hamirpur (H.P.)<small><b>School Code 1716</b><b>Affiliation No. 14027</b></small></small></span></span>
            <i class="fa fa-close fa-xmark bx bx-x"></i>
		  </div>
		  
		  <ul class="links">			
            <li class="current-menu-item"><a href="index.html">Home</a></li>		
			
			<li class="main-menu">
              <a href="#">Overview</a>
		      <i class="fa fa-angle-down htmlcss-arrow arrow" aria-hidden="true"></i>
              <ul class="htmlCss-sub-menu sub-menu">
                <li><a href="profile.html">Profile</a></li>
				<li><a href="#">Messages</a></li>
				<li><a href="#">Core Values</a></li>
				<li><a href="#">Scholarships</a></li>
				<li><a href="#">Administrations</a></li>
              </ul>
            </li>		
			
			<li class="main-menu">
              <a href="#">Admissions</a>
		      <i class="fa fa-angle-down htmlcss-arrow arrow" aria-hidden="true"></i>
              <ul class="htmlCss-sub-menu sub-menu">
                <li><a href="#">Classes</a></li>
				<li><a href="#">Admission Form</a></li>
				<li><a href="#">Admission Procedure</a></li>
				<li><a href="#">Syllabus</a></li>
				<li><a href="#">Uniform</a></li>
              </ul>
            </li>
			
			<li class="main-menu">
              <a href="#">Infrastructure</a>
		      <i class="fa fa-angle-down htmlcss-arrow arrow" aria-hidden="true"></i>
              <ul class="htmlCss-sub-menu sub-menu">
                <li><a href="#">Play Ground</a></li>
				<li><a href="#">Hostel</a></li>
				<li><a href="#">Transportation</a></li>
				<li><a href="#">Labs</a></li>
				<li><a href="#">Library</a></li>
				<li><a href="#">Smart Classrooms</a></li>
              </ul>
            </li>
			
			<li><a href="#">Results</a></li>
			<li><a href="gallery.html">Gallery</a></li>
			<li><a href="#">Alumni</a></li>
			
			<li class="main-menu">
              <a href="#">Apply Online</a>
		      <i class="fa fa-angle-down htmlcss-arrow arrow" aria-hidden="true"></i>
              <ul class="htmlCss-sub-menu sub-menu">
                <li><a href="registration.html">Registration/Admission</a></li>
				<li><a href="#">SLC / Character / Birth Certificate</a></li>
				<li><a href="#">Job</a></li>
              </ul>
            </li>
			
			<li><a href="contact-us.html">Contact Us</a></li>
          </ul>
		  
		  <div class="phn-detail hidden">
		    <ul>
			  <li><a href="#"><i class="fa-solid fa-clock"></i><span>8:00AM - 5:00PM</span><small>Our Opening Hours Mon - Sat</small></a></li>
			  <li><a href="tel:+91 01792-266174"><i class="fa-solid fa-phone-volume"></i><span>01792-266174</span><small>Call Us For Free Consultation</small></a></li>			
            </ul>
		  </div>
		</div><!--/ nav-links -->
		
      </div>
    </div><!--/ container -->
	
  </nav><!--/ nav -->
</header>

<section class="banner-inner" id="Home">
  <div class="container">
    <div class="textblock">
      <div class="block">
        <div class="inner">

          <div class="page-title">
            <div class="holder"><h1>Profile</h1></div>
          </div><!--/ page-title -->

          <!-- breadcrumb -->
          <ol class="breadcrumb text-capitalize">
            <li><a href="index.html"><span class="fa fa-home"></span> Home</a></li>
			<li>Profile</li>
          </ol>        
      
        </div><!--/ inner -->
      </div><!--/ block -->
    </div>
  </div>
</section><!--/ banner-inner -->

<section class="mid-inner">
  <div class="container">    
    <div class="row">
      
      <div class="col-sm-8 left-sidebar">
	    <h2>Welcome to Nav Vibhor Public School</h2>       
		<p><strong>Attitude:</strong> Attitudes are the root cause for any behavior. The development process typically brings by developing positive attitudes among students, about themselves, and about the possibilities that exist for them.</p>
		<p>Attitudes will directly determine in many cases whether a student turns a problem into an opportunity or succumbs to it.</p>
		<p><strong>Performance:</strong> The differences between the performance of a novice and an expert are quite striking. The performance of a novice is slow, error prone and awkward, whereas the performance of the expert is fast, virtually errorless, and extremely smooth and fluid. This difference exists because the expert has over the course of many years of study and practice developed extensive knowledge. It is this knowledge that underlies their skilled performance.</p>
		<figure class="thumbnail"><img src="images/slider-02.jpg" alt="image"></figure>
	  </div><!--/ left-sidebar -->
	  
	  <div class="col-sm-4 right-sidebar">
		<div class="widget">
		  <div class="notice-board">
	        <h3>Announcements</h3>
		    <div class="news-box">
			  <marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3" height="240px;">
			    <ul>
				  <li><img src="images/tnew.gif"> <a href="#"><span>100% result in HP Board Exams</span></a></li>
				  <li><img src="images/tnew.gif"> <a href="#"><span>10+National Project Report Participation</span></a></li>
				  <li><img src="images/tnew.gif"> <a href="#"><span>25+State Level Science Quiz wins</span></a></li>
				  <li><img src="images/tnew.gif"> <a href="#"><span>100+Trained faculty</span></a></li>
				  <li><img src="images/tnew.gif"> <a href="#"><span>100+Modern classrooms</span></a></li>
				</ul>
			  </marquee>
	        </div><!--/ -->
	      </div>
	    </div><!--/ widget -->
		
		<div class="widget">
		  <div class="notice-board">
	        <h3>Activities</h3>
		    <div class="news-box">
			  <marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3" height="240px;">
			    <ul>
				  <li><a href="#"><span>Annual Function</span></a></li>
				  <li><a href="#"><span>Dance Competition</span></a></li>
				  <li><a href="#"><span>Chess Competition</span></a></li>
				  <li><a href="#"><span>Computer Test</span></a></li>
				  <li><a href="#"><span>Science Competition</span></a></li>
				</ul>
			  </marquee>
	        </div><!--/ -->
	      </div>
		</div><!--/ widget -->
	  </div><!--/ right-sidebar -->
      
    </div>
  </div>
</section><!--/ mid-wrap -->
  
<footer class="footer">  
  <div class="back-to-top scroll"><a href="#Home" class="BackTo"><i class="fa fa-angle-up" aria-hidden="true"></i></a></div>
  <script>
$(document).ready(function(){
 let scroll_link = $('.BackTo');

  //smooth scrolling -----------------------
  scroll_link.click(function(e){
      e.preventDefault();
      let url = $('body').find($(this).attr('href')).offset().top;
      $('html, body').animate({
        scrollTop : url
      },700);
      $(this).parent().addClass('active');
      $(this).parent().siblings().removeClass('active');
      return false;	
   });
});
</script>
  
  <div class="container">
    <div class="row">
	  
	  <div class="col-sm-3 footer-left">
		<div class="wg-1">
		  <div class="ft-logo mrb-b30">
		    <figure><a href="#" class="logo-img"><img src="images/ft-logo.png" alt=""></a></figure>
		  </div>
			<p class="mrb-30">The development process typically brings by developing positive attitudes among students, about themselves, and about the possibilities that exist for them.</p>
			<div class="icon-ft">
			  <a href="#" target="_blank"><i class="fa-brands fa-facebook-f"></i></a>
		      <a href="#" target="_blank"><i class="fa-brands fa-youtube"></i></a>
			</div>
	    </div><!--/ wg-1 -->
	  </div><!--/ col-sm --> 

	  <div class="col-sm-9 footer-right">
	    <div class="row">
		  
		  <div class="col-sm-4">
		    <div class="wg-1">
			  <h4>Quick Links</h4>
			  <ul>
				<li><a href="#">Home</a></li>
				<li><a href="#">About Us</a></li>
				<li><a href="#">Admissions</a></li>
				<li><a href="#">Infrastructure</a></li>
				<li><a href="#">Results</a></li>
				<li><a href="#">Gallery</a></li>
				<li><a href="#">Alumni</a></li>
				<li><a href="#">Contact Us</a></li>
			  </ul>
			</div><!--/ wg-1 -->
		  </div>
	      
		  <div class="col-sm-4">
		    <div class="wg-1">
			  <h4>Make Contact</h4>
			  <address>
			    <h5>General Quries</h5>
			    <p><b>Phone : </b><a href="tel:+91 8278794401">+91 8278794401</a>, <a href="tel:01972-263021">01972-263021</a></p>
				<p><b>Email : </b><a href="mailto:navvibhorschool@gmail.com">navvibhorschool@gmail.com</a></p>
			  </address>
			  
			  <!--address>
			    <h5>City Office</h5>
			    <p>Near railway Booking Counter and Taxi Stand, Main National Highway (NH) Bilaspur (H.P.) </p>
			  </address-->
			  
			  <address>
			    <h5>Our Location</h5>
			    <p>Nav-Vibhor Public Sen. Sec. School Sulgwan, Teh. Bhoranj Distt. Hamirpur Himachal Pradesh. Pin – 176044</p>
			  </address>
			</div><!--/ wg-1 -->
		  </div>
		  
		  <div class="col-sm-4">
		    <div class="wg-1">
			  <h4>Open Time</h4>		          	  		
			  <p><strong>Opening Day:</strong><br> Monday - Friday: 8am to 6pm<br> Saturday: 9am to 5pm</p>
			  <p><strong>Vacation:</strong><br> All Sunday Day<br> All Vacation Holiday</p>
			</div><!--/ wg-1 -->
		  </div>
		  
	    </div><!--/ row --> 
	  </div><!--/ footer-right --> 
	  
    </div><!-- row -->            
  </div><!--/ container -->           
  
  <div class="ft-bottom">
    <div class="container">
      <div class="row align-items-center">
		
		<div class="col-sm-8"><p>Copyright © 2025 Nav Vibhor Public School. All Rights Reserved.</p></div>	
		
		<div class="col-sm-4">
		  <div class="design-by text-end"><p>Design by: <a href="http://htlogics.com/" target="_blank">H T Logics PVT. LTD</a></p></div>
		</div>	
        
      </div><!--/ row -->
    </div>
  </div><!--/ ft-bottom -->
  
</footer>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/owl.carousel.min.js"></script>	
<script src="dist/aos.js"></script>	

<script>
var a = 0;
$(window).scroll(function() {

  var oTop = $('#counter').offset().top - window.innerHeight;
  if (a == 0 && $(window).scrollTop() > oTop) {
    $('.counter-value').each(function() {
      var $this = $(this),
        countTo = $this.attr('data-count');
      $({
        countNum: $this.text()
      }).animate({
          countNum: countTo
        },

        {

          duration: 7000,
          easing: 'swing',
          step: function() {
            $this.text(Math.floor(this.countNum));
          },
          complete: function() {
            $this.text(this.countNum);
            //alert('finished');
          }

        });
    });
    a = 1;
  }

});
</script>

<script>
function openCity(evt, cityName) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
  }
  document.getElementById(cityName).style.display = "block";
  evt.currentTarget.className += " active";
}
</script>

<script>
  // search-box open close js code
let navbar = document.querySelector(".navbar");
//let searchBox = document.querySelector(".search-box .bx-search");
// let searchBoxCancel = document.querySelector(".search-box .bx-x");

//searchBox.addEventListener("click", ()=>{
  <!-- navbar.classList.toggle("showInput"); -->
  <!-- if(navbar.classList.contains("showInput")){ -->
    <!-- searchBox.classList.replace("bx-search" ,"bx-x"); -->
  <!-- }else{-->
    <!-- searchBox.classList.replace("bx-x" ,"bx-search"); -->
  <!-- } -->
<!-- }); -->

// sidebar open close js code
let navLinks = document.querySelector(".nav-links");
let menuOpenBtn = document.querySelector(".navbar .bx-menu");
let menuCloseBtn = document.querySelector(".nav-links .bx-x");
menuOpenBtn.onclick = function() {
navLinks.style.left = "0";
}
menuCloseBtn.onclick = function() {
navLinks.style.left = "-100%";
}


// sidebar submenu open close js code
$(".htmlcss-arrow").click(function(){
 $(".htmlCss-sub-menu" ).removeClass("hidden");
 $(this).siblings( ".htmlCss-sub-menu" ).toggle("hidden");
});
$(".more-arrow").click(function(){
  $(".more-sub-menu" ).removeClass("hidden");
 $(this).siblings( ".more-sub-menu" ).toggle("hidden");
});

</script>

<script>        
// Wrap the counter animation in a function
function startCounterAnimation(target) {
    $(target).prop('Counter', 0).animate({
        Counter: $(target).text()
    }, {
        duration: 4000,
        easing: 'swing',
        step: function (now) {
            $(target).text(Math.ceil(now));
        }
    });
}

// Use Intersection Observer to detect when the element is in the viewport
const observer = new IntersectionObserver(entries => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            // Start the counter animation when the element is in the viewport
            startCounterAnimation(entry.target);
            // Unobserve the target element to avoid starting the animation multiple times
            observer.unobserve(entry.target);
        }
    });
},{threshold: 0.5 }); // Adjust the threshold as needed

// Observe each element with the 'counter' class
$('.counter').each(function () {
    // Add each element to the Intersection Observer
    observer.observe(this);
});
 
</script>

<script>
$('#owl-demo-1').owlCarousel({
    loop:true,
	autoplay:false,
    autoplayHoverPause:true,
	autoplayTimeout:3000,
    margin:0,
    nav:true,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:4
        }
    }
}) 

$('#owl-demo-2').owlCarousel({
    loop:true,
	autoplay:false,
    autoplayHoverPause:true,
	autoplayTimeout:3000,
    margin:0,
    nav:true,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:3
        }
    }
}) 

$('#owl-demo-3').owlCarousel({
    loop:true,
	autoplay:false,
    autoplayHoverPause:true,
	autoplayTimeout:3000,
    margin:0,
    nav:true,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:3
        }
    }
}) 

</script>  
</body>
<script>
  AOS.init();
</script>
</html>