{{ define "main" }}
<section class="talk">

	<header class="tag-{{ anchorize (delimit .Params.tags "" ) }}">
		<div class="tags">
			{{ range .Params.tags }}
			<span>{{ . }}</span>
			{{ end }}
		</div>

		<h1 class="text">{{ .Title }}</h1>
		<span class="language {{ anchorize .Params.language }}"></span>
	</header>

	<div class="info">
		<div class="complexity">{{ .Params.complexity }}</div>
		<div class="type type-{{ anchorize .Params.talkType }}">{{ .Params.talkType }}</div>

		<div class="content">
			{{ .Content }}
		</div>

	</div>


	<ul class="speakers">
		{{ range where .Site.RegularPages "Params.id" "in" .Params.speakers }}
		<li>
			<a class="speaker" href="/speakers/{{ .Params.id }}">
				<div class="speaker-img" style="background-image: url({{ .Params.photo }});"></div>
				<div class="info">
					<strong class="speaker-name">{{ .Params.name }}</strong>
					<span class="speaker-country">{{ .Params.country }}</span>
				</div>
				<p>{{ .Params.shortBio }}</p>
				<figure class="speaker-company">
					<img src="{{ .Params.companyLogo }}">
					<figcaption>{{ .Params.company }}</figcaption>
				</figure>
			</a>
		</li>
		{{ end }}
	</ul>


	<div class="media">
		{{ if .Params.videoId }}
		<div class="video" style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
			<iframe src="//www.youtube.com/embed/{{ .Params.videoId }}?autoplay=1"
			        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" allowfullscreen
			        title="YouTube Video"></iframe>
		</div>
		{{ end }}

		{{ if .Params.presentation }}
		<a class="social-slides" href="{{ .Params.presentation }}" target="_blank">Voir les slides</a>
		{{ end }}

	</div>

</section>
{{ end }}