<?php
/**
 *
 * @package Luzuk
 */

if(get_theme_mod('membership_section_disable') != 'on' ){
	
	?>
	<?php 
		if( get_theme_mod('sec_membershipTpadding',true) ) {
			$sec_membershipTpadding = 'padding-top:'.esc_attr(get_theme_mod('sec_membershipTpadding')).';';
		}
		if( get_theme_mod('sec_membershipBpadding',true) ) {
			$sec_membershipBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('sec_membershipBpadding')).';';
		}
		if( get_theme_mod('sec_membershipLpadding',true) ) {
			$sec_membershipLpadding = 'padding-left:'.esc_attr(get_theme_mod('sec_membershipLpadding')).';';
		}
		if( get_theme_mod('sec_membershipRpadding',true) ) {
			$sec_membershipRpadding = 'padding-right:'.esc_attr(get_theme_mod('sec_membershipRpadding')).';';
		}
	?>
	<section id="membership-section" class="ht-section wow bounceInRight"  style="<?php echo esc_attr($sec_membershipTpadding); ?>" "<?php echo esc_attr($sec_membershipBpadding); ?>">
		<!-- <div class="wow bounceInRight" data-wow-duration="0s">  --> 
			<div class="container"> 
		<!-- <div class="lightbox wow flipInY"> -->
				<?php
				$showStatic = true;
				for( $i = 1; $i < 3; $i++ ){
					$url = get_theme_mod('luzuk_membership_page_url_'.$i, '#');
					$link = get_theme_mod('luzuk_membership_page_link'.$i);
					$luzuk_membership_page_id = get_theme_mod('luzuk_membership_page_icon'.$i); 
					if(!empty($luzuk_membership_page_id)){
						$showStatic = false;
						break;
					} 
				}
				$membership_title = get_theme_mod('membership_title', '<span>Our </span>Membership');
				$membership_subtitle = get_theme_mod('membership_subtitle', 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has industry,s.');
				?>
				<div class="row justify-content-center">
					<?php if($membership_title || $membership_subtitle) { ?>
					<div class="col-xl-6 col-lg-6 col-sm-8">
						<div class="section-title">
							<h2><?php echo ($membership_title);  ?></h2>
							<p><?php echo ($membership_subtitle);  ?></p>
							
						</div>
					</div>
					<?php }?>
				</div>
				<div class="clearfix"></div>
				
			<!-- </div> -->
			

				<!-- <div class="row"> -->	
					<div class="membership-post-wrap">
						<?php
						$cols = get_theme_mod('luzuk_membership_npp_count', 2);
						$cols++;
							// echo '$cold: '.$cols;
						switch($cols){
							case 1:
							$colCls = 'col-md-12 col-sm-12 col-xs-12';
							break;
							case 2:
							$colCls = 'col-md-6 col-sm-6 col-xs-12';
							break;
							case 3:
							case 5:
							case 6:
							case 9:
							$colCls = 'col-md-4 col-sm-6 col-xs-12';
							break;

							case 4:
							case 7:
							case 8:
							case 10:
							case 11:
							case 12:
							$colCls = 'col-md-3 col-sm-6 col-xs-12';
							break;

							default: 
							$colCls = 'col-md-4 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 membership-post-boxes">
							<?php
							for( $i = 1; $i <= $cols; $i++ ){
								if($showStatic === false){
									$url = get_theme_mod('luzuk_membership_page_url_'.$i, '#');

							$membership_page_title = get_theme_mod('membership_page_title_'.$i, 'Business Tour');
							$membership_place = get_theme_mod('membership_place_'.$i, 'Suzhou-China');
							$membership_price = get_theme_mod('membership_price_'.$i, 'From- <b>$199</b>');

							$luzuk_membership_page_id = get_theme_mod('luzuk_membership_page'.$i); 
							$luzuk_membership_page_icon = get_theme_mod('luzuk_membership_page_icon'.$i);
									if($luzuk_membership_page_icon){

										?>
										<div class="<?php echo $colCls;?> " data-wow-duration="2s">
											<div class="mem-inn">
												<figure class="pc-ser-box">
													
													<img src="<?php echo esc_url($luzuk_membership_page_icon); ?>" class="img-responcive" />
													<a Class="group1" href="<?php echo esc_url(!empty($url)?$url:'#');?>"></a>
												</figure>
												<div class="membership-content">
													<a Class="group1" href="<?php echo esc_url(!empty($url)?$url:'#');?>">
														<h3 class="title"><?php echo $membership_page_title; ?></h3>
													</a>
													
													<div class="col-md-5 pd-0">
														<i class="fa fa-map-marker"></i><?php echo $membership_place; ?>
													</div>
													<div class="col-md-7">
														<?php echo $membership_price; ?>
													</div>
													<div class="clearfix"></div>
												</div>
												<div class="clearfix"></div>
											</div>
											<div class="clearfix"></div>
										</div>
										<?php

									}
								}else{?>
									<div class="<?php echo $colCls;?>" data-wow-duration="2s">
										<div class="mem-inn">
											<figure class="pc-ser-box">
												
												<img src="<?php echo esc_html(get_template_directory_uri()); ?>/images/membership01.jpg" class="img-responcive" />
												<a Class="group1" href="#"></a>
											</figure>
											<div class="membership-content">
												<a href="<?php echo esc_url(!empty($url)?$url:'#');?>">
													<h3 class="title">Business Tour</h3>
												</a>
												
												<div class="col-md-5 pd-0">
													<i class="fa fa-map-marker"></i>Suzhou-China
												</div>
												<div class="col-md-7">
													From- <b>$199</b>
												</div>
												<div class="clearfix"></div>
											</div>
											<div class="clearfix"></div>
										</div>
										<div class="clearfix"></div>
									</div>
								<?php }

							}?>
							<div class="clearfix"></div>
						</div>
					</div>
					<div class="clearfix"></div>
				<!-- </div> -->
				
			</div>
			<div class="clearfix"></div>
		<!-- </div> -->

	</section> 
	<script>
		jQuery.noConflict();
		$(function(){
			function meminnHeight(){
				var ht = 0;
				$('section#membership-section .mem-inn').each(function(i){
					var tHt = $(this).height();
					if(ht<tHt){
						ht=tHt;
					}
				});
				$('section#membership-section .mem-inn').height(ht+'px');
			}
			meminnHeight();
		});
		$( window ).resize(function(){
			meminnHeight();
		});
	</script>
<?php } 