1#@!#!123s

��JFIF�� 1#@!#!123s
: / home4 / mcspunei / www / chitpavan.in /
Filename : newarch.php
back
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Maharashtra Chitpavan Sangh</title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="" name="keywords">
    <meta content="" name="description">

    <!-- Favicon -->
    <link href="img/favicon.ico" rel="icon">

    <!-- Google Web Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Roboto:wght@500;700&display=swap" rel="stylesheet">

    <!-- Icon Font Stylesheet -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet">

    <!-- Libraries Stylesheet -->
    <link href="lib/animate/animate.min.css" rel="stylesheet">
    <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
    <link href="lib/tempusdominus/css/tempusdominus-bootstrap-4.min.css" rel="stylesheet" />

    <!-- Customized Bootstrap Stylesheet -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- Template Stylesheet -->
    <link href="css/style.css" rel="stylesheet">
    <style>
     
        /* .col-2:hover{
            border: 1px solid #2e026f;
           
        
        } */
        
        
        .main{
            width: 75%;
            height: fit-content;
        }
        
        .mai1{
            width: 75%;
            /* height: fit-content; */
        }
        .sidebar{
            width: 25%;
        }
        
        .sidebar .content-wrapper{
            margin-top: -195px;
                   margin-bottom: 0px;
                   padding: 60px 0px 55px 0px;
        }
        
        .side{
            width: 25%;
        }
        
        #more {display: none;}
        
        .hide {
          display: none;
        }
            
        .myDIV:hover + .hide {
          display: block;
          color: red;
        }
        
        
        
        /* Parent Container */
        .column{
            position: relative;
            width: 450px;
            height: 200px;
            float: left;
            margin-right: 0px;
        }
        
        
        .img-thumbnail{
            height:450px;
            border: 1px solid grey;
        }
        
        
        /* Child Text Container */
        .column div{
            position: absolute;
            bottom: 0;
            right: 0;
            background: black;
            color: white;
            margin-bottom: 30px;
            font-family: sans-serif;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: visibility 0s, opacity 0.5s linear; 
            transition: visibility 0s, opacity 0.5s linear;
        }
        
        /* Hover on Parent Container */
        .column:hover{
            cursor: pointer;
            background: black;
        }
        
        .column:hover div{
            width: 440px;
            padding: 85px 85px;
            visibility: visible;
            opacity: 0.7; 
        }
        .col-lg-6 .dip{
            padding-top:150px;
        }
        
        @media (max-width: 768px) {
            .main{
            width: 65%;
            height: fit-content;
        }
        
        .mai1{
            width: 65%;
            /* height: fit-content; */
        }
        .sidebar{
            width: 35%;
            justify-content: center;
           
        }
        
        .sidebar .content-wrapper{
            width: 100%;
            justify-content: center;
            /* margin-top: 20px;
            margin-left: 45px; */
            margin-bottom: 0px;
            /* padding: 60px 0px 55px 0px; */
        }
        
        
          
        
        .side{
            width: 35%;
            justify-content: center;
        }
          /* .side .content-wrapper{
            margin-top: 20px;
            margin-left: 45px;
          }   */
            
            .card{
                width: 200px;
            }
        
            .col-lg-6 .dip{
            padding-top:60px;
        }
        
        .col-lg-6 .dip p{
            margin-bottom: 0px;
        }
            
            .column{
               margin-left: 25px;
                width: 85%;
                padding: 50px;
                height: 500px;
                margin-top: 10px;
                }
        
                .column div{
            position: absolute;
            bottom: 0;
            right: 0;
            background: black;
            color: white;
            margin-bottom: 0px;
            font-family: sans-serif;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: visibility 0s, opacity 0.5s linear; 
            transition: visibility 0s, opacity 0.5s linear;
        }
        
                .column:hover div{
            width: 280px;
            padding: 55px 55px;
            visibility: visible;
            opacity: 0.7; 
        }
        
        h3,.h3 {
            /* margin-top: 100px; */
            margin-bottom: .5rem;
            font-family: "Roboto",sans-serif;
            font-weight: 700;
            line-height: 1.2;
            font-size: 16px;
            text-align: center;
            color: #17224D
        }
        
        
        
            }
        
        
            @media (max-width: 360px) {
            .column{
               margin-left: 25px;
                width: 85%;
                padding: 50px;
                height: 500px;
                margin-top: 10px;
                }
        
                .column div{
            position: absolute;
            bottom: 0;
            right: 0;
            background: black;
            color: white;
            margin-bottom: 0px;
            font-family: sans-serif;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: visibility 0s, opacity 0.5s linear; 
            transition: visibility 0s, opacity 0.5s linear;
        }
        
                .column:hover div{
            width: 250px;
            padding: 50px 50px;
            visibility: visible;
            opacity: 0.7; 
        }
        
        h3,.h3 {
            /* margin-top: 100px; */
            margin-bottom: .5rem;
            font-family: "Roboto",sans-serif;
            font-weight: 700;
            line-height: 1.2;
            font-size: 16px;
            text-align: center;
            color: #17224D
        }
        
        
        
            }
        
        @media (max-width: 450px) {
            .main{
            width: 100%;
            height: fit-content;
        }
        
        
        
        .img-thumbnail{
            height:250px;
            border: 1px solid grey;
            margin-top: 20px;
        }
        
        .mai1{
            width: 100%;
            /* height: fit-content; */
        }
        .sidebar{
            width: 100%;
            justify-content: center;
           
        }
        
        .sidebar .content-wrapper{
            width: 100%;
            justify-content: center;
            margin-top: 20px;
            margin-left: 45px;
            margin-bottom: 0px;
            /* padding: 60px 0px 55px 0px; */
        }
        
        
          
        
        .side{
            width: 100%;
            justify-content: center;
        }
          .side .content-wrapper{
            margin-top: 20px;
            margin-left: 45px;
          }  
            
            
          .col-lg-6 .dip{
            padding-top:40px;
        } 
        
        
        
        .col-lg-6 .dip p{
            margin-bottom: 0px;
        }
            .column{
               margin-left: 25px;
                width: 85%;
                padding: 50px;
                height: 500px;
                margin-top: 10px;
                }
        
                .column div{
            position: absolute;
            bottom: 0;
            right: 0;
            background: black;
            color: white;
            margin-bottom: 0px;
            font-family: sans-serif;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: visibility 0s, opacity 0.5s linear; 
            transition: visibility 0s, opacity 0.5s linear;
        }
        
                .column:hover div{
            width: 280px;
            padding: 55px 55px;
            visibility: visible;
            opacity: 0.7; 
        }
        
        h3,.h3 {
            /* margin-top: 100px;
            margin-bottom: .5rem; */
            font-family: "Roboto",sans-serif;
            font-weight: 700;
            line-height: 1.2;
            font-size: 16px;
            text-align: center;
            color: #17224D
        }
        
        
        
            }
        
        
            @media (max-width: 360px) {
            .column{
               margin-left: 25px;
                width: 85%;
                padding: 50px;
                height: 500px;
                margin-top: 10px;
                }
        
                .column div{
            position: absolute;
            bottom: 0;
            right: 0;
            background: black;
            color: white;
            margin-bottom: 0px;
            font-family: sans-serif;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: visibility 0s, opacity 0.5s linear; 
            transition: visibility 0s, opacity 0.5s linear;
        }
        
                .column:hover div{
            width: 250px;
            padding: 50px 50px;
            visibility: visible;
            opacity: 0.7; 
        }
        
        h3,.h3 {
            /* margin-top: 100px; */
            margin-bottom: .5rem;
            font-family: "Roboto",sans-serif;
            font-weight: 700;
            line-height: 1.2;
            font-size: 16px;
            text-align: center;
            color: #17224D
        }
        
        
        
            }
        
        .col-2 img{
            transition: 0.2s;
        }
        
        .col-2 img:hover{
            transform: scale(1.5);
        }
        
        
        @media (max-width: 450px) {
        .col-2{
            width:200px;
            height:200px;
            align-items: center;
            margin-left: 55px; 
            margin-top: 15px;
        }
        
        .col-2.img-fluid{
            width:350px;
            height:350px;
                font-size: 15px
            }
        
           
        
        
        }
        
        
        h3,.h3 {
            /* margin-top: 350px; */
            margin-bottom: .5rem;
            font-family: "Roboto",sans-serif;
            font-weight: 700;
            line-height: 1.2;
            /* text-align: center; */
            color: black;
        }




        /* @import url(https://fonts.googleapis.com/css?family=Acme); */
/* * {
  box-sizing: border-box;
} */

/* body, html {
  width: 100%;
  height: 100%;
  font-family: "Acme", sans-serif;
  background-color: #C4CBB7;
  font-size: 16px;
  background: linear-gradient(-45deg, #C4CBB7 25%, #AAB3AB 25%, #AAB3AB 50%, #C4CBB7 50%, #C4CBB7 75%, #AAB3AB 75%);
  background-size: 4px 4px;
  text-shadow: 0 1px 5px #EBEFC9, 0 -1px 0 black, 0 -2px 0 rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.35), 0 2px 2px rgba(255, 255, 255, 0.18);
} */
/* body h1, html h1 {
  text-align: center;
  letter-spacing: 2px;
  padding: 2rem;
} */
 /* .Americas, html .Americas {
  position: relative;
  padding: 3.125em 5%;
  margin: 2%;
  overflow: hidden;
}
body .acts, html .acts {
  padding-top: 2.5em;
  margin: auto;
  max-width: 100%;
}

.tip {
  position: absolute;
  width: 0.25em;
  top: 1.563em;
  bottom: 1.563em;
  left: 50%;
  margin-left: -0.125em;
  background: #ffae42;
  transition: 0.65s cubic-bezier(0.58, -0.57, 0.17, 1.21);
}
.tip:before {
  content: " ";
  width: 3.125em;
  height: 3.125em;
  position: absolute;
  background: #b0274f;
  border-radius: 50%;
  left: -1.438em;
  top: 0px;
  box-shadow: -1px 1px 1px 1px #AAB3AB;

 
}



.tip:after {
  content: " ";
  width: 3.125em;
  height: 3.125em;
  position: absolute;
  background: #b0274f;
  border-radius: 50%;
  bottom: 0px;
  left: -1.438em;
  box-shadow: -1px 1px 1px 1px #b0274f;
}

.civil {
  border: 1px solid #ffae42;
  border-radius: 2px;
  box-shadow: inset -1px -1px 1px rgba(0, 0, 0, 0.45);
  clear: both;
  padding: 1.563em 2.5em 1.875em;
  width: 50%;
  margin: -10% -1.875em 2.5em;
  position: relative;
  transition: 0.85s cubic-bezier(0.58, -0.57, 0.17, 1.21);
}
.civil:first-child {
  margin-top: 0;
}
.civil:before {
  content: " ";
  position: absolute;
  top: 0.688em;
  left: -2.875em;
  background: #b0274f;
  height: 1.25em;
  width: 1.25em;
  border-radius: 50%;
  border: 6px solid #ffae42;
  box-shadow: inset 0 -1px 5px #b0274f;
}
.civil:after {
  content: " ";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.469em 0.938em 0.469em 0;
  border-color: transparent #8F6951 transparent transparent;
  position: absolute;
  top: 1.25em;
  left: -0.938em;
}

.civil.right {
  float: right;
}

.civil.left {
  float: left;
}
.civil.left:before {
  left: auto;
  right: -2.875em;
 
}
.civil.left:after {
  left: auto;
  right: -0.938em;
  border-width: 0.469em 0 0.469em 0.938em;
  border-color: transparent transparent transparent #8F6951;
}

.year {
  position: absolute;
  top: -4.375em;
  width: 100%;
}

.civil.right .year {
  text-align: left;
  right: 0;
}

.civil.left .year {
  text-align: right;
  left: 0;
}

.year h4 {
  letter-spacing: 0.125em;
  text-transform: uppercase;
  font-size: 1.5rem;
  font-weight: 200;
}

.designation animated slideInUp {
  font-weight: 200;
  line-height: 1;
  font-size: 1.6rem;
}

.about animated slideInUp {
  font-size: 1.1rem;
  line-height: 1.7;
}

@media screen and (min-width: 75em) {
  .civil {
    margin-top: -80px;
  }
}
@media screen and (max-width: 51.875em) {
  .tip {
    left: 5%;
  }

  .civil {
    margin: 1.563em 0 1.563em 1.875em;
    width: 95%;
    transition: 0.75s cubic-bezier(0.43, -0.57, 0.17, 1.11);
  }

  .civil.left,
.civil.right {
    float: left;
  }

  .civil.left .year {
    text-align: left;
    left: 0;
  }

  .civil.left:before {
    right: auto;
    left: -2.938em;
  }

  .civil.left:after {
    right: auto;
    left: -0.938em;
    border-width: 0.469em 0.938em 0.469em 0;
    border-color: transparent #8F6951 transparent transparent;
  }

  .civil.right:before {
    left: -2.938em;
  }
} */



/* .image-wrapper {
  width: 600px;
  height: 400px;
  position: relative;
  margin: 5vh auto;
}

.image-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: left;
  height: 400px;
  width: 490px;
  margin-left: 20px;
}

.image-1 {
  clip-path: polygon(0 0, 0 32%, 28% 0);
  transform: translate(-10px, -10px);
  transition: transform 300ms ease;
  transform-origin: top;
  .image-wrapper:hover & {
    transform: translate(0,0);
    /* height: 400px; */
    /* width: 500px; */
  /* }
} */

/* .image-2 {
  clip-path: polygon(28% 0, 0 32%, 0 100%, 17% 100%, 90% 0);
  transform: translate(-30px, 5px);
  transition: transform 300ms ease;
  .image-wrapper:hover & {
    transform: translate(0,0);
    /* height: 400px;
    width: 550px; */
  /* }
} */

/* .image-3 {
  clip-path: polygon(100% 0, 100% 65%, 74% 100%, 17% 100%, 90% 0);
  transform: translate(-15px, -10px);
  transition: transform 300ms ease;
  .image-wrapper:hover & {
    transform: translate(0,0);
    /* height: 400px;
    width: 550px; */
  /* } */ 
/* } */ 

/* .image-4 {
  clip-path: polygon(100% 65%, 74% 100%, 100% 100%);
  transform: translate(-32px, 5px);
  transition: transform 300ms ease;
  transform-origin: top;
  .image-wrapper:hover & {
    transform: translate(0,0);
   
  }
} */ 



h2 {
  text-align: center;
  color: #fff;
  font-size: 50px;
  font-family:Audiowide;
}
.img-area{
  width: 1170px;
  margin: 0% auto;
}

.single-img {
  position: relative;
  width: 48%;
  float: left;
  margin: 2% 1%;
}

.image {
  display: block;
  width: 100%;
  height: 70vh;
}

.img-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #D37913;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}

.single-img:hover .img-overlay {
  height: 100%;
}

.text {
  position: absolute;
  top: 52%; 
  left: 40%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #000;
  text-align: left;
  font-size: 18px;
  font-family: poppins;
  /* text-transform: uppercase; */
  /* letter-spacing: ; */
  font-weight: bold;
}
.text span{
  font-weight: 300;
}


h4 {
  margin-top:80px;
}

.mh{
  margin-top:120px;
}


/* ignore the code below */


.link-area
{
  position:fixed;
  bottom:20px;
  left:20px;  
  padding:15px;
  border-radius:40px;
  background:tomato;
}
.link-area a
{
  text-decoration:none;
  color:#fff;
  font-size:25px;
}
.image-left, .image-right
{
	margin: 1em 0;
 
}

.img-1{
  height: 350px;
  width: 350px;
transition: .5s;
}
.img-1:hover{
    transform: scale(1.1);
}
@media (min-width: 20em)
{
	.image-left, .image-right
	{
		display: flex;
		align-items: center;
	}

	.image-left img
	{
		margin-right: 1em;
		float: left; /* fallback */
	}

	.image-right img
	{
		order: 1;
		margin-left: 1em;
		float: right; /* fallback */
	}
	
	/* clearfix for fallback */
	.image-left::after,
	.image-right::after
	{
		content: "";
  	display: block;
		clear: both;
	}
}

@media (min-width: 30em)
{
	.image-left img, .image-right img
	{
		flex-shrink: 0;
	}
}     
        
            
          </style>
        
        
        
        </head>
        
        <body>
           
        
        
         
        
        
 <!-- Navbar Start -->
    <?php
   include('header.php');
   ?>
    <!-- Navbar End -->


        
 

    <!-- Page Header Start -->
    <div class="container-fluid page-header  py-5"  style="background-image: url(images/New\ Building\ Hall.jpeg); background-repeat:repeat; height: 400px; ">
        <div class="container">
            <!-- <h1 class="display text-white mb-3 animated slideInDown">About Us</h1> -->
            <!-- <nav aria-label="breadcrumb animated slideInDown">
                <ol class="breadcrumb text-uppercase">
                    <li class="breadcrumb-item animated slideInDown" ><a class="text-white" href="#">Home</a></li>
                    <li class="breadcrumb-item"><a class="text-white" href="#">Pages</a></li> -->
                    <!-- <li class="breadcrumb-item text-white active animated slideInDown" aria-current="page">About Us</li>
                </ol>
            </nav> --> 
        </div>
    </div>
    <!-- Page Header End -->


  






    <br><br>
               <!-- ======= About Section ======= -->
  <section id="about" class="about"style="background-image: url(images/.jpg); text-align:left;" >
      
    <div class="container">
        <h1 class=" text-center" style="color: #1c013c;">New Architecture</h1>
        <div class="separator"></div>
      <div class="row ">



        <div class="col-md-4">
          <img src="images/New Building Hall.jpeg" alt="Human Rights Logo" class="img-1 img-thumbnail animated slideInUp"/>
        </div>
          <div  class="col-md-8 "  >
            <h4 class="animated slideInUp" style="color:#000 "></h4>
            <p class="animated slideInUp" style="color:black">“Mone Wada”, 1208 Sadashiv Peth, Pune 30 hivastu donated by Rao Bahadur Kai/Ramchandra Venkatesh Mone to Maharashtra Chitpavan Sangha. The office of the Maharashtra Chitpawan Sangh has been housed in this building for many years. A new building of Maharashtra Chitpavan Sangh is being constructed at this place.
                The new building will have ample parking, bride-to-be board, office of the organization, large auditorium for programs and in this building, the temple of Chitpavan's Adya Kulaswamini Sri Ambajogai will be built. Hivastu will be complete with latest and necessary facilities like conference hall, solar system, lift, generator etc. for clans as well as other business meetings. The total construction will be 10 thousand feet
                </p>
          </div>
        
        <br><br>
        
      
     
       
       
          
        
        

      </div>

    </div>
  </section>
  <!-- End About Section -->
            

                <!-- <div class="wrap animate pop" >
                    <div class="overlay">
                        <div class="overlay-content animate slide-left delay-2" > -->
                            <!-- <h1 class="animate slide-left pop delay-4" style="color: white;">Burger</h1>
                            <p class="animate slide-left pop delay-5" style="color: white; margin-bottom: 2.5rem;"><em>Burger</em></p> -->
                        <!-- </div> -->
                        <!-- <div class="image-content animate slide delay-5" style="background-image:  url(img/In-Ceiling-Surround-Sound-Speakers.jpg);"></div> -->
                                <!-- <div class="dots animate">
                                    <div class="dot animate slide-up delay-6"></div>
                                    <div class="dot animate slide-up delay-7"></div>
                                    <div class="dot animate slide-up delay-8"></div>
                                </div> -->
                    <!-- </div>
                    <div class="dip" >
                        <p> <h6 style="color: #fff;">In ceiling Home cinema
                        </h6><br>
                            For cinephiles we have our grand Home cinema , but for everyone else Sparkal System can help enhance your 5.1 home theatre systems in your lounge or living room at Prctical cost . With Living space at a premium , why not de-clutter your living area ? soundsense can wall mount your TV / projector screen discreetly tuck away in-ceiling speakers for a amazing home theatre experience without compromising your living space
                           </p>
                        <p style="color: #fff;">  Sparkal System can help enhance your 5.1 home theatre systems
                            
                             </p>
                        <p></p>
                    </div>
                </div>
            
              
            </div>
        </div>
    </div> -->
    <!-- Fact Start -->
    <!-- <div class="container-fluid fact bg-dark my-5 py-5">
        <div class="container">
            <div class="row g-4">
                <div class="col-md-6 col-lg-3 text-center wow fadeIn" data-wow-delay="0.1s">
                    <i class="fa fa-check fa-2x text-white mb-3"></i>
                    <h2 class="text-white mb-2" data-toggle="counter-up">1234</h2>
                    <p class="text-white mb-0">Years Experience</p>
                </div>
                <div class="col-md-6 col-lg-3 text-center wow fadeIn" data-wow-delay="0.3s">
                    <i class="fa fa-users-cog fa-2x text-white mb-3"></i>
                    <h2 class="text-white mb-2" data-toggle="counter-up">1234</h2>
                    <p class="text-white mb-0">Expert Technicians</p>
                </div>
                <div class="col-md-6 col-lg-3 text-center wow fadeIn" data-wow-delay="0.5s">
                    <i class="fa fa-users fa-2x text-white mb-3"></i>
                    <h2 class="text-white mb-2" data-toggle="counter-up">1234</h2>
                    <p class="text-white mb-0">Satisfied Clients</p>
                </div>
                <div class="col-md-6 col-lg-3 text-center wow fadeIn" data-wow-delay="0.7s">
                    <i class="fa fa-wrench fa-2x text-white mb-3"></i>
                    <h2 class="text-white mb-2" data-toggle="counter-up">1234</h2>
                    <p class="text-white mb-0">Compleate Projects</p>
                </div>
            </div>
        </div>
    </div> -->
    <!-- Fact End -->


    <!-- Team Start -->
    <!-- <div class="container-xxl py-5">
        <div class="container">
            <div class="text-center wow fadeInUp" data-wow-delay="0.1s">
                <h6 class="text-secondary text-uppercase">Our Technicians</h6>
                <h1 class="mb-5">Our Expert Technicians</h1>
            </div>
            <div class="row g-4">
                <div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.1s">
                    <div class="team-item">
                        <div class="position-relative overflow-hidden">
                            <img class="img-fluid" src="img/team-1.jpg" alt="">
                        </div>
                        <div class="team-text">
                            <div class="bg-light">
                                <h5 class="fw-bold mb-0">Full Name</h5>
                                <small>designation animated slideInUp</small>
                            </div>
                            <div class="bg-primary">
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.3s">
                    <div class="team-item">
                        <div class="position-relative overflow-hidden">
                            <img class="img-fluid" src="img/team-2.jpg" alt="">
                        </div>
                        <div class="team-text">
                            <div class="bg-light">
                                <h5 class="fw-bold mb-0">Full Name</h5>
                                <small>designation animated slideInUp</small>
                            </div>
                            <div class="bg-primary">
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.5s">
                    <div class="team-item">
                        <div class="position-relative overflow-hidden">
                            <img class="img-fluid" src="img/team-3.jpg" alt="">
                        </div>
                        <div class="team-text">
                            <div class="bg-light">
                                <h5 class="fw-bold mb-0">Full Name</h5>
                                <small>designation animated slideInUp</small>
                            </div>
                            <div class="bg-primary">
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 wow fadeInUp" data-wow-delay="0.7s">
                    <div class="team-item">
                        <div class="position-relative overflow-hidden">
                            <img class="img-fluid" src="img/team-4.jpg" alt="">
                        </div>
                        <div class="team-text">
                            <div class="bg-light">
                                <h5 class="fw-bold mb-0">Full Name</h5>
                                <small>designation animated slideInUp</small>
                            </div>
                            <div class="bg-primary">
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-square mx-1" href=""><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> -->
    <!-- Team End -->
        

     <!-- Footer Start -->

    <!-- Footer Start -->

 <?php
   include('footer.php');
   ?>
      <!-- Footer End -->
    
    
      <!-- Back to Top -->
      <a href="#" class="btn btn-lg btn-secondary btn-lg-square rounded-0 back-to-top"><i class="bi bi-arrow-up"></i></a>
      <!-- JavaScript Libraries -->
    
        <!-- JavaScript Libraries -->
        <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
        <script src="lib/wow/wow.min.js"></script>
        <script src="lib/easing/easing.min.js"></script>
        <script src="lib/waypoints/waypoints.min.js"></script>
        <script src="lib/counterup/counterup.min.js"></script>
        <script src="lib/owlcarousel/owl.carousel.min.js"></script>
        <script src="lib/tempusdominus/js/moment.min.js"></script>
        <script src="lib/tempusdominus/js/moment-timezone.min.js"></script>
        <script src="lib/tempusdominus/js/tempusdominus-bootstrap-4.min.js"></script>
    
        <!-- Template Javascript -->
        <script src="js/main.js"></script>

        <script>
            let anims = [...document.querySelectorAll("[anim]")];
console.log(anims);
let click = (el, cb) => el.addEventListener("click", cb);
let toggle = (el) => el.classList.toggle("toggled");
let clickTog = (el) => click(el, () => toggle(el));
anims.map(clickTog);
        </script>
    </body>
    
    </html>