<?php
if(get_theme_mod('luzuk_about_area_disable') != 'on' ){
	?>
	<!-- About Area Start -->
	<?php 
				if( get_theme_mod('about_areaTpadding',true) ) {
					$about_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('about_areaTpadding')).';';
				}
				if( get_theme_mod('about_areaBpadding',true) ) {
					$about_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('about_areaBpadding')).';';
				}
				if( get_theme_mod('about_areawave',true) ) {
					$about_areawave = 'top:'.esc_attr(get_theme_mod('about_areawave')).';';
				}
				?>			
	<div class="about-area bg-img-1" id="about">  
		<div class="container"> 
			<?php
			$about_page_id = get_theme_mod('about_page');
			$abouttitle = get_theme_mod('about_title', 'About Us');
			$abouttext = get_theme_mod('about_text', 'It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters,');
			?>

			
			<div class="col-md-8 about-rhs" data-wow-duration="1s">
				<div class="row">
					<div class="col-xl-6 col-lg-6 col-sm-11 col-xs-12">				
						<?php if($abouttitle){ ?>
						<div class="section-title sec-border">
							<h2><?php echo ($abouttitle);  ?></h2>
						</div>
						<?php }?>
					</div>
			 	</div>		
 				
				<div class="section-subtitle">
					<p><?php echo ($abouttext);  ?></p>
				</div>

				<div class="clearfix"></div>

				<?php
					$showStatic = true;
					for( $i = 1; $i < 11; $i++ ){
						$aboutus_page_id = get_theme_mod('aboutus_page_icon'.$i); 
						$url = get_theme_mod('aboutus_page_url_'.$i, '#');
						$link = get_theme_mod('aboutus_page_link'.$i);
						if(!empty($aboutus_page_id)){
							$showStatic = false;
							break;
						}
					}
				?>

				<div class="aboutus-post-wrap">
					<?php
					$cols = get_theme_mod('aboutus_npp_count', 3);
					$cols++;
					// echo '$cold: '.$cols;
					switch($cols){
						case 1:
						$colCls = 'col-md-6 col-sm-6 col-xs-12';
						break;
						case 2:
						case 4:
						case 8:
						case 7:
						case 10:
						case 11:
						case 12:
						$colCls = 'col-md-6 col-sm-6 col-xs-12';
						break;
						default: 
						$colCls = 'col-md-6 col-sm-6 col-xs-12';
						break;
					}
					$icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
					?>
					<div class="row aboutus-post-boxes">
					<?php
					for( $i = 1; $i <= $cols; $i++ ){
							if($showStatic === false){
								
					$aboutus_page_title = get_theme_mod('aboutus_page_title'.$i, 'Varieties Of Food');
					$aboutus_page_text = get_theme_mod('aboutus_page_text'.$i, 'It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.');
					$aboutus_page_id = get_theme_mod('aboutus_page'.$i); 
					$url = get_theme_mod('aboutus_page_url_'.$i, '#');
					$aboutus_page_icon = get_theme_mod('aboutus_page_icon'.$i);
					if($aboutus_page_icon){
							
					?>
						<div class="<?php echo $colCls;?>">
							<div class="aboutus-single">
								<div class="hi-icon">
									<a href="<?php echo esc_url(!empty($url)?$url:'#');?>"><span class="<?php echo $aboutus_page_icon; ?>"></span></a>
								</div>
								
								<div class="about-area-data">
									<a href="<?php echo esc_url(!empty($url)?$url:'#');?>"><h4><?php echo $aboutus_page_title; ?></h4></a>
									<p><?php echo $aboutus_page_text; ?></p>
								</div>
							</div>
							<div class="clearfix"></div>
						</div>
						<?php
								
						}
					}else{?>
						<div class="<?php echo $colCls;?>">
							<div class="aboutus-single">
								<div class="hi-icon">
									<a href="#"><span class="fa fa-cutlery"></span></a>
								</div>
								<div class="about-area-data">
									<a href="#"><h4>Varieties Of Food</h4></a>
									<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
								</div>
								
								<div class="clearfix"></div>						
							</div>
							<div class="clearfix"></div>
						</div>
					<?php }
						}?>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
			<div class="col-md-4 padding0">
				<div class="aboutarea-img">
					<?php 
					$about_image = get_theme_mod('about_image');
					if(!empty($about_image)){
						echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($about_image).'" class="img-responsive secondry-bg-img" />';
					}else{
						echo '<img alt="About us" src="'.get_template_directory_uri().'/images/about.jpg" class="img-responsive" />';
					}

					?>
					<div class="ab-border"></div>
				</div>
			</div>
			<div class="clearfix"></div>
		</div>
		<div class="clearfix"></div> 
	</div>
	<!-- About Area End -->
<?php }  