<style>
    @media only screen and (min-width: 1200px) {
  .topmargin {
    margin-top:42px;
  }
}

</style>

<figure>
    <img src="<?php echo base_url();?>assets/images/Delhi-illustartor.png" alt="competent" class="w-100 img-fluid"> 
   
 </figure>
 <footer class="kilimanjaro_area">
        <!-- Top Footer Area Start -->
        <div class="foo_top_header_one section_padding_100_70">
            <div class="container">
                <div class="row">
                    <div class="col-12 col-md-4 col-lg-3">
                        <div class="kilimanjaro_part">
                            <a href="index.php"> <img src="<?php echo base_url();?>assets/images/logo.png" alt="logo" width="150"></a>
                        </div>
                        <div class="kilimanjaro_part">
                            <div class="footerp">
                                <p>Competent Automobiles Company Ltd (CACL) is promoted by Sh. Raj Chopra with a proactive practical, industrial and business experience of more than 40 years.</p>
                                                <p><span style="width: auto;"><i class="fa fa-envelope" aria-hidden="true"></i><a href="mailto:[email protected]">[email protected]</a></span></p>
<p><span style="width: auto;"><i class="fa fa-envelope" aria-hidden="true"></i><a href="mailto:[email protected]">[email protected]</a></span></p>

                                <p><span style="width: auto;"><i class="fa fa-phone-square" aria-hidden="true"></i><a href="tel:+91 8929347787">+91 8929347787</a></span>
                                </p>
                            </div>
                        </div>
                    </div>
                    
                    <div class="col-12 col-md-4 col-lg-2">
                        <div class="kilimanjaro_part">
                           <h5>About Us</h5>
                            <ul class="kilimanjaro_links">
                                <li><a href="<?php echo base_url();?>vision"><i class="fa fa-angle-right" aria-hidden="true"></i>Vision</a></li>
                                <li><a href="<?php echo base_url();?>founder"><i class="fa fa-angle-right" aria-hidden="true"></i>Founder</a></li>                                                               
                            </ul>
                        </div>
                    </div>
                    
                    <div class="col-12 col-md-4 col-lg-3">
                        <div class="kilimanjaro_part">
                           <h5>Discover</h5>
                            <ul class="kilimanjaro_links">
                                <li><a href="<?php echo base_url();?>contact-us"><i class="fa fa-angle-right" aria-hidden="true"></i>Contact us</a></li>
                                <li><a href="<?php echo base_url();?>career"><i class="fa fa-angle-right" aria-hidden="true"></i>Careers</a></li>
                                <li><a href="<?php echo base_url();?>investors_area"><i class="fa fa-angle-right" aria-hidden="true"></i>Investor Portal</a></li>
                                <li><a href="<?php echo base_url();?>privacy-policy"><i class="fa fa-angle-right" aria-hidden="true"></i>Privacy Policy</a></li>
                            </ul>
                        </div>
                    </div>
                    
                    <div class="col-12 col-md-4 col-lg-2">
                        <div class="kilimanjaro_part">
                           <h5>Our Brands</h5>
                            <ul class="kilimanjaro_links">
                                <li><a href="https://competentarena.com/" target="_blank"><i class="fa fa-angle-right" aria-hidden="true"></i>Competent Arena</a></li>
                                <li><a href="https://competentnexa.com/" target="_blank"><i class="fa fa-angle-right" aria-hidden="true"></i>Competent Nexa</a></li>
	                        </ul>
                        </div>
                    </div>
                    
                
      
                    <div class="col-12 col-md-6 col-lg-2">
                        <div class="kilimanjaro_part">
                            <div class="social-icons">
                                <ul class="kilimanjaro_social_links">
                                    <a href="https://www.facebook.com/ArenaCompetentAutomobilesCompetentHouse/" target="_blank"><i class="fa fa-facebook-square fa-2x social-fb"></i></a>
                    
                                    <a href="https://www.linkedin.com/company/competent-automobiles-company-ltd/?originalSubdomain=in" target="_blank"><i class="fa fa-linkedin fa-2x social-pin" ></i></a>
                
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Footer Bottom Area Start -->
        <div class=" kilimanjaro_bottom_header_one section_padding_50 text-center">
            <div class="container">
                <div class="row" style="align-items:center;">
                    <div class="col-lg-6 col-md-6">
                <div class="copyright">
                    <p>© All Rights Reserved by <a href="#">Competent Automobiles Co. Ltd.<i class="fa fa-love"></i></a></p>
                </div>
            </div>
            <div class="col-lg-6 col-md-6">
                <div class="design">
                    <p>Designed & Developed by  <a target="_blank" href="https://www.ambitcollective.com/">Ambit Collective  LLP</a></p>
                </div>
            </div>
                    
                </div>
            </div>
        </div>
    </footer>
    
    
    <!-- <div class="connect-with-bonwic">
<div class="active-timing">
<button type="button" class="close">
                    <span aria-hidden="true">×</span>
                </button>
<figure class="mb-0"><img src="<?php echo base_url();?>assets/images/Skoda-logo-thumb.png" alt="icons"></figure>
<p>Welcome to Ring Road Škoda,<br> How may we help you ?</p>
<a href="https://api.whatsapp.com/send?phone=+91-9289109511&amp;text=." target="_blank" class="whatsaapChat"> Chat Now</a>
</div>  
<a href="https://api.whatsapp.com/send?phone=+91-9289109511&amp;text=." target="_blank">
<img src="<?php echo base_url();?>assets/images/whataap.png" alt="img" id="whatsapEnter" class="img-fluid" />
</a>
</div> -->
 
  
    <div onclick="topFunction()" class="car-top default show car-down" id="myBtn"> <span> <img src="https://images-saboomaruti-in.s3.ap-south-1.amazonaws.com/saboonexa/Saboo-Nexa-Cars-Top-View.webp" alt="Top" title="Back to top" style="width: 50px;padding-right: 15px;"> </span></div>
    
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
        

<section class="sec-features">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">Submit Query</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            
            <!-- Note :
   - You can modify the font style and form style to suit your website. 
   - Code lines with comments Do not remove this code are required for the form to work properly, make sure that you do not remove these lines of code. 
   - The Mandatory check script can modified as to suit your business needs. 
   - It is important that you test the modified form before going live.-->
   <div class="modal-body">
           <div id='crmWebToEntityForm' class='zcwf_lblLeft crmWebToEntityForm'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
   <META HTTP-EQUIV ='content-type' CONTENT='text/html;charset=UTF-8'>
   <form action='#' method='POST'>
  <!--<input type="text"  name='token'  id="token">-->
     <!-- Do not remove this code. -->
                    <div class="form-row">
                        <div class="col-md-6 mb-3">

                            <div class="form-group">
                                <span class="has-float-label">
                                    <label for="last-name">Name</label>
                                    <input type="text" id='name' name='firstname' class="form-control" id="" required>
                                </span>
                            </div>

                        </div>
                        <div class="col-md-6 mb-3">
                            <div class="form-group">
                                <span class="has-float-label">
                                    <label for="last-name">E-Mail</label>
                                    <input type='email'  id='Email' name='email' class="form-control" id="" required>
                                </span>
                            </div>
                        </div>
                        <div class="col-md-6 mb-3">
                            <div class="form-group">
                                <span class="has-float-label">
                                    <label for="last-name">Mobile No</label>
                                    <input type='tel' id='Phone' name='phone' minlength='10' maxlength='10' pattern="^[6-9]\d*|0$" class="form-control"  required>
                                </span>
                            </div>
                        </div>
                        
                        
                        <div class="col-md-6 mb-3">
                            <div class="form-group">
 			   	<span class="has-float-label">
<label for="last-name">Model</label>
                                                    <select class="custom-select mr-sm-2" id="LEADCF6" name="model" required="">
                                                        <option value="">-Select Model-</option>
                                                        <option value="">ALTO 800</option>
                                                        <option value="">ALTO K10</option>
                                                        <option value="">WAGON R</option>
                                                        <option value="">S-PRESSO</option>
                                                        <option value="">ECCO</option>
                                                        <option value="">CELERIO</option>
                                                        <option value="">SWIFT</option>
                                                        <option value="">DZIRE</option>
                                                        <option value="">ERTIGA</option>
                                                        <option value="">VITARA BREZZA</option>
                                                    </select>
                             	</span>
			     </div>
                        </div>
                        
                      <div class="col-md-12 mb-3">
                          
                           <input type="submit" name="submit" class="btn btn-primary" value="Submit">
                          
                            
                        </div>
                        
                        
                            
                     
                    </div>
                </form>
            
                </META>
            </div>
             </div>
        </div>
    </div>
</section>
 </div>
 
 
<div class="cookie-alert">
<div class="container">
  <div class="row">
  <div class="col-md-9 cookie-card-data">
    <h5>&#x1F36A; Do you like cookies?   <span>We use cookies to ensure you get the best experience on our website.</span></h5>
     </div>
      <div class="col-md-3 text-center">
        <div class="position-relative">
      <a href="#" class="btn btnCookies accept-cookies">Accept</a>
    </div>
     </div>
  </div>
</div>
</div>
 
  
  <script>(function() {
    var input = document.getElementById('Phone');
    var pattern = /^[6-9][0-9]{0,9}$/;
    var value = input.value;
    !pattern.test(value) && (input.value = value = '');
    input.addEventListener('input', function() {
        var currentValue = this.value;
        if(currentValue && !pattern.test(currentValue)) this.value = value;
        else value = currentValue;
    });
})();
</script>    </div>
  
    <!-- JQuery -->
    
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <!-- Bootstrap JS -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
 
 <!-- carousel JS -->
    <script src="<?php echo base_url();?>assets/js/custom.js"></script>
     <script src="<?php echo base_url();?>assets/js/owl.carousel.min.js"></script>

        <script src="<?php echo base_url();?>assets/js/jquery.viewbox.min.js"></script>
 <script src="<?php echo base_url();?>assets/js/dropdown-leval.js"></script>
        
        
 <script>
        $(function() {
            $("#myModal").modal();
        });
    </script>

     <script>
$(document).ready(function() {
    setTimeout(function(){
   $('.active-timing').show()
 },);

$('.close').click(function(){
    $('.active-timing').hide();
});


$('#whatsapEnter').mouseover(function() {
     $('.active-timing').show()
  });

})
</script>

 <script>
        $(function () {
            $('#navbar_top').bootnavbar();
        })
    </script>

    
<script>
            $(document).ready(function() {
              
              
               $('#accessories-skoda').owlCarousel({
                loop: true,
                nav:true,
                dots:false,
                autoplay: false,
                responsiveClass: true,
                responsive: {
                  0: {
                    items: 1,
                    nav: false,
                    dots:true,
                    margin: 10
                  },
              
                  600: {
                    items: 1,
                    nav: false,
                    dots:true,
                    margin: 10
                  },
              
                  1000: {
                      items:2,
                    nav:true,
                    loop: true,
                        navText: [
        '<i class="fa fa fa-chevron-left" aria-hidden="true"></i>',
        '<i class="fa fa fa-chevron-right" aria-hidden="true"></i>'
    ],
                    dots:false,
                    margin:20
                  },
                  
                    1200: {
                    items:2,
                    nav:true,
                    loop: true,
                        navText: [
        '<i class="fa fa fa-chevron-left" aria-hidden="true"></i>',
        '<i class="fa fa fa-chevron-right" aria-hidden="true"></i>'
    ],
                    dots:false,
                    margin:20
                  }
                  
                }
              })
              
              
            })
          </script>
    
    
    <script>
            $(document).ready(function() {
              $('.owl-carousel').owlCarousel({
                items: 1,
                loop: false,
                center: true,
                dots:false,
                margin: 10,
                callbacks: true,
                URLhashListener: true,
                autoplayHoverPause: true,
                startPosition: 'URLHash'
              });
              
              
    $('.button.secondary').click(function() {
   $('.active').removeClass('active');
    $(this).addClass('active')
    });

        
      
            });
          </script>
    

 
 <script>
        //============Mobile Toggle Js================//
              (function () {
  var toggle = document.querySelector('.nav-toggle');
  
  toggle.addEventListener('click', function(e) {
    this.classList.toggle('opened');
  });
})();    
</script> 

<script>

//Navbar    
$(document).ready(function () {

        if ($(window).width() < 1024) {
            $(".dropdown-nav").click(function () {
            $(".dropdown-men-sm").toggle()
            });

        }
           else if($(window).width() > 1180){
             $(".dropdown-nav").hover(function () {
            $(".dropdown-men-sm").toggle()
            });
        }
        //================== Desktop Hover Module=====
 
     
            if ($(window).width() < 1024) {
            $(".dropdown-other").click(function(){
           $(this).find('.dropdown-nav-sm').toggle()
            })
        }
        
        else if($(window).width() > 1180){
             $(".dropdown-other").hover(function () {
            $(this).find('.dropdown-nav-sm').toggle()
            });
        }


        
  
});

</script>

<script>
$(document).ready(function () {

$('.thumbnail').viewbox();
            $('.thumbnail-2').viewbox({fullscreenButton: true});

            (function(){
                var vb = $('.popup-link').viewbox();
                $('.popup-open-button').click(function(){
                    vb.trigger('viewbox.open');
                });
                $('.close-button').click(function(){
                    vb.trigger('viewbox.close');
                });
            })();

  
});
</script>


    <script>
(function () {
    "use strict";

    var cookieAlert = document.querySelector(".cookie-alert");
    var acceptCookies = document.querySelector(".accept-cookies");

    cookieAlert.offsetHeight; 

    if (!getCookie("acceptCookies")) {
        cookieAlert.classList.add("show");
    }

    acceptCookies.addEventListener("click", function () {
        setCookie("acceptCookies", true, 60);
        cookieAlert.classList.remove("show");
    });
})();

function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toUTCString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
    var name = cname + "=";
    var decodedCookie = decodeURIComponent(document.cookie);
    var ca = decodedCookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) === ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) === 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}
</script>


<script>
   $(document).ready(function () {
    //toggle the component with class accordion_body
    $(".accordion_head").click(function () {
        if ($('.accordion_body').is(':visible')) {
            $(".accordion_body").slideUp(300);
            $(".plusminus").text('+');
        }
        if ($(this).next(".accordion_body").is(':visible')) {
            $(this).next(".accordion_body").slideUp(300);
            $(this).children(".plusminus").text('+');
        } else {
            $(this).next(".accordion_body").slideDown(300);
            $(this).children(".plusminus").text('-');
        }
    });
});
</script>

<script type="text/javascript">
function showDiv(select){
   if(select.value==1){
    document.getElementById('hidden_div1').style.display = "block";
document.getElementById('hidden_div0').style.display = "none";
document.getElementById('hidden_div2').style.display = "none";
document.getElementById('hidden_div3').style.display = "none";
document.getElementById('hidden_div4').style.display = "none";
   } else if(select.value==2){
    document.getElementById('hidden_div2').style.display = "block";
document.getElementById('hidden_div0').style.display = "none";
document.getElementById('hidden_div3').style.display = "none";
document.getElementById('hidden_div4').style.display = "none";
document.getElementById('hidden_div1').style.display = "none";
   }else if(select.value==3){
    document.getElementById('hidden_div3').style.display = "block";
document.getElementById('hidden_div0').style.display = "none";
document.getElementById('hidden_div1').style.display = "none";
document.getElementById('hidden_div2').style.display = "none";
document.getElementById('hidden_div4').style.display = "none";
   }else if(select.value==4){
    document.getElementById('hidden_div4').style.display = "block";
document.getElementById('hidden_div0').style.display = "none";
document.getElementById('hidden_div2').style.display = "none";
document.getElementById('hidden_div3').style.display = "none";
document.getElementById('hidden_div1').style.display = "none";
   }else{
    document.getElementById('hidden_div0').style.display = "none";
   }
} 
</script>


<script>
function Calculate() {
  
    // Extracting value in the amount 
    // section in the variable
    const amount = document.querySelector("#amount").value;
  
    // Extracting value in the interest
    // rate section in the variable
    const rate = document.querySelector("#rate").value;
  
    // Extracting value in the months 
    // section in the variable
    const months = document.querySelector("#months").value;
  
    // Calculating interest per month
    const interest = (amount * (rate * 0.01)) / months;
      
    // Calculating total payment
    const total = ((amount / months) + interest).toFixed(2);
  
    document.querySelector("#total")
        .innerHTML = "EMI : (&#8377;) " + total;
}  
</script>


<div class="modal fade" id="emailid" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
    <section class="sec-features">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">Write To Us</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div>
                        <p class="mb-3"><a href="mailto:[email protected]">[email protected]</a></p>
                        <p class="mb-3"><a href="mailto:[email protected]">[email protected]</a></p>
                    </div>
                </div>
            </div>
        </div>
    </section>
 </div>