 <?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">
 		<?php			
 			$team_title = get_theme_mod('team_title_title', 'Our Team');
 			$team_subtitle = get_theme_mod('team_subtitle', 'Meet My Team');
 		?>
	<div class="container">
		<div class="row justify-content-center">
			<?php if($team_title || $team_subtitle ){ ?>	
			<div class="section-title">
					<h2><?php echo ($team_title); ?></h2>
					<h3><?php echo ($team_subtitle); ?></h3>
			</div>
			<?php }?>
		</div>
	</div>
	<div class="container">
		<div class="teambx ">
			<div class="row ">	
			<?php 
				$showStatic = true;
				$cols = get_theme_mod('team_area_npp_count', 3);
				$cols++;
				switch($cols){
					case 1:
					$colCls = 'col-lg-12 col-md-12 col-sm-12';
					break;
					case 2:	
					$colCls = 'col-lg-6 col-md-6 col-sm-6';
					break;
					case 3:
					case 5:
					case 6:
					case 9:
					case 11:
					case 13:
					case 15:
					$colCls = 'col-lg-4 col-md-6 col-sm-6';
					break;
					default: 
					$colCls = 'col-lg-3 col-md-6 col-sm-6';
					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"> 
				<!-- <div class="item single-team"> -->
					<div class="our-team ">
						<div class="teamimg">
							<div class="single-team-img">
								<img src="<?php echo esc_url(get_template_directory_uri().'/images/team.jpg');?>"/>
							</div>
						</div>
						<div class="team-text">
							<h4 class="inner-area-title wow fadeInLeft" data-wow-duration="1s">Martha T. Saenz</h4>
							<div class=" team-designation wow fadeInLeft" data-wow-duration="2s">Plumber worker</div>
							<div class="team-social-icon">
                                <a target="_blank" href="http://facebook.com" class="wow fadeInDown" data-wow-duration="1s"><i class="fa fa-facebook"></i></a>
                                <a target="_blank" href="http://twitter.com" class="wow fadeInDown" data-wow-duration="2s"><i class="fa-brands fa-x-twitter"></i></a>
                                <a target="_blank" href="http://instagram.com" class="wow fadeInDown" data-wow-duration="3s"><i class="fa fa-instagram"></i></a>
                                <a target="_blank" href="https://in.pinterest.com/" class="wow fadeInDown" data-wow-duration="4s"><i class="fa fa-pinterest-p"></i></a>
                                <!-- <a target="_blank" href="http://linkedin.com" class="wow fadeInDown" data-wow-duration="5s"><i class="fa fa-linkedin"></i></a> -->
                                <div class="clearfix"></div>
                            </div> 
						</div>
						<div class="clearfix"></div>
					</div>
				</div>  
				<?php 
				}
			} ?>
			</div>
		</div>
	</div>	
</div>

<?php }
