<?php
if(get_theme_mod('about_area_disable') != 'on' ){
?>
	<?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" id="about">
		<div class="about-mainbx">
			<?php
				$about_page_id = get_theme_mod('about_page');
				$aboutleftimgtitle = get_theme_mod('aboutleftimg_title', 'YOUR CLOTH');
				$aboutrghtimgtitle = get_theme_mod('aboutrghtimg_title', 'ABOUT US');
				$facebook = get_theme_mod('app_fb', '//facebook.com/');
				$instagram = get_theme_mod('app_insta', 'https://www.instagram.com/');
				$twitter = get_theme_mod('app_tw', '//twitter.com/');
				$pinterest = get_theme_mod('app_ytube', 'https://www.pinterest.com/');
				$abouttitle = get_theme_mod('about_title', 'Curating Trends, Celebrating Individuality');
				$abouttext = get_theme_mod('about_text', 'Porttitor pharetra sollicitudin at tempus phasellus consequat ultrices class sed, quisque non hac diam porta himenaeos fringilla scelerisque, nibh tellus sociosqu molestie conubia sodale.');
				$aboutlist = get_theme_mod('about_list', '<li>Our Mission </li> <li>Sustainable Practices </li> <li>Vision for Fashion </li> <li>Style for Every Story</li> ');
				$abtbtntxt = get_theme_mod('abtbtntxt', 'Read More'); 
				$abtbtnlink = get_theme_mod('abtbtnlink', 'add link here');
			?>
			<div class="container">
				<div class="about-area-bx">
					<div class="row mr-0">
						<div class="col-lg-6 col-md-12 wow zoomIn">
							<div class="row">
								<div class="col-xl-6 col-lg-6 col-md-6 col-sm-6 aboutarea-imgleftbx">
									<div class="about-content">
										<div class="about-lefttext">
											<h3><?php echo ($aboutleftimgtitle);  ?></h3>
										</div>
										<?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/abotimg1.jpg" class="img-responsive" />';
											}
										?>
										<div class="s-media">
											<?php if(!empty($twitter)){ ?>
												<li><a href="<?php echo $twitter ?>" title="Twitter" class="site-button sharp" target="_blank"><i class="fa-brands fa-x-twitter"></i></a></li>
											<?php }?>
											<?php if(!empty($instagram)){ ?>
												<li><a href="<?php echo $instagram ?>" title="Instagram" class="site-button sharp" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
											<?php }?>
											<?php if(!empty($facebook)){ ?>
												<li><a href="<?php echo $facebook ?>" title="Facebook" class="site-button sharp" target="_blank"><i class="fa fa-facebook"></i></a></li>
											<?php }?>
											<?php if(!empty($pinterest)){ ?>
												<li><a href="<?php echo $pinterest ?>" title="pinterest" class="site-button sharp" target="_blank"><i class="fa fa-pinterest-square"></i></a></li>
											<?php }?>
											<div class="clearfix"></div>
										</div>
									</div>
								</div>
								<div class="col-xl-6 col-lg-6 col-md-6 col-sm-6 aboutarea-imgrghtbx">
									<div class="about-content">
										<div class="about-rghttext">
											<h3><?php echo ($aboutrghtimgtitle);  ?></h3>
										</div>
										<?php 
											$about_image1 = get_theme_mod('about_image1');
											if(!empty($about_image1)){
												echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($about_image1).'" class="img-responsive secondry-bg-img" />';
											}else{
												echo '<img alt="About us" src="'.get_template_directory_uri().'/images/abotimg2.jpg" class="img-responsive" />';
											}
										?>
									</div>
								</div>
							</div>
						</div>
						<div class="col-lg-6 col-md-12 wow zoomIn" data-wow-duration="1s">
							<div class="abt-rbx">
								<div class="section-title">
									<?php if($abouttitle){ ?>	
										<h2><?php echo ($abouttitle);  ?></h2>
									<?php }?>
								</div>
								<div class="section-subtext">
									<p><?php echo ($abouttext);  ?></p>
								</div>
								<div class="section-list">
									<?php echo ($aboutlist);  ?>
								</div>
								<?php
									$showStatic = true;
									for( $i = 1; $i < 11; $i++ ){
										$aboutus_page_id = get_theme_mod('aboutus_page_icon'.$i); 
										if(!empty($aboutus_page_id)){
											$showStatic = false;
											break;
										}
									}
								?>
								<div class="aboutus-post-wrap">
									<?php
									$cols = get_theme_mod('aboutus_npp_count', 1);
									$cols++;
									// echo '$cold: '.$cols;
									switch($cols){
										case 1:
										$colCls = 'col-lg-6 col-md-12 col-sm-12';
										break;
										case 2:
										case 4:
										case 8:
										case 7:
										case 10:
										case 11:
										case 12:
										$colCls = 'col-lg-6 col-md-6 col-sm-6';
										break;
										default: 
										$colCls = 'col-lg-6 col-md-6 col-sm-6';
										break;
									}
									$icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
									?>
									<div class="aboutus-post-boxes">
										<div class="row mr-0">
									<?php
									for( $i = 1; $i <= $cols; $i++ ){
									if($showStatic === false){
										
										$aboutus_page_title = get_theme_mod('aboutus_page_title'.$i, 'Delivery to all regions');
										$aboutus_page_text = get_theme_mod('aboutus_page_text'.$i, 'Porttitor pharetra sollicitudin at tempus phasellus consequat');
										$aboutus_page_id = get_theme_mod('aboutus_page'.$i); 
										$aboutus_page_icon = get_theme_mod('aboutus_page_icon'.$i);
										if($aboutus_page_icon){
											
									?>
										<div class=" <?php echo $colCls;?> aboutus-single wow zoomIn  pl-0" >
											<div class="row mr-0">
												<?php if($aboutus_page_title){ ?>
												<div class="col-xl-1 col-lg-1 col-md-2 pd-0">
													<div class="hi-icon">
														<!-- <img src="<//?php echo esc_url($aboutus_page_icon); ?>" class="img-responcive" /> -->
														<span class="<?php echo $aboutus_page_icon; ?>"></span> 
													</div>
												</div>
												<div class="col-xl-11 col-lg-11 col-md-10">
													<div class="about-area-data">
														<h4 class="inner-area-title"><?php echo $aboutus_page_title; ?></h4>
														<p><?php echo $aboutus_page_text; ?></p>
													</div>
												</div>
												<div class="clearfix"></div>
												<?php }?>
											</div>
											<div class="clearfix"></div>
										</div>
									<?php
									}
									}else{?>
										<div class="<?php echo $colCls;?> aboutus-single wow zoomIn pl-0" >
											<div class="row mr-0">
												<div class="col-xl-1 col-lg-1 col-md-2 col-sm-2 pd-0">
													<div class="hi-icon">
														<span class="fa fa-truck" aria-hidden="true"></span>
														<!-- <img src="<//?php echo esc_url(get_template_directory_uri().'/images/abt1.jpg');?>"  /> -->
													</div>
												</div>
												<div class="col-xl-11 col-lg-11 col-md-10 col-sm-10">
													<div class="about-area-data">
														<h4 class="inner-area-title">Delivery to all regions</h4>
													</div>
													<p>Porttitor pharetra sollicitudin at tempus phasellus consequat</p>
												</div>
												<div class="clearfix"></div>	
											</div>				
											<div class="clearfix"></div>
										</div>
									<?php }
									}?>
									<div class="clearfix"></div>
									</div>
								</div>
							</div>
							<div class="abt-btn btn1">
								<?php if(!empty($abtbtntxt)){ ?>
									<a href="<?php echo $abtbtnlink ?>">
										<span><?php echo ($abtbtntxt);  ?></span>
									</a>
								<?php }?> 
							</div>
						</div>
					</div>
					<div class="clearfix"></div>
				</div>
			</div>
		</div>
	</div>
</div>
<?php }  