<div class="w-100">
    <div class="w-100" style="height: calc(100vh - 140px)"></div>
    <div class="container p-0 bg-white">
        <div class="px-3" style="background-color: #732222">
            <mat-card style="max-width: 600px; transform: translateY(-33%)">
                <mat-card-content class="d-flex p-3">
                    <div class="d-none d-md-block pr-3">
                        <img src="assets/img/portrait.jpg" width="150px" height="150px" style="border-radius: 50%" alt="Zakary Timson">
                    </div>
                    <div>
                        <h1 class="mb-0">Zakary Timson</h1>
                        <h5 class="text-muted">DEVOPS & SOFTWARE ENGINEER</h5>
                        <div class="mt-3">
                            <div><i class="mr-2 fa fa-map-marker-alt"></i> London Ontario, Canada</div>
                            <div><i class="mr-2 fa fa-envelope"></i> <a href="mailto:zaktimson@gmail.com">zaktimson@gmail.com</a></div>
							<div><i class="mr-2 fa fa-gitlab"></i> <a href="https://gitlab.zakscode.com" target="_blank">gitlab.zakscode.com</a></div>
                            <div><i class="mr-2 fab fa-github"></i> <a href="https://github.com/ztimson" target="_blank">github.com/ztimson</a></div>
                        </div>
                    </div>
                </mat-card-content>
            </mat-card>
        </div>
        <div class="p-3">
            <console height="12rem"></console>
        </div>
<!--		<div class="p-3">-->
<!--			<h3>Projects</h3>-->
<!--			<iframe class="border-0" src="https://gitlab.zakscode.com/explore" width="100%" height="75vh">-->
<!--			</iframe>-->
<!--		</div>-->
        <div class="p-3">
            <h3>About Me</h3>
            <div>
				<img alt="Childhood" class="float-right m-3 m-md-0 ml-md-3" src="assets/img/keyboard-in-hand.jpg" height="150px" width="auto" style="border-radius: 50%">
				<p>
					Zak was born with a keyboard in hand and was learning his first programming language by thirteen. Nearly
					entirely self taught, Zak challenged his programming courses through both high-school and college while
					working in the industry to gain professional experience. He is very passionate about technology and as a
					lifelong learner it has opened the door to many other hobbies like robotics, space and physics. Some of his
					personal projects include a full sized arcade machine, home automation and a power wall for a home solar
					system.
				</p>
            </div>
        </div>
        <div class="p-3 overflow-hidden">
            <h3>Resume & References</h3>
            <a class="mb-3 btn btn-outline-primary" href="https://docs.google.com/document/d/1xP6HASPerXKMJM_x6-PhHVvoYgq-Hym5IRO7g47EX8o/edit?usp=sharing" target="_blank">Resume</a>
			<ul class="d-md-none list-group">
				<a class="list-group-item list-group-item-action border-info text-info" href="https://docs.google.com/document/d/1xP6HASPerXKMJM_x6-PhHVvoYgq-Hym5IRO7g47EX8o/edit?usp=sharing" target="_blank">Resume</a>
				<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyNWw0UDFzT0ZTeVU/view?usp=sharing" target="_blank">Manager</a>
				<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyaFBhcXBEaGp6YWc/view?usp=sharing" target="_blank">Contractor</a>
				<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyM0YtTWcxQzk0dEE/view?usp=sharing" target="_blank">Teacher</a>
				<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyX2owd0xURjh3RlE/view?usp=sharing" target="_blank">Principle</a>
				<a class="list-group-item list-group-item-action border-info text-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyMHdaM1BjZ1MwbWxva2lOY290NElwanN4b2JV/view?usp=sharing" target="_blank">CD Projekt Red</a>
			</ul>
			<div class="d-none d-md-block btn-group" role="group" aria-label="Basic example">
                <a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyNWw0UDFzT0ZTeVU/view?usp=sharing" target="_blank">Manager</a>
                <a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyaFBhcXBEaGp6YWc/view?usp=sharing" target="_blank">Contractor</a>
                <a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyM0YtTWcxQzk0dEE/view?usp=sharing" target="_blank">Teacher</a>
                <a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyX2owd0xURjh3RlE/view?usp=sharing" target="_blank">Principle</a>
                <a class="btn btn-outline-info" href="https://drive.google.com/file/d/0B_iz0vkzXmAyMHdaM1BjZ1MwbWxva2lOY290NElwanN4b2JV/view?usp=sharing" target="_blank">CD Projekt Red</a>
            </div>
        </div>
        <footer class="p-1 bg-dark text-center" style="color: grey">
            Copyright © Zakary Timson 2022 | All Rights Reserved
        </footer>
        <div class="d-none d-sm-block skirt"></div>
    </div>
</div>
