<!doctype html>
<html>
	<head>
	
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimal-ui">
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,300italic,500,200,300' rel='stylesheet' type='text/css'>

	<title>{{#resume.basics}}{{name}}{{/resume.basics}}</title>

	<style>
	{{{css}}}
	</style>
	
	</head>
	<body>

    {{#resume.basics}}

    <!-- Header -->
    <div id="header">
        <div class="inner">

            <div class="name-and-label">
                <h1>{{name}}</h1>
                <h2>{{label}}</h2>
            </div>

            {{#if picture}}<img class="picture" src="{{picture}}" alt="" />{{/if}}

        </div>
    </div>

    <div id="resume">
        <section id="basics">

            <div class="contact mobile-clearfix">

                {{#if website}}
                <div class="website">
                    <strong>Hemsida</strong>
                    <a href="{{website}}">{{website}}</a>
                </div>
                {{/if}}

                {{#if email}}
                <div class="email">
                    <strong>E-mailadress</strong>
                    <span >{{email}}</span>
                </div>
                {{/if}}

                {{#if phone}}
                <div class="phone">
                    <strong>Telefonnummer</strong>
                    <span>{{phone}}</span>
                </div>
                {{/if}}

                {{#if profiles.length}}
                {{#each profiles}}
                    <div class="item">
                        {{#if network}}<strong>{{network}}</strong>{{/if}}

                        {{#if username}}<span><a class="username" target="_blank" href="{{url}}">{{username}}</a></span>{{/if}}
                    </div>
                {{/each}}
                {{/if}}

                {{#location}}
                    {{#if address}}
                        <div class="address">
                        <strong class="mobile-clearfix">Adress</strong>
                        <span class="mobile-break">{{address}}<span class="mobile-hide">,</span>
                        {{#if postalCode}}<span class="mobile-break">{{postalCode}} {{/if}}
                        {{#if city}}{{city}}</span><span class="mobile-hide">, {{/if}}
                        {{#if region}}{{region}}{{/if}}</span></span>
                        </div>
                    {{/if}}
                {{/location}}

            </div>

        </section>

        {{#if summary}}
        <section id="summary">

                <h1>Kort introduktion</h1>
                <p>{{summary}}</p>

        </section>
        {{/if}}
        {{/resume.basics}}

	{{#if resume.work.length}}
	<section id="work">
		<h1>Arbetslivserfarenhet</h1>

		{{#each resume.work}}
		<div class="item">

            {{#if company}}
            <h3 class="name">
                {{#if website}}<a href="{{website}}" title="{{website}}">{{company}}</a>
                {{else}}
                    {{company}}
                {{/if}}
            </h3>
                {{#if position}}<span class="position"><span class="mobile-hide">som </span>{{position}}.</span>{{/if}}
            {{/if}}

            {{#if startDate}}
            <div class="date">

                <span class="startDate">
                    {{startDate}}
                </span>

                {{#if endDate}}
                <span class="endDate">
                    - {{endDate}}
                </span>
                {{/if}}

            </div>
            {{/if}}


			{{#if summary}}
			<div class="summary">
				<p>{{summary}}</p>
			</div>
			{{/if}}

			{{#if highlights.length}}
			<ul class="highlights">
				{{#each highlights}}
				<li>{{.}}</li>
				{{/each}}
			</ul>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}

	{{#if resume.volunteer.length}}
	<section id="volunteer">
		<h1>Hackathon</h1>

		{{#each resume.volunteer}}
		<div class="item">
            {{#if organization}}
                <h3 class="name">
                    {{#if website}}<a href="{{website}}" title="{{website}}">{{organization}}</a>
                    {{else}}
                        {{company}}
                    {{/if}}
                </h3>
                {{#if position}}som {{position}}.{{/if}}
            {{/if}}

            {{#if startDate}}
                <div class="date">

                <span class="startDate">
                    {{startDate}}
                </span>

                    {{#if endDate}}
                        <span class="endDate">
                    - {{endDate}}
                </span>
                    {{/if}}

                </div>
            {{/if}}

			{{#if summary}}
			<div class="summary">
				<p>{{summary}}</p>
			</div>
			{{/if}}

			{{#if highlights.length}}
			<ul class="highlights">
				{{#each highlights}}
				<li>{{.}}</li>
				{{/each}}
			</ul>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}
	
	{{#if resume.education.length}}
	<section id="education">
		<h1>Utbildning</h1>

		{{#each resume.education}}
		<div class="item">

            {{#if studyType}}<h4 class="studyType">{{studyType}}</h4>{{/if}}

            {{#if startDate}}
                <div class="date">

                <span class="startDate">
                    {{startDate}}
                </span>

                    {{#if endDate}}
                        <span class="endDate">- {{endDate}}</span>
                    {{/if}}

                </div>
            {{/if}}

			{{#if institution}}<span class="institution"> <span class="mobile-hide">vid </span>{{institution}}</span>{{/if}}
			{{#if area}}<span class="area">, {{area}}</span>{{/if}}

			{{#if courses.length}}
			<ul class="courses">
				{{#each courses}}
				<li>{{.}}</li>
				{{/each}}
			</ul>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}
	
	{{#if resume.awards.length}}
	<section id="awards">
		<h1>Awards</h1>

		{{#each resume.awards}}
		<div class="item">

            {{#if title}}
			<div class="title">
				{{title}}
			</div>
			{{/if}}

			{{#if date}}
			<div class="date">
				{{date}}
			</div>
			{{/if}}

			{{#if awarder}}
			<div class="awarder">
				{{awarder}}
			</div>
			{{/if}}

			{{#if summary}}
			<div class="summary">
				<p>{{summary}}</p>
			</div>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}
	
	{{#if resume.publications.length}}
	<section id="publications">
		<h1>Publiceringar</h1>

		{{#each resume.publications}}
		<div class="item">

			{{#if name}}
			<h3 class="name">
				{{name}}
			</h3>
			{{/if}}

			{{#if publisher}}
			<span class="publisher">
				{{publisher}}
			</span>
			{{/if}}

			{{#if releaseDate}}
			<span class="releaseDate">
				{{releaseDate}}
			</span>
			{{/if}}

			{{#if website}}
			<div class="website">
				<a href="{{website}}">Länk till publicering</a>
			</div>
			{{/if}}

			{{#if summary}}
			<div class="summary">
				<p>{{summary}}</p>
			</div>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}
	
	{{#if resume.skills.length}}
	<section id="skills">
		<h1>Färdigheter</h1>

        <div class="inner">

            {{#each resume.skills}}
            <div class="item">

                {{#if name}}
                <h4 class="name">
                    {{name}}
                </h4>
                {{/if}}

                {{#if level}}
                <div class="level">
                    <em>{{level}}</em>
                </div>
                {{/if}}

                {{#if keywords.length}}
                <ul class="keywords">
                    {{#each keywords}}
                    <li>{{.}}</li>
                    {{/each}}
                </ul>
                {{/if}}

            </div>
            {{/each}}

        </div>

	</section>
	{{/if}}

	{{#if resume.languages.length}}
	<section id="languages">
		<h1>Språkkunskaper</h1>

		{{#each resume.languages}}
		<div class="item">

			{{#if language}}
			<h4 class="language">
				{{language}}
			</h4>
			{{/if}}

			{{#if fluency}}
			<span class="fluency">- {{fluency}}</span>{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}

	{{#if resume.interests.length}}
	<section id="interests">
		<h1>Intressen</h1>

		{{#each resume.interests}}
		<div class="item">

			{{#if name}}
			<h4 class="name">
				{{name}}
			</h4>
			{{/if}}

			{{#if keywords.length}}
			<ul class="keywords">
				{{#each keywords}}
				<li>{{.}}</li>
				{{/each}}
			</ul>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}

	{{#if resume.references.length}}
	<section id="references">
		<h1>Referenser</h1>

		{{#each resume.references}}
		<div class="item">

            {{#if name}}
                <h4 class="name">
                    {{name}}
                </h4>
            {{/if}}

            {{#if reference}}
			<span class="reference">
				{{reference}}
			</span>
			{{/if}}

		</div>
		{{/each}}

	</section>
	{{/if}}

	</div>

    <section id="footer">

        <div class="inner shake">

            Driven av <a href="https://jsonresume.org/">JSONResume</a>.<br/>
            Tema: <a href="https://github.com/janneklouman/jsonresume-theme-uppsala" title="Visa på GitHub">Uppsala</a>, utvecklat av Janne Klouman.

        </div>

    </section>
	
	</body>
</html>
