OverLord Shell

<?php include("header.php");?>
        <!-- Sticky Navbar -->
            <div class="breadcrumb-box">
                <div class="container"><br>
                          <ul class="breadcrumb"  style="float:left;">
                            <li><a href="index.php">Home</a></li>
                            <li class="active">Events</li>
                        </ul>
                    </div>
                       <div class="section-title" data-animation="fadeInUp">
                    <!-- Heading -->
                    <h2 class="title" style="color:#A13739">Events</h2>
                </div> <br><br>
                </div>
            </div>
                <section id="works" class="page-section">
            <div class="container work-section">
            
                <div id="options" class="filter-menu">
                    <ul class="option-set nav black nav-pills">
                        <li class="filter active" data-filter="all">Show All</li>
                         <?php
                $eventq="select * from mc_event where active='y' group by designation";
				$eventconn=$connection->query($eventq);
				while($event=$eventconn->fetch_assoc()) { ?>
                        <li class="filter" data-filter=.<?php echo $event['designation'];?>><?php echo $event['designation'];?> </li>
                           <?php }?>
                    </ul>
                </div>
                
                    <div id="mix-container" class="portfolio-grid grid-list">
                       <?php
                            $eventq="select * from mc_event where active='y' order by fromdate desc";
                            $eventconn=$connection->query($eventq);
                            while($event=$eventconn->fetch_assoc()) { ?>
                                <!-- Item 1 -->
                                <div class="grids1 row mix all html <?php echo $event['designation'];?>"data-category="<?php echo $event['designation'];?>">
                                    <div class="row">
                                     <div class="col-sm-6 col-md-4"><div id="example2">
                                           <a class="fancybox" href="upload/event/<?php echo $event['srno'].".".$event['image'];?>">
                                               <img src="upload/event/<?php echo $event['srno'].".".$event['image'];?>" style="height:250px; width:1050px !important" />
                                        </a>  
                                        </div></div>
                                        <div class="col-sm-6 col-md-8">
                                            <h3 class="title">
                                                <?php echo $event['short_description'];?>
                                            </h3>     <h5 class="title"><?php if($event['fromdate']!=NULL){?><i class="fas fa-calendar-alt"></i><?php }?><?php if($event['fromdate']!=NULL){?><?php echo $event['fromdate']; }else {$event['fromdate']="";}?></h5>
                                                                   <p><?php echo $event['description'];?></p>
                                                               
            
                                        </div>
                                       
                                  
                                </div>
                                <!-- Item 1 Ends-->
                              
                            </div><br><?php }?>
                    </div>
                 
                </div>
            </div>
        </section>

       <?php include("footer.php");?>
	    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css" >
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>

		<script>
	$(".fancybox").fancybox();

</script>