{% extends "base.html" %}

{% block head %}
	<meta name="description" content="{{ _("IPFire is a hardened, versatile, state-of-the-art Open Source firewall based on Linux.") }}" />
	<link rel="alternate" type="application/atom+xml" title="RSS" href="/blog/feed.xml" />
{% end block %}

{% block title %}{{ _("Welcome to IPFire") }}{% end block %}

{% block container %}
	{% if latest_release %}
		<div class="bg-light">
			<div class="container text-center small py-2">
				{{ _("Latest Release: %(release)s from %(when)s") \
					% { "release" : latest_release.name, "when" : locale.format_day(latest_release.date, dow=False) } }}

				{% if latest_release.blog %}
					&nbsp;

					<a class="link-dark fw-bold" href="/download/{{ latest_release.slug }}">
						{{ _("Get It Now") }}
					</a>
				{% end %}
			</div>
		</div>
	{% end %}

	<div class="bg-brand">
		<div class="container">
			<h1 class="display-1">{{ _("More Than A Firewall") }}</h1>
			<h4 class="fw-normal">The market leader in Linux based, Open Source security with a comprehensible feature set</h4>
		</div>
	</div>

	<section>
		<div class="container">
			<h2 class="text-center mb-5">
				{{ _("The Open Source Firewall") }}<span class="text-primary">_</span>
			</h2>

			<div class="row">
				<div class="col-12 col-lg-4 mb-3 text-center">
					<span class="fas fa-fire fa-4x bg-light text-primary p-3 mb-2"></span>

					<h4>{{ _("The Right Choice") }}</h4>

					<p class="mb-0">
						The only open source firewall with an active community, leading the market
					</p>
				</div>

				<div class="col-12 col-lg-4 mb-3 text-center">
					<span class="fab fa-osi fa-4x bg-light text-primary p-3 mb-2"></span>

					<h4>{{ _("Free & Open") }}</h4>

					<p class="mb-0">
						Fully open source, complete freedom and for the greater good
					</p>
				</div>

				<div class="col-12 col-lg-4 mb-3 text-center">
					<span class="fas fa-shield-alt fa-4x bg-light text-primary p-3 mb-2"></span>

					<h4>{{ _("Security") }}</h4>

					<p class="mb-0">
						Powerful system, separate applicance, a bit more text here
					</p>
				</div>
			</div>
		</div>
	</section>

	<section>
		<div class="container">
			<div class="card bg-lwl text-white p-5">
				<div class="row flex-lg-row-reverse justify-content-lg-between">
					<div class="col-12 col-lg-3 text-center">
						<img class="img-fluid w-100 my-2" src="{{ static_url("img/lightningwirelabs-logo.svg") }}"
							alt="{{ _("Lightning Wire Labs") }}">
					</div>

					<div class="col-12 col-lg-7 d-flex flex-column align-items-start align-self-center">
						<h4>{{ _("Appliances and Support") }}</h4>

						<p>
							You need someone you can call when things go wrong.
							Partnered with Lightning Wire Labs we offer applicances for enterprise
							and XX businesses.
						</p>

						<a class="btn btn-secondary" href="https://store.lightningwirelabs.com">
							{{ _("Go To Store") }}
						</a>
					</div>
				</div>
			</div>
		</div>
	</section>
{% end block %}