<!DOCTYPE html>
<html>
{{template "header" .}}

<body id="page-top">
    {{template "navbar" .}}
    <!-- Masthead-->
    <header class="masthead">
        <div class="container h-100">
            <div class="row h-100 align-items-center justify-content-center text-center">
                <div class="col-lg-10 align-self-end">
                    <h1 class="text-uppercase text-white font-weight-bold">{{.Cont.Subject}}</h1>
                    <hr class="divider my-4" />
                </div>
                <div class="col-lg-8 align-self-baseline">
                    <p class="text-white-75 font-weight-light mb-5">{{.Cont.TextHTML}}</p>
                    <a class="btn btn-primary btn-xl js-scroll-trigger" href="#about">Find Out More</a>
                </div>
            </div>
        </div>
    </header>
    <!-- About section-->
    <section class="page-section bg-primary" id="about">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-8 text-center">
                    {{range .ContListByName}}
                    {{if eq .Name "about"}}
                    <h2 class="text-white mt-0">{{.Title}}</h2>
                    <hr class="divider light my-4" />
                    {{.TextHTML}}
                    {{end}}
                    {{end}}
                    <a class="btn btn-light btn-xl js-scroll-trigger" href="#services">Get Started!</a>
                </div>
            </div>
        </div>
    </section>
    <!-- Services section-->
    <section class="page-section" id="services">
        <div class="container">
            <h2 class="text-center mt-0">At Your Service</h2>
            <hr class="divider my-4" />
            <div class="row">
                {{range .ContListByName}}
                {{if eq .Title "Gem"}}
                <div class="col-lg-3 col-md-6 text-center">
                    <div class="mt-5">
                        <i class="fas fa-4x fa-gem text-primary mb-4"></i>
                        <h3 class="h4 mb-2">{{.Subject}}</h3>
                        <p class="text-muted mb-0">{{.TextHTML}}</p>
                    </div>
                </div>
                {{end}}
                {{if eq .Title "Laptop"}}
                <div class="col-lg-3 col-md-6 text-center">
                    <div class="mt-5">
                        <i class="fas fa-4x fa-laptop-code text-primary mb-4"></i>
                        <h3 class="h4 mb-2">{{.Subject}}</h3>
                        <p class="text-muted mb-0">{{.TextHTML}}</p>
                    </div>
                </div>
                {{end}}
                {{if eq .Title "Globe"}}
                <div class="col-lg-3 col-md-6 text-center">
                    <div class="mt-5">
                        <i class="fas fa-4x fa-globe text-primary mb-4"></i>
                        <h3 class="h4 mb-2">{{.Subject}}</h3>
                        <p class="text-muted mb-0">{{.TextHTML}}</p>
                    </div>
                </div>
                {{end}}
                {{if eq .Title "Heart"}}
                <div class="col-lg-3 col-md-6 text-center">
                    <div class="mt-5">
                        <i class="fas fa-4x fa-heart text-primary mb-4"></i>
                        <h3 class="h4 mb-2">{{.Subject}}</h3>
                        <p class="text-muted mb-0">{{.TextHTML}}</p>
                    </div>
                </div>
                {{end}}
                {{end}}
            </div>
        </div>
    </section>
    <!-- Portfolio section-->
    <section id="portfolio">
        <div class="container-fluid p-0">
            <div class="row no-gutters">
                {{range .ContListByName}}
                {{if eq .Name "project1"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/1.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/1.jpg" alt="" />
                        <div class="portfolio-box-caption">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{if eq .Name "project2"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/2.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/2.jpg" alt="" />
                        <div class="portfolio-box-caption">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{if eq .Name "project3"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/3.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/3.jpg" alt="" />
                        <div class="portfolio-box-caption">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{if eq .Name "project4"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/4.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/4.jpg" alt="" />
                        <div class="portfolio-box-caption">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{if eq .Name "project5"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/5.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/5.jpg" alt="" />
                        <div class="portfolio-box-caption">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{if eq .Name "project6"}}
                <div class="col-lg-4 col-sm-6">
                    <a class="portfolio-box" href="/templates/creative/assets/img/portfolio/fullsize/6.jpg"><img
                            class="img-fluid" src="/templates/creative/assets/img/portfolio/thumbnails/6.jpg" alt="" />
                        <div class="portfolio-box-caption p-3">
                            <div class="project-category text-white-50">{{.Title}}</div>
                            <div class="project-name">{{.TextHTML}}</div>
                        </div>
                    </a>
                </div>
                {{end}}
                {{end}}
            </div>
        </div>
    </section>
    {{range .ContListByName}}
    {{if eq .Name "download"}}
     <!-- Call to action section-->
     <section class="page-section bg-dark text-white">
        <div class="container text-center">
            <h2 class="mb-4">{{.TextHTML}}</h2>
            <a class="btn btn-light btn-xl" href="{{.Subject}}">{{.Title}}</a>
        </div>
    </section>
    {{end}}
    {{end}}
    <!-- Contact section-->
    {{range .ContListByName}}
    {{if eq .Name "contact"}}
    <section class="page-section" id="contact">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-8 text-center">
                    <h2 class="mt-0">{{.Title}}</h2>
                    <hr class="divider my-4" />
                    <p class="text-muted mb-5">{{.TextHTML}}</p>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 ml-auto text-center mb-5 mb-lg-0">
                    <i class="fas fa-phone fa-3x mb-3 text-muted"></i>
                    <div>{{.Subject}}</div>
                </div>
                <div class="col-lg-4 mr-auto text-center">
                    <i class="fas fa-envelope fa-3x mb-3 text-muted"></i
                    ><!-- Make sure to change the email address in BOTH the anchor text and the link target below!--><a class="d-block" href="mailto:{{.Author}}">{{.Author}}</a>
                </div>
            </div>
        </div>
    </section>
    {{end}}
    {{end}}

</body>
{{template "footer"}}

</html>