{% if not page %}
	
{% else %}
    {% set style = node.field_portfolio_style.value %}
    {% if style is empty %}
    	{% set style = fullwidth %}
    {% endif %}
    {% if style == 'parallax' %}
		<div class="parallax vertical-align" data-parallax-bg-image="{{ file_url(node.field_images.0.entity.fileuri) }}" data-parallax-speed="1" data-parallax-direction="down">
			<div class="parallax-overlay bg-opacity-1">
				<div class="container sec-more-padding-1">
					<div class="row">
						<div class="text-box padding-percent-2">
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="clearfix"></div>
		<!-- end section -->
		<section class="sec-padding">
			<div class="container">
				<div class="row">
					
					<div class="col-md-6">
						<ul class="port-project-info">
							<li><span>{{ 'Project by'|t }}:</span> {{ node.field_author.value }}</li>
							<li><span>{{ 'date'|t }}:</span> {{ node.getCreatedTime|date('d F Y') }}</li>
							<li><span>{{ 'Skills'|t }}:</span> {{ node.field_skills.value }}</li>
							<li><span>{{ 'Client'|t }}:</span>{{ node.field_client.value }}</li>
							<li><span>{{ 'Website'|t }}:</span> <a href="{{ node.field_website.uri }}" class="primary">{{ node.field_website.title }}</a></li>
						</ul>
						<div class="clearfix"></div>
						{{ node.field_social_network.value|raw }}
					</div>
					<!--end item-->
					<div class="col-md-6">
						<h3 class="uppercase font-weight-7">{{ 'Project description'|t }}</h3>
						{{ content.body }}
					</div>
					<!--end item-->
				</div>
			</div>
		</section>
	{% elseif style == 'fullwidth' %}
		<section>
			<div class="container-fulid">
				<div class="row nopadding">	
					<div class="col-md-12 nopadding">
						<img src="{{ file_url(node.field_images.0.entity.fileuri) }}" alt="{{ node.title.value }}" class="img-responsive" />
					</div>
					<!--end item-->
					
					<div class="clearfix margin-bottom-5"></div>
					
					<div class="col-md-6">
						<ul class="port-project-info">
							<li><span>{{ 'Project by'|t }}:</span> {{ node.field_author.value }}</li>
							<li><span>{{ 'date'|t }}:</span> {{ node.getCreatedTime|date('d F Y') }}</li>
							<li><span>{{ 'Skills'|t }}:</span> {{ node.field_skills.value }}</li>
							<li><span>{{ 'Client'|t }}:</span>{{ node.field_client.value }}</li>
							<li><span>{{ 'Website'|t }}:</span> <a href="{{ node.field_website.uri }}" class="primary">{{ node.field_website.title }}</a></li>
						</ul>
						<div class="clearfix"></div>
						{{ node.field_social_network.value|raw }}
					</div>
					<!--end item-->
					<div class="col-md-6">
						<h3 class="uppercase font-weight-7">{{ 'Project description'|t }}</h3>
						{{ content.body }}
					</div>
					<!--end item-->
				</div>
			</div>
		</section>
	{% elseif style == 'carousel' %}
		<section class="sec-padding">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div id="owl-demo8" class="owl-carousel owl-theme">
						{% for img in node.field_images %}
							<div class="item"><a href="{{ file_url(img.entity.fileuri) }}" data-lightbox="gallery"><img src="{{ file_url(img.entity.fileuri) }}" alt="{{ img.alt }}"></a></div>
						{% endfor %}
						</div>
					</div>
					<!--end item-->
				</div>
			</div>
		</section>
	{% elseif style == 'left_sidebar' or style == 'right_sidebar' %}
		<div class="col-md-12">
        	<img src="{{ file_url(node.field_images.0.entity.fileuri) }}" alt="{{ node.title.value }}" class="img-responsive"/>                           
        </div>
        <!--end item-->
        <div class="col-divider-margin-4"></div>
		<div class="col-md-12">
			<ul class="port-project-info">
				<li><span>{{ 'Project by'|t }}:</span> {{ node.field_author.value }}</li>
				<li><span>{{ 'date'|t }}:</span> {{ node.getCreatedTime|date('d F Y') }}</li>
				<li><span>{{ 'Skills'|t }}:</span> {{ node.field_skills.value }}</li>
				<li><span>{{ 'Client'|t }}:</span>{{ node.field_client.value }}</li>
				<li><span>{{ 'Website'|t }}:</span> <a href="{{ node.field_website.uri }}" class="primary">{{ node.field_website.title }}</a></li>
			</ul>
			<div class="clearfix"></div>
			{{ node.field_social_network.value|raw }}
		</div>
		<!--end item-->

		<div class="clearfix"></div>
		<br/>
		<div class="col-md-12">
			<h4 class="uppercase font-weight-7">{{ 'Project description'|t }}</h4>
			{{ content.body }}
		</div>
		<!--end item-->
	{% elseif style == 'video' %}
		<section class="sec-padding">
			<div class="container">
				<div class="row">
					<div class="col-md-12 margin-bottom-5">
						<iframe src="https://www.youtube.com/embed/{{ node.field_youtube_video_id.value }}" frameborder="0" allowfullscreen class="youtube-video-respo"></iframe>
					</div>
					<!--end item-->
					<div class="col-md-6">
						<ul class="port-project-info">
							<li><span>{{ 'Project by'|t }}:</span> {{ node.field_author.value }}</li>
							<li><span>{{ 'date'|t }}:</span> {{ node.getCreatedTime|date('d F Y') }}</li>
							<li><span>{{ 'Skills'|t }}:</span> {{ node.field_skills.value }}</li>
							<li><span>{{ 'Client'|t }}:</span>{{ node.field_client.value }}</li>
							<li><span>{{ 'Website'|t }}:</span> <a href="{{ node.field_website.uri }}" class="primary">{{ node.field_website.title }}</a></li>
						</ul>
						<div class="clearfix"></div>
						{{ node.field_social_network.value|raw }}
					</div>
					<!--end item-->
					<div class="col-md-6">
						<h3 class="uppercase font-weight-7">{{ 'Project description'|t }}</h3>
						{{ content.body }}
					</div>
					<!--end item-->	
				</div>
			</div>
		</section>
    {% endif %}
{% endif %}