<div class="">
		<section class="com_pd_tb {{ $index > 0 ? 'fadeInUp' : ''}}" ng-repeat="data in galleries track by $index | orderBy: customCategoryOrder" ngcloak  ng-class-odd="'odd'" ng-class-even="'white_bg'" ng-if="!data.child[0].sub_child">
			<div class="col-md-10 col-md-offset-1">
				<h2 class="font_28 text-center lato-font galry_title">
					<span>{{data.title}}</span>
				</h2>
				<div class="slider responsive row">
				  <slick dots="false" infinite="false" speed="300" slides-to-show="{{mainslidercount}}" touch-move="false" slides-to-scroll="1">
					<div ng-repeat="childdata in data.child | orderBy: customCategoryOrder" ng-if="childdata.sub_child.length == 0" ngcloak>
						<div class="box" >
							<div class="image img_loader">
								<a  ng-click="veLightBox(childdata)" ng-title="{{childdata.title}}" ng-class="'{{childdata.slug}} full-link'">&nbsp;</a>
								<img src="{{childdata.image}}" alt="{{childdata.title ? childdata.title : data.title}}" ng-if="childdata.image"/>
								<div class="hover-info openGallery" href="{{childdata.image}}" ng-href="{{childdata.image}}" ng-title="{{childdata.title}}">
									<div class="d-table">
										<span class="expand"></span>
									</div>
								</div>
							</div>
							<h3 class="font_16 font_wt_500 text-uppercase text-center" ng-bind-html="to_trusted(childdata.title)"></h3>
						</div>
					</div>
				  </slick>
				</div>
			</div>
			<div class="clearfix"></div>
		</section>
		<!-- events-virtualemployee -->
		<section class="com_pd_tb white_bg" ng-repeat="data in galleries | orderBy: customCategoryOrder" ngcloak ng-if="data.child[0].sub_child">
			<div class="col-md-10 col-md-offset-1">
				<h2 class="font_28 text-center lato-font galry_title">
					<span>{{data.title}}</span>
				</h2>
				<!--<div class="filter" data-filter="all">ALL</div>-->
				<ul class="years-tab lato-font font_18 text-center">
					<li class="{{childdata.slug}} {{$first && isActiveTab('') ? 'active' : ''}}" ng-click="activeLiFunc(childdata.slug)" ng-repeat="childdata in data.child | orderBy: customCategoryOrder" ng-class="{active:isActiveTab(childdata.slug)}">{{childdata.title}}</li>
				</ul>
				<div ng-repeat="schilddata in data.child | filter: {'slug':  activeYearEvent ? activeYearEvent : data.child[0].slug}: true | orderBy: customCategoryOrder" ngcloak>
					<slick dots="false" infinite="false" speed="300" slides-to-show="{{mainslidercount}}" touch-move="false" slides-to-scroll="1">
					<div class="{{schilddata.slug}}" ng-repeat="subchilddata in schilddata.sub_child | orderBy: customCategoryOrder" ngcloak>  
					<div class="box">
						<div class="image img_loader">
							 <a title="{{subchilddata.title}}"  ng-click="veLightBox(subchilddata)"  rel="{{subchilddata.slug}}" class="full-link">&nbsp;</a>
							<img src="{{subchilddata.image}}"  alt="{{subchilddata.title}}"  ng-if="subchilddata.image"/>
							<div class="hover-info">
								<div class="d-table">
								<span class="expand"></span> 
								</div>								
							</div>
						</div>
						<h3 class="font_16 font_wt_500 text-uppercase text-center" ng-bind-html="to_trusted(subchilddata.title)"></h3>
					</div>
					</div>
					</slick>
				</div>
			</div>
			<div class="clearfix"></div>
		</section>
<!-- End events-virtualemployee -->		
<!-- Start Gallery lightbox popup -->
<div ng-click="veLightBoxClose()" class="closePopUpSlides">X</div> 	
 <div ng-class="{'activePopUpSlides' : activeslides}" ng-if="activeslides" ng-attr-id="{{velightstyle}}">
	<div class="overlay"></div>
	<div ng-click="veLightBoxWhite(velightstyle)" style="font-size: 34px; left: 4%;position: absolute;color: #fff;top: 3%; cursor: pointer;">
		<p ng-if="velightstyle=='whiteslider'" ng-class="hide">Black Style</p>
		<p ng-if="velightstyle==''">White Style</p></div> 
	<div class="con">
		<div class="vesliderarea container">
			<div class="gallery-title" ng-bind="activeslides.title"></div>
			<div class="vesliderdesc" ng-if="mainslidercount > 1 " ng-bind-html="to_trusted(activeslides.description)"></div>
				<div class="veslider">
				<slick infinite="false" slides-to-show="1" slides-to-scroll="1" as-nav-for=".slider-nav" class="slider-for" arrows="false" fade="true">
					<div ng-repeat="postdata in activeslides.posts | orderBy: 'menu_order'" ng-attr-id="{{postdata.id}}" class="img_loader" ng-if="activeslides.posts"> 
					<img ng-src="http://www.virtualemployee.co.in/ve-galleries/{{postdata.image}}"  alt="{{postdata.title}}" class="img-responsive">
					<div class="caption" ng-bind-html="to_trusted(postdata.title)"></div>
					</div>
				</slick>
				</div>
				<div class="thumbveslider">
				<slick infinite="false" slides-to-show="{{slidercount}}" slides-to-scroll="1" as-nav-for=".slider-for" class="slider-nav" center-mode="false" focus-on-select="true" autoplay="true" pause-on-hover="true">
					<div ng-repeat="postdata in activeslides.posts | orderBy: 'menu_order'" ng-attr-id="{{postdata.id}}" class="img_loader" ng-if="activeslides.posts"> 
					<img ng-src="http://www.virtualemployee.co.in/ve-galleries/{{postdata.image}}"  alt="{{postdata.title}}" class="img-responsive">
					</div>
				</slick>
				</div>		
			</div>		
		</div>
	</div>
<!-- End Gallery lightbox popup -->	
</div>

