doctype html
html(lang="en")
    head
        meta(charset="utf-8")
        meta(http-equiv="X-UA-Compatible" content="IE=edge")
        meta(name="viewport" content="width=device-width, initial-scale=1")
        meta(name="Description" lang="en" content="open source html and css template")
        meta(name="author" content="mlp design")
        meta(name="robots" content="index, follow")
        if title
            title #{title} - Geocation
        else
            title Geocation
        link(rel="stylesheet" href="css/style.css")
        link(rel="stylesheet" href="css/custom.css")
        link(rel="stylesheet" href="css/slidy.css")
body
    // div(id="menu")
    //     nav
    //         label(for="show-menu" class="responsive") &#9776
    //         input(type="checkbox" id="show-menu" role="button")
    //         ul(id="topnav")
    //             li: span(class="icon")
    //                     a(href="#" title="Your Logo" class="logo") 👽
    //             li: a(href="teaching.html") Teaching
    //             li: a(href="education.html") Education
    //             li: a(href="outreach.html") Outreach
    //             li: a(href="community-involvement.html") Community Involvement
    //             // li: a(href="contact.html") Contact
    //             // li
    //             //     span.icon
    //             //         a(href="#" class="search") 🔍
    //         span.hide: a(href="#" title="Your Logo" class="logo") 👽
    //         span.hide: a(href="#" class="search") 🔍

    // div(id="container")
    div(id="pageheader")
        div(class="col")
            if title
                h1
                    a(href="index.html") Geocation
                    // |  | #{title}
            else
                a(href="index.html"): h1 Geocation

        div(class="col")
            ul#sub
                li: a(href="teaching.html") Teaching
                li: a(href="education.html") Education
                li: a(href="outreach.html") Outreach
                li: a(href="community-involvement.html") Community Involvement
                // li: a(href="contact.html") Contact

mixin bigimage(src, alt, ryanhawk)
    figure
        // =img_big(src=src, alt=alt)
        - var loc = src.replace(/[.].+?$/, "");
        - var ext = src.replace(/^.+[.]/, "");
        a(href=`images/${loc}-full.${ext}`)
            img.big(src=`images/${loc}-full.${ext}`, alt=alt)
        figcaption
            block
            if ryanhawk
                +ryanhawk

mixin ryanhawk
    br
    | Photo courtesy: 
    a(href="https://ryanhawk.com/") RyanHawk.com

// mixin img_big(src, alt, href)
//     if href
//         a(href=href)
//             img.big(src=src, alt=alt)
//     else
//         a(href="#{src}.")
//             img.big(src=src, alt=alt)