| Server IP : 94.136.191.34 / Your IP : 216.73.216.25 Web Server : Apache System : Linux hostpanel.netbiz.in 5.15.0-130-generic #140-Ubuntu SMP Wed Dec 18 17:59:53 UTC 2024 x86_64 User : omkar.com_6nnuz6y629h ( 10087) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system,proc_open,popen MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /var/www/vhosts/omkar.com/httpdocs/application/views/ |
Upload File : |
<!DOCTYPE html>
<html lang="en">
<head>
<title><?php echo $page_info->title;?></title>
<meta name="description" content="<?php echo $page_info->meta_description;?>" />
<meta name="keywords" content="<?php echo $page_info->meta_keywords;?>" />
<?php $this->load->view('header'); ?>
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript>
<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-T3BPP5W" height="0" width="0" style="display:none;visibility:hidden">
</iframe>
</noscript>
<!-- End Google Tag Manager (noscript) -->
<!-- structured map data -->
<?php echo $page_info->structured_map_data;?>
<!-- structured map data -->
<div id="wrapper" class="aos-all">
<?php
$data1['act'] = $page_active;
//$data1['project_list'] = $project_list;
$this->load->view('navigation', $data1); ?>
<?php /*
<section class="infoListingBanner">
<div class="container">
<div class="row row-eq-height">
<div class="col-md-6 infobannertxt">
<h4 data-aos="fade-up">Lorem ipsum dolor sit amet</h4>
<p data-aos="fade-up" data-aos-delay="100">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="col-md-6">
<img src="<?php echo base_url(); ?>assets/images/bannerinfographic.jpg" alt="">
</div>
</div>
</div>
</section>
*/ ?>
<section class="infoDetailsWpr">
<div class="container">
<div class="infoDetailHeader" style="background-image: url('<?php echo base_url(); ?>assets/images/millennials-1.png');">
<a href="#" data-tab="1" class="tabhead tabhead1 active"><p>Population</p></a>
<a href="#" data-tab="2" class="tabhead tabhead2"><p>Digital Consumption</p></a>
<a href="#" data-tab="3" class="tabhead tabhead3"><p>Spending Pattern</p></a>
<a href="#" data-tab="4" class="tabhead tabhead4"><p>Millennial Profile</p></a>
</div>
<div class="tabWpr">
<div data-content="1" class="content active content-population">
<div class="populationWpr">
<div class="popGlobal">
<div class="popTitle scaleAnime ">
<div class="popImg"></div>
<p>Globally Millennials Population</p>
</div>
<div class="popCount scaleAnime ">
<h4>27%<br>of 7.7bn</h4><p>world population</p>
</div>
</div>
<hr class="d-block d-sm-none">
<div class="popIndian">
<div class="popTitle scaleAnime ">
<div class="popImg"></div>
<p>Indian Millennials Population</p>
</div>
<div class="popCount scaleAnime ">
<h4>65%</h4><p>Population<br>born after 1980</p>
</div>
<div class="popGrid">
<div class="popCount scaleAnime ">
<h4>56%</h4><p>use a Tablet Computer</p>
</div>
<div class="popCount scaleAnime ">
<h4>23%</h4><p>use a wearable device</p>
</div>
<div class="popCount scaleAnime ">
<h4>21%</h4><p>use a handheld game device</p>
</div>
<div class="popCount scaleAnime ">
<h4>21%</h4><p>use an e-reader</p>
</div>
</div>
</div>
</div>
</div>
<div data-content="2" class="content content-digital">
<div class="digitalWpr">
<div class="statBlock">
<div class="statImg1 scaleAnime">
<div class="statTitle statTitle1 scaleAnime">
<h4>22%</h4>
<p>Search</p>
</div>
<div class="statTitle statTitle2 scaleAnime">
<h4>37%</h4>
<p>Email / Socail<br>Media</p>
</div>
<div class="statTitle statTitle3 scaleAnime">
<h4>30%</h4>
<p>Entertainment<br>(Music & Videos)</p>
</div>
<div class="statTitle statTitle4 scaleAnime">
<h4>30%</h4>
<p>Transaction<br>(Incl Bank)</p>
</div>
<img src="<?php echo base_url(); ?>assets/images/digital-stat-1.png" alt="">
</div>
</div>
<div class="statBlock midStat scaleAnime">
<div class="statImg2"></div>
<p>Millennials to Become More Than a Third of India's Population</p>
</div>
<div class="statBlock">
<div class="statImg3 scaleAnime">
<div class="statTitle statTitle5 scaleAnime">
<h4>01%</h4>
<p>Tablet</p>
</div>
<div class="statTitle statTitle6 scaleAnime">
<h4>89%</h4>
<p>Mobile</p>
</div>
<div class="statTitle statTitle7 scaleAnime">
<h4>10%</h4>
<p>Desktop / Laptop</p>
</div>
<img src="<?php echo base_url(); ?>assets/images/digital-stat-2.png" alt="">
</div>
</div>
</div>
</div>
<div data-content="3" class="content content-spending">
<div class="spendingWpr">
<div class="spendBlock">
<div class="spendInner scaleAnime">
<h4>spending 6%</h4>
<p>of their income on daily commute.</p>
<div class="spendImg1"></div>
</div>
<hr>
<div class="spendInner scaleAnime">
<p>They spend about</p>
<h4>30%</h4>
<p>on shopping</p>
<div class="spendImg2"></div>
</div>
<hr class="d-block d-sm-none">
</div>
<div class="spendBlock">
<div class="spendInner midSpend scaleAnime">
<h4>29%</h4>
<p>of the money is spent on<br>utility bill payments</p>
<div class="spendImg3"></div>
</div>
<hr class="d-block d-sm-none">
</div>
<div class="spendBlock">
<div class="spendInner scaleAnime">
<h4>27%</h4>
<p>on Food and Drinks</p>
<div class="spendImg4"></div>
</div>
<hr>
<div class="spendInner scaleAnime">
<h4>8%</h4>
<p>on their income / allowances<br>on grocery</p>
<div class="spendImg5"></div>
</div>
</div>
</div>
</div>
<div data-content="4" class="content content-millennial">
<div class="millennialWpr">
<div class="millBlock">
<div class="pointMarks scaleAnime">
<div class="blueMark">
Millennial (20-35 age group)
</div>
<div class="clearfix"></div>
<div class="yellowMark">
Rest
</div>
<div class="grayMark">
All India
</div>
</div>
<div class="clearfix"></div>
<div class="millTitleBlock">
<div class="scaleAnime">
<h5 class="millTitle">Household profile</h5>
<p>Millennials households earn more and<br>save more than the genreral population</p>
</div>
<div class="millChartBlock scaleAnime">
<div class="millChartTitle">Household <span>(in Million)</span></div>
<div class="circleChart">
<div class="grayCircle">
281
</div>
<div class="blueCircle">
190
</div>
<div class="yellowCircle">
91
</div>
</div>
</div>
<!-- <br> -->
<hr>
<div class="millChartBlock">
<div class="millChartTitle scaleAnime">Average Household <span>(in ₹ Annual)</span></div>
<div class="circleChartBlockWpr">
<div class="circleChartBlock scaleAnime">
<h4 class="circleH4">Income</h4>
<div class="incomeCircle">
<div class="c1">
<span class="grayTxt1">2,02,076</span>
<span class="yellowTxt1">1,70,149</span>
<span class="blueTxt1">2,17,311</span>
<img src="<?php echo base_url(); ?>assets/images/millennial-pie-1.png" alt="">
</div>
</div>
</div>
<div class="circleChartBlock scaleAnime">
<h4 class="circleH4">Expenditure</h4>
<div class="incomeCircle">
<div class="c1">
<span class="grayTxt1">1,34,561</span>
<span class="yellowTxt1">1,15,001</span>
<span class="blueTxt1">1,43,895</span>
<img src="<?php echo base_url(); ?>assets/images/millennial-pie-2.png" alt="">
</div>
</div>
</div>
</div>
</div>
<!-- <br> -->
<hr>
<div class="millChartBlock">
<div class="millChartTitle scaleAnime">Saving rate</div>
<div class="circleChartBlockWpr">
<div class="circleChartBlock scaleAnime">
<h4 class="circleH4">Income</h4>
<div class="savingCircle">
<div class="c2">
<span class="grayTxt1">34%</span>
<span class="yellowTxt1">32%</span>
<span class="blueTxt1">33%</span>
<img src="<?php echo base_url(); ?>assets/images/millennial-pie-3.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="millBlock">
<div class="millTitleBlock millRight1">
<div class="scaleAnime">
<h5 class="millTitle">OWNERSHIP <span>(% of households own)</span></h5>
<p>Except for mobile phone penetration, millennial households remain large untapped market</p>
</div>
<img src="<?php echo base_url(); ?>assets/images/barchart.png" alt="" class="scaleAnime">
</div>
<div class="millTitleBlock">
<div class="scaleAnime">
<h5 class="millTitle">Education Status</h5>
<p>Millennials are also much<br>better educated</p>
</div>
<div class="millChartBlock">
<div class="circleChartBlockWpr">
<div class="circleChartBlock scaleAnime">
<h4 class="circleH4">Completed<br>Higher Secondary</h4>
<div class="incomeCircle">
<div class="c1">
<span class="grayTxt1">11%</span>
<span class="yellowTxt1">8%</span>
<span class="blueTxt1">17%</span>
<img src="<?php echo base_url(); ?>assets/images/millennial-pie-4.png" alt="">
</div>
</div>
</div>
<div class="circleChartBlock scaleAnime">
<h4 class="circleH4">Graduated and<br>above</h4>
<div class="incomeCircle">
<div class="c1">
<span class="grayTxt1">6%</span>
<span class="yellowTxt1">3%</span>
<span class="blueTxt1">13%</span>
<img src="<?php echo base_url(); ?>assets/images/millennial-pie-5.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<?php $this->load->view('sub_footer'); ?>
</div>
<?php $this->load->view('footer'); ?>
<script type="text/javascript">
(function(){
if($(".content").hasClass("active")) {
startAnim();
}
$('.infoDetailHeader [data-tab]').on('click', function (e) {
var daTaAttr = $(this).data('tab');
$(this).parent().css("background",'url(<?php echo base_url(); ?>assets/images/millennials-' +daTaAttr+ '.png)');
$(this).addClass('active').siblings('[data-tab]').removeClass('active')
$(this).parent().siblings().children('[data-content=' + $(this).data('tab') + ']').addClass('active').siblings('[data-content]').removeClass('active');
$('.scaleAnime').removeClass('animStart');
startAnim();
e.preventDefault();
});
})();
function startAnim(){
setTimeout(function(){
var b = 0;
$(".active .scaleAnime").each(function() {
$(this).css("transition-delay", b + "ms," + b + "ms"), b += 100
});
$('.scaleAnime').addClass('animStart');
});
}
</script>
</body>
</html>