<style>
        .ftr-bar{
            display: flex;
            width: 100%;
            position:fixed;
            bottom:0;
            z-index:999;
           background-color:#F9F4EE !important;
        }

        .ftr-bar-btn{
            flex-basis: 25%;
            background-color: #fefefe; 
            display:flex;
            justify-content:center;
            align-items:center;
            color:#1bbde8 !important; 
            font-weight:700;
            padding:8px 0px;
        }

        .book-btn{
        flex-basis: 28%;
       
        }
        .wp-btn{
         flex-basis: 25%;
         

        }
        .pac-btn{
            flex-basis: 25%;
           
        }
        .call-btn{
            flex-basis: 26%;
            
        }
        .book-btn a ,
        .pac-btn a{
         color: #1bbde8;
         text-decoration: none;
         font-size:15px;
        }
        .wp-btn a{
            color: #1bbde8;
            text-decoration: none;
            font-size:15px;
        }
        .call-btn a{
            color: #1bbde8;
            text-decoration: none;
            font-size:15px;
        }

        .ftr-bar{
            display: none;
        }
        
        
        
.whatsapp-float {
    position: fixed;
    bottom: 85px;
    left: 30px;
    z-index: 999;
}
.whatsapp-float img {
   width: 50px;
   height: 50px;
}
.call-icon{
    position: fixed;
    bottom: 30px;
    left: 30px;
    z-index: 999;
}
 /*.ftr-bar-btn{*/
 /*   border-right:1px solid #0e0e0e !important;*/
 /*}*/

 /*.ftr-bar-btn:last-child{*/
 /*   border-right:1px solid #0e0e0e !important;*/
 /*}*/

.call-icon img{
    width: 50px;
    height: 50px;
 } 
        
      @media only screen and (max-width: 768px) {

        .ftr-bar{
            display: flex;
            
        }
        
        .whatsapp-float,
            .call-icon{
                display:none;
            }
        
        
            }
            

    </style>



    <div class="ftr-bar">
        <div class="ftr-bar-btn book-btn text-center">
            <a href="<?= $wspath;?>enquiry.html"><img src="<?= $wspath;?>assets/imgzz/help.png" style="width:14px;"> <br> Enquiry</a>
        </div>
        <div class="ftr-bar-btn pac-btn text-center">
            <a href="<?= $wspath;?>product-lisiting.html"><img src="<?= $wspath;?>assets/imgzz/product.png" style="width:14px;"> <br> Products</a>
        </div>
        <div class="ftr-bar-btn call-btn text-center">
            <a href="tel:<?php echo $datac['phone'] ?>"><img src="<?= $wspath;?>assets/imgzz/telephone.png" style="width:14px;"> <br> Call Us</a>
           
        </div>
        <div class="ftr-bar-btn wp-btn text-center">
             <a href="https://wa.me/<?php echo $datac['whatsapp'] ?>"><img src="<?= $wspath;?>assets/imgzz/whatsapp-sky.png" style="width:14px;"> <br> Whatsapp</a>
          
        </div>
    </div>
    
    <!--Desktop View -->
     <div class="whatsapp-float">
         <a href="https://wa.me/<?php echo $datac['whatsapp'] ?>">
         <img src="<?= $wspath;?>assets/imgzz/wp-icon.png" width="50px" class="whatsapp-float-btn">
         </a>
            
    </div>
       
        <div class="call-icon">
             <a href="tel:<?php echo $datac['phone'] ?>"> 
                 <img src="<?php echo $wspath ?>assets/imgzz/call-icon.png" width="50px" class="whatsapp-float-btn">
                 </a>
        </div>