<?php get_header(); ?>


<div class="container">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  <div <?php post_class() ?> id="post-<?php the_ID(); ?>">
		
  <?php if ( has_post_thumbnail()) {
  $kp_imgpost = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), "full" );
 }
  else { $kp_imgpost = "";} 
  
  $kp_type = rwmb_meta( 'slant_thumb_type' );
  $kp_image = rwmb_meta( 'slant_thumb_image', 'type=image&size=full' );
  $kp_gallery = rwmb_meta( 'slant_thumb_gallery', 'type=image&size=full' );
  $kp_video_type = rwmb_meta( 'slant_thumb_video_type' );
  $kp_video_id = rwmb_meta( 'slant_thumb_video_id' );
  
  ?> 
       <div class="row">
	      <div class="top-title col-md-12">
                    <h1 data-animated="fadeIn" class="centered"><?php the_title(); ?> </h1>
                    	<div class="breadcrumbs centered"> <?php slant_breadcrumbs(); ?>
						
					<div class="posts-nav">
						<div class="right next"><?php next_post_link('%link',  '%title <i class="fa fa-long-arrow-right"></i>', FALSE); ?> </div>        
						<div class="left prev"><?php previous_post_link('%link',  '<i class="fa fa-long-arrow-left"></i> %title', FALSE); ?></div>
					 </div>   
						
						 <div class="clearfix"></div>
						</div>
                    </div>
         <div class="clearfix"></div>
					
	   
			
			<div class="col-md-8">
			<?php
			if($kp_type == 'image'){
			if ( has_post_thumbnail() ) {
				the_post_thumbnail('full');
			}
			}
			elseif ($kp_type == 'gallery'){ ?>
			  
			 <script>
			jQuery(document).ready(function($) {
				   jQuery("#owl-demo-3").owlCarousel({
					  navigation : true, // Show next and prev buttons
					  slideSpeed : 300,
					  paginationSpeed : 400,
					  singleItem:true,
					  pagination:true,
					  autoPlay : 5000,
					  navigationText : ['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>']
 					 });
			});
		</script>
		
			<?php
			echo'<div  class="folio owl-carousel owl-theme">';
			
			foreach($kp_gallery as $kp_img){
			echo' <div class="item"><img src="'. $kp_img["url"] .'" class="" /></div>';
			}
            
			echo '</div>';
			
			}
			elseif ($kp_type == 'video'){
			wp_enqueue_script( 'fitvids' );
			
			echo '<div class="fitvideo">';
			if($kp_video_type == 'vimeo'){
        	echo '<iframe src="https://player.vimeo.com/video/'.$kp_video_id.'?badge=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'; 
			}
			if($kp_video_type == 'youtube'){
        	echo '<iframe width="500px" height="250" src="https://www.youtube.com/embed/'.$kp_video_id.'" frameborder="0" allowfullscreen></iframe>';
			}
			echo '</div>';
			
			}
			?>
			
           <div class="clearfix"></div>	
			</div><!--colmd8-->			
			<div class="col-md-4">
			
				<div id="post-<?php the_ID(); ?>" <?php post_class("post clearfix"); ?>>
				<p class="portfolio_details"><i class="fa fa-calendar"></i> &nbsp;&nbsp; <?php the_time('d');?>  <?php the_time('M'); ?>  <?php the_time('Y'); ?>
				</p>
				<p> <?php the_content(); ?> </p>	
							
					
						<div class="post-meta portfolio_details">
								<?php
								$kp_item_categories = get_the_terms( $post->ID, 'portfolio-category' );
									 if($kp_item_categories){
									 $i=0;
									 $kp_cats="<ul class='post_cat'>";
									 
									foreach ($kp_item_categories as $kp_cat){
									$kp_cats .='<li>';
									if($i!=0){ $kp_cats .='/ ';}
									$kp_cats .= $kp_cat->name .' ';
									$kp_cats .='</li>';
									$i++;
									}
									$kp_cats .='</ul>';
									}
							?>
							<?php if($kp_item_categories){ ?>
							<div class="single-post-cat">
							<h4>Category :</h4><?php echo $kp_cats; ?> 
							</div>
							<?php } ?>

							</div>
							<div class="clearfix"></div>
							
							<div class="single-post-share">
							<h4>Share :</h4><?php slant_social_sharing_buttons(); ?>
							</div>
							</div><!--Endpost-->	
							
			
				
			</div><!--colmd4--> 
			</div><!--row-->
	</div> <!--end row--> 
	
		<div class="clearfix"></div>

<?php endwhile; endif; ?>

      
              	<div class="clearfix"></div>
               
          
          
          
              
                <?php slant_portfolio_related_posts(); ?>

	<div class="clearfix"></div>
</div>

              	<div class="clearfix"></div>
<?php get_footer(); ?>