{% assign file = page.fileName %}
{% assign lang = page.lang %}
{% assign folder = page.folderName %}
{% assign homeData= site.data[folder][lang][file] %}
<!DOCTYPE html>
<html lang="{{homeData.htmlLangAtt}}">
{% include head/index.html %}
<body>
	{% include header/index.html %}
	{%- include dropdown/langdropdown.html -%}
	{%- if homeData.nofileupload -%}
	<div class="alert alert-{{featureData.variant | default: 'warning'}} alert-dismissible fade show text-center" role="alert">
		<img src="/assets/secure.svg" height="23px" width="18px" alt="secure"> &nbsp;
		{%- if featureData.alertmsg -%}
		 {{featureData.alertmsg}}
		 {%- else -%}
		 We don't upload your files on server ,your data is 100% secure.
		{%- endif -%}  &nbsp;
	 <img src="/assets/noserverupload.svg" height="23px" width="20px" alt="no server upload">
		<button type="button" class="close" data-dismiss="alert" aria-label="Close">
		  <span aria-hidden="true">&times;</span>
		</button>
	  </div>
	{%- endif -%}
	{%- if homeData.h1 or homeData.h2 -%}
	<div class="flex-container">
		<div class="flex-class py-5">
				<h1 class="home-top-h1">{{homeData.h1}}</h1>
				<h2 class="home-top-h2">{{homeData.h2}}</h2>
		</div>
	</div>
	{%- endif -%}
	{%- if homeData.features -%}
	<div class="flex-container">
		<div class="flex-class">
			<ul class="home-features">
				{% for product in homeData.features %}
				<li style=background:{{product.color}} class="home-feature-box">
					<div class="home-inner-box">
						<div class="div-cont feature-img" height="36px" width="36px" >
							<img src="{{product.icon}}" height="36px" width="36px" alt="star icon">
						</div>
					</div>
					<div class="home-feature-desc">{{product.description}}</div><a
						class="home-feature-name" href="{{product.url}}">{{product.name}}</a>
				</li>
				{% endfor %}
			</ul>
		</div>
	</div>
	{%- endif -%}
	<div>
		{{content}}
	</div>
	{%- if homeData.TEXTUAL_CONTENT -%}
	<div class="container mt-4">
		<div class="row px-0">
			{% for data in homeData.TEXTUAL_CONTENT %}
			<div class="col-lg-4 col-md-6 my-4">
					<div><img class="feature-card-img"  height="48px" width="48px" loading="lazy" src="{{data.logoUrl}}"
							alt={{data.header}}>
						<div class="feature-card-title">{{data.header | replace: "$variable", page.value}}</div>
						<div class="feature-card-desc">{{data.content | replace: "$variable", page.value}}</div>
					</div>
				</div>
					{% endfor %}
			</div>
		</div>
	{%- endif -%}
	{%- if homeData.HOW_TO_CONTENT -%}
	<div class="d-flex justify-content-center mt-5 mb-5" id="__cond-1011327">
		<div class="flex-container pb-5">
			<div class="flex-class">
				<div class=" d-flex flex-wrap justify-content-center">
					{%- if homeData.HOW_TO_CONTENT.logoImageUrl -%}
					<div class="how-to-img-wrapper "><img class="how-to-leftimg" loading="lazy"  height="215px" width="100%"
						src="{{homeData.HOW_TO_CONTENT.logoImageUrl}}" alt="{{homeData.HOW_TO_CONTENT.logoImageAlt}}">
				</div>
					{%- endif -%}
					<div class="how-to-right">
						<h3 class="how-to-title">{{homeData.HOW_TO_CONTENT.heading | replace: "$variable",
							page.value}}</h3>
						<ol class="how-to-list">
							{% for data in homeData.HOW_TO_CONTENT.steps %}
							<li id="step{{forloop.index}}" class="how-to-list-item">{{data | replace: "$variable", page.value}}</li>
							{% endfor %}
						</ol>
					</div>
				</div>
			</div>
		</div>
</div>

	{%- endif -%}
{%- if homeData.FAQ -%}
<div class="container">
	<div class="row">
		<div class="col-md-8 mx-auto">
			<div class="faq">
				{%- if homeData.FAQ.size>0 -%}
					<h2 class="feature-h1 text-center">Frequently Asked Questions</h2>
					{%- endif -%}
				<ul class="list-unstyled">
					{% for data in homeData.FAQ %}
					<li>
						<h3 class="faq-question" itemprop="name">{{data.question | replace: "$variable", page.value}}<em
								style="transform: rotate(-135deg);">
								<i></i></em>
						</h3>
						<div style="display: block;">
							<p class="faq-answer" itemprop="text">{{data.answer | replace: "$variable", page.value}}</p>
						</div>
					</li>
					<hr>
					{% endfor %}
				</ul>
		</div>
		</div>
	</div>

</div>
{%- endif -%}
{%- include share/socialshare.html -%}
{%- include Rating/rating.html -%}
{%- if page.categories or page.tags-%}
{%- include section/related_categories_post.html -%}
{%- else -%}
{%- include section/recent_posts.html -%}
{% endif %}
{%- if homeData.display_formats -%}
	<div class="container px-md-5 file-detail-table ">
		<div class="px-md-4">
			{%- include fileformat/fileformatdetail.html -%}
		</div>
	</div>
	{%- endif -%}
	{%- if homeData.compare_formats -%}
	<div class="container compare-table ">
		{%- include fileformat/comparisonfiles.html -%}
	</div>
	{%- endif -%}
	{%- if homeData.USP_Heading or homeData.USPS  -%}
	<div class="container">
		{%- include /Usp/usp.html -%}
	</div>
	{%- endif -%}
{% include footer/index.html %}  
{% include script.html %}
</body>

</html>