<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Title }}{{ end }}">
    <meta name="keywords" content="">
    <title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}</title>
    <!-- Favicon -->
    <link href="/assets/images/favicon.png" rel="shortcut icon">
    <!-- CSS -->
    <link href="/assets/plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="/assets/plugins/owl-carousel/owl.carousel.min.css" rel="stylesheet">
    <link href="/assets/plugins/owl-carousel/owl.theme.default.min.css" rel="stylesheet">
    <link href="/assets/plugins/magnific-popup/magnific-popup.min.css" rel="stylesheet">
    <link href="/assets/plugins/scrollcue/scrollcue.css" rel="stylesheet">
    <link href="/assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet">
    <link href="/assets/css/theme.css" rel="stylesheet">
    <!-- Fonts/Icons -->
    <link href="/assets/plugins/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
    <link href="/assets/plugins/font-awesome/css/all.css" rel="stylesheet">
</head>
<body data-preloader="1">
    <!-- Header -->
    <div class="header center header-color-dark">
        <div class="container">
            <!-- Logo -->
            <div class="header-logo">
                <h3 class="uppercase letter-spacing-1"><a href="/">{{ .Site.Title }}</a></h3>
            </div>
            <!-- Menu -->
            <div class="header-menu">
                <ul class="nav">
                    <li class="nav-item">
                        <a class="nav-link" href="/">Home</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/posts/">Articles</a>
                    </li>
                </ul>
            </div>
            <!-- Menu Extra -->
            <div class="header-menu-extra">
                <ul class="list-inline-sm">
                    <li><a href="#"><i class="bi bi-facebook"></i></a></li>
                    <li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
                    <li><a href="#"><i class="bi bi-linkedin"></i></a></li>
                </ul>
            </div>
            <!-- Menu Toggle -->
            <button class="header-toggle">
                <span></span>
            </button>
        </div><!-- end container -->
    </div>
    <!-- end Header -->

    <main>
        {{ block "main" . }}{{ end }}
    </main>

    <footer>
        <div class="section bg-dark">
            <div class="container">
                <div class="row g-4 align-items-center">
                    <div class="col-12 col-md-6 text-center text-md-start">
                        <ul class="list-inline-dash">
                            <li><a href="/faq/">FAQ</a></li>
                            <li><a href="/careers/">Careers</a></li>
                            <li><a href="/clients/">Clients</a></li>
                        </ul>
                        <p class="mt-2">&copy; {{ now.Format "2006" }} {{ .Site.Title }}, All Rights Reserved.</p>
                    </div>
                    <div class="col-12 col-md-6 text-center text-md-end">
                        <ul class="list-inline">
                            <li><a href="#"><i class="bi bi-facebook"></i></a></li>
                            <li><a href="#"><i class="bi bi-twitter-x"></i></a></li>
                            <li><a href="#"><i class="bi bi-pinterest"></i></a></li>
                            <li><a href="#"><i class="bi bi-instagram"></i></a></li>
                        </ul>
                    </div>
                </div><!-- end row -->
            </div><!-- end container -->
        </div>
    </footer>

    <!-- Scroll to top button -->
    <div class="scrolltotop icon-lg">
        <a class="button-circle button-circle-md button-circle-dark" href="#"><i class="bi bi-arrow-up-short"></i></a>
    </div>
    <!-- end Scroll to top button -->

    <!-- ***** JAVASCRIPTS ***** -->
    <script src="/assets/plugins/jquery.min.js"></script>
    <script src="/assets/plugins/plugins.js"></script>
    <script src="/assets/js/functions.js"></script>
</body>
</html>