<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8"> 
    
    <title>[YOUR-NAME]</title>

	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
    <style>.Navigation-link,a{text-decoration:none}body{background:#f8f8f8;display:flex;flex-direction:column;min-height:100vh;color:#404040;font-family:-apple-system,BlinkMacSystemFont,Segoe
	UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1.4}.inline-list,.inline-list li,.list-of-links li
	a,.list-of-links-meta,.teaser-link{display:inline-block}.Footer{text-align:center}.Navigation{padding:1em 0 0}.teaser-body{color:#404040;padding:1em
	0}.teaser-linkText{border:0 solid;border-bottom:2px;border-color:rgba(243,134,48,.5);font-weight:700;transition:border 15ms
	ease}.rounded-edges,.teaser-link{border-radius:3px}.card{background:#fff;margin:1rem 0;padding:1rem 0;box-shadow:0 0 1px 0
	#ccc}.Posts-header,.card>h1:first-of-type,.card>h2:first-of-type,.card>h3:first-of-type,.card>p:first-of-type{margin-top:0}.SocialList{/*visibility:hidden*/}.Posts--recent{margin-bottom:0}.Footer
	.container{max-width:none}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}main{flex:1 0
	auto;order:1}.Header+main{padding-top:3rem}.list-of-links+h3,p+h2{margin-top:2em}p a{border-bottom:1px solid #e6e6e6}p
	a:hover{border-color:#ccc}img{height:auto;max-width:100%;width:100%}a{color:#1791d0}li{margin-bottom:.5em}.container{margin:0
	auto;max-width:42rem;padding-left:1rem;padding-right:1rem;width:100%}.container--fluid{max-width:none}.row{padding-top:1rem;padding-bottom:1rem}.inline-list{margin:0}.inline-list
	li{margin-bottom:0}.inline-list,.list-of-links{list-style-type:none;padding-left:0}.list-of-links{margin:0 1rem}.list-of-links li{min-height:1.8em}.list-of-links li
	a{border-bottom:0;width:100%}.list-of-links li a:hover .list-of-links-meta,.teaser-link:hover{background:#f8f8f8}.teaser-link:hover
	.teaser-linkText{border-color:#f38630}.list-of-links-header{font-size:.7em}.list-of-links-meta{color:#ccc;font-size:.8em;line-height:1}.teaser{min-height:2rem}.teaser-link{line-height:1.2;max-width:42em;padding:.5em;color:#404040}.teaser-meta{color:grey;display:block;font-size:.8em;line-height:1.5;margin:.5em
	0}.Logo{border-radius:100%;height:2rem;width:2rem;margin-right:1rem;transition:all .15s ease}.Logo-padding{display:inline-block;padding:1rem 1rem 1rem
	0}.Navigation{display:flex;flex-wrap:wrap}.Navigation-list{list-style-type:none;margin:0;padding-left:0}.Navigation-listItem{display:inline-block;color:gray;font-size:.8em;font-weight:700;padding-left:.5em;position:relative;text-transform:uppercase}.Navigation-listItem:not(:last-child){padding-right:.5em}.Navigation-listItem:not(:last-child):after{color:#bfbfbf;content:',';position:absolute;top:0;text-shadow:1px
	1px rgba(255,0,0,.15)}.Navigation-link{border-bottom:1px solid #e6e6e6;color:#404040}.Navigation-link:hover{border-color:#ccc}.Brand,.SocialList
	a{border-bottom:0}.Brand{display:flex;align-items:center}.Header{background:#fff;width:100%}.Header .container{display:flex;align-items:center;flex-direction:row}.Header
	.Brand{flex:1}.Header
	.Navigation{flex:3;justify-content:flex-end;font-size:.6em;margin-left:auto;text-align:right}.SocialList-item{margin-right:.5em}.SocialList-item:last-of-type{margin-right:0}.Introduction{background:#fff;align-items:center;flex-wrap:wrap;justify-content:center;padding:1rem
	0;position:relative;flex:1 0 auto;box-shadow:0 2px 1px -2px #ccc}.Introduction,.Introduction
	.container{display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap}.Introduction .container{flex-wrap:wrap;align-items:flex-start}.Introduction
	.SocialList{margin-top:0}.Introduction-imageContainer{flex:1;flex-basis:2rem;margin-right:1rem;max-width:10rem}.Introduction-image{border-radius:100%;min-width:2rem;max-width:12rem;width:100%}.Introduction-text{flex:2;margin-left:auto;flex-basis:10em;max-width:25em;padding-right:1em}.Introduction-text
	.u-url{color:inherit;cursor:text}.Introduction-text h1{font-size:1.1em}.Introduction-text p a{border-bottom:2px solid
	rgba(243,134,48,.75);display:inline-block;color:inherit}.Introduction-text p a:hover{border-color:#fa6900}.Posts--recent .Posts-header{padding:.5rem
	1.5rem;color:#8c8c8c;font-size:.75em;text-transform:uppercase}.Posts-allLink{color:#8c8c8c;margin:.5rem 1.5rem;border-bottom:2px solid
	#F38630}.Post-meta:hover,.Posts-allLink:hover,.js-touchSupported .Post-meta{border-color:#fa6900}.Post-meta{border-top:1px solid
	#e6e6e6;color:#ccc;font-size:.8em;margin:2rem 0 0;padding-top:1rem}.Post-meta a{color:inherit}.Post-meta a:hover{border-bottom:1px solid #e6e6e6}.Post-meta:hover
	a,.js-touchSupported .Post-meta a{color:#1791d0}.Post-tag:not(:last-of-type):after{content:","}.Footer{order:2;font-size:.8em;font-style:italic;padding:1rem 0}.Footer
.container{display:flex}.Footer a{color:inherit;transition:color .15s ease}.Footer a:hover{border-bottom:1px solid #bfbfbf}@media (min-width:25rem){.Header
.Navigation{font-size:.8em}}@media (min-width:32rem){.Header .Navigation{font-size:.9em}}@media (min-width:31.25rem){.Introduction-text
h1{font-size:2em}}.alignnone{margin-left:0;margin-right:0;max-width:100%;height:auto}.aligncenter{display:block;margin:10px
auto;height:auto}.alignleft,.alignright{margin-bottom:10px;height:auto}@media
(min-width:45rem){.alignleft{float:left;margin-right:10px}.alignright{float:right;margin-left:10px}}.wp-caption{display:block;padding:4px;margin-bottom:20px;line-height:1.428571429;background-color:#fff;border:1px
solid #ddd;border-radius:4px;transition:border .2s
ease-in-out}.wp-caption-text{padding:9px}.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.screen-reader-text:active,.screen-reader-text:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}body#tinymce{margin:12px!important}
</style>
</head>

<body>
    <header class="Header" role="banner">

        <div class="container container--fluid">

            <a href="../pages/index.html" class="Brand">
                <div class="Logo-padding">
                    <!-- <img
src="https://media.licdn.com/dms/image/C5603AQFxAk5dCrih9g/profile-displayphoto-shrink_200_200/0?e=1551312000&v=beta&t=jZepd7MKUPmqEUWRSfgMjIjtuEiCyGhhz4Ll2VymWmA"
class="Logo"> -->
                </div>
            </a>

            <nav class="Navigation">
                <ul class="Navigation-list">
                    <li class="Navigation-listItem">
                        <a href="site/about" class="Navigation-link">About</a> </li>
                    <li class="Navigation-listItem">
                        <a href="#" class="Navigation-link">Articles</a> </li>
                    <li class="Navigation-listItem"> 
                        <a href="#" class="Navigation-link">Notes</a> </li>
                    <li class="Navigation-listItem">
                        <a href="#" class="Navigation-link">Bookmarks</a> </li>
                    <li class="Navigation-listItem"> 
                        <a href="#" class="Navigation-link">Contact</a> </li>
                </ul>
            </nav>
        </div>

    </header>
    <section class="Introduction h-card Card rounded-edges">
        <div class="container">
            <div class="Introduction-imageContainer">
                <img src="[YOUR_MEDIA_IMAGE_LINK]" alt="my face" class="Introduction-image u-photo"> </div>
            <div class="Introduction-text">
                <h1>
                    Hi, I'm <a href="#" class="u-url u-uid p-name">Konfuzed Banda</a> </h1>
                <p> I'm the CTO and one of the Co-Founders at A Company. I like things on Github as well. </p>
                <p>
                    <a href="mailto:[YOUR_EMAIL]@gmail.com" class="u-email">[YOUR_EMAIL]@gmail.com</a>
                </p>

                <ul class="SocialList inline-list">
                    <li class="SocialList-item"><a href="#" rel="me">LinkedIn</a> </li>
                    <li class="SocialList-item"> <a href="#" rel="me">Instagram</a> </li>
                    <li class="SocialList-item"> <a href="#" rel="me">GitHub</a> </li>
                    </li>
                </ul>
            </div>
        </div>
    </section>
    <footer class="Footer">
        <div class="container">
            <!-- <a href="#">View the source code on GitHub</a> -->
            <div style="margin: 0 auto">
                <img src="[YOUR_MEDIA_IMAGE_LINK]" class="Logo">                
                <div> 
                    <a href="mailto:[YOUR_EMAIL]@gmail.com">[YOUR_EMAIL]@gmail.com</a>
                </div>
            </div>
        </div>
    </footer>
</body>
</html>