 <?php   
 if(get_theme_mod('team_area_disable') != 'on' ){?>
 <?php 
 	if( get_theme_mod('team_areaTpadding',true) ) {
 		$team_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('team_areaTpadding')).';';
 	}
 	if( get_theme_mod('team_areaBpadding',true) ) {
 		$team_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('team_areaBpadding')).';';
 	}
?>
 <div  class="team-area" id="team" style="<?php echo esc_attr($team_areaTpadding); ?>" "<?php echo esc_attr($team_areaBpadding); ?>">
	<?php			
		$team_subtitle = get_theme_mod('team_subtitle', 'Meet Our');
		$team_title = get_theme_mod('team_title_title', 'Amazing Team');
	?>
	<div class="container">
		<div class="row justify-content-center">
			<?php if($team_title || $team_subtitle){ ?>	
				<div class="section-title">
					<h4><span><?php echo ($team_subtitle);  ?></span></h4>
					<h2><span><?php echo ($team_title);  ?></span></h2>
				</div>
			<?php }?>
		</div>
		<div class="teambx ">
 			<div class="row ">	
		 		<?php 
	 				$showStatic = true;
	 				$cols = get_theme_mod('team_area_npp_count', 2);
	 				$cols++;
	 				switch($cols){
	 					case 1:
						$colCls = 'col-xl-12 col-md-12 col-sm-12 col-xs-12';
						break;
						case 2:	
						$colCls = 'col-xl-12 col-md-6 col-sm-6 col-xs-12';
						break;
						case 3:
						case 5:
						case 6:
						case 9:
						case 11:
						case 13:
						case 15:
						$colCls = 'col-xl-4 col-md-4 col-sm-6 col-xs-12';
						break;
						default: 
						$colCls = 'col-md-4 col-sm-6 col-xs-12';
						break;
	 				}
	 				for( $i = 1; $i <= $cols; $i++ ){
	 					$team_area_page_id = get_theme_mod('team_area_page'.$i); 
	 					$team_area_page_icon = get_theme_mod('team_area_page_icon'.$i);
	 					if($team_area_page_id){
	 						$showStatic = false;
	 						echo teamShortCode($team_area_page_id, $isCustomizer=true, $i);
	 					}
	 				}
	 				if($showStatic === true){
 					for( $i = 1; $i <= $cols; $i++ ){ ?> 
 						<div class="<?php echo $colCls; ?> single-team wow zoomIn">
							<div class="our-team">
								<div class="single-team-img">
									<img src="<?php echo esc_url(get_template_directory_uri().'/images/team.jpg');?>" alt="Team" />
								</div>
								<div class="team-text">
									<h4 class="inner-area-title wow fadeInLeft" data-wow-duration="1s">WILLIAM SON</h4>
									<div class=" team-designation wow fadeInLeft" data-wow-duration="2s">Web Developer</div>
									<div class="team-social-icon">
										<li>
											<a target="_blank" href="http://facebook.com" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-facebook"></i></a>
										</li>
										<li>
											<a target="_blank" href="http://twitter.com" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-twitter"></i></a>
										</li>
										<li>
											<a target="_blank" href="http://instagram.com" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-instagram"></i></a>
										</li>
										<li>
											<a target="_blank" href="https://pinterest.com/" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a>
										</li>
										<li>
											<a target="_blank" href="https://www.linkedin.com/" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
										</li>
										<div class="clearfix"></div>
									</div>
								</div>
								<div class="clearfix"></div>
							</div>
							</div> 
						<?php 
						}
					} ?>
				</div>
 			</div>
 		</div>	
 	</div>
<?php }