layout: default _comments:

layout: Keep this as home-page
title: Title for google search results and social media previews
description: This is the description for SEO and shown in search results and social media previews
logo: Do you have a logo image?
logo_path: Upload your logo here (recommended size is 300px wide)
banner-title: Title displayed on the top banner
banner-subtitle: A subtitle displayed on the banner
banner-image_path: The large banner image (recommended size is around 1200px wide by 900px tall)
banner_color: Color for the banner background
banner-text_color: Color for the banner text
featured_color: A featured color to use throughout the media kit
custom-font_html: If you want to use a custom font for your headings, paste the embed link for a custom google font
font-name: Name of the Google Font (with correct capitalisation)
intro-title: Title of the first introduction banner
intro-text_html: Write a short description of you, your brand and what you offer.
instagram: Do you want to add an instagram widget?
instagram-code: Go to lightwidget.com and copy the embed code here.
stats-title: Title of the statistics section
stats: Some general statistics about you or your audience
audience-title: Title of the Audience Section
audience-text_html: Short blurb of your audience or target market. Alternatively you can use this section for any other short text block.
brand-partnerships: Do you want a section that shows brands or clients you have worked with?
brand-title: Title of Brand Partnerships or Client section
brand-text_html: Short blurb about your experience and brands you have worked with.
brand-logo-displayed: true
brand-logos: Upload the logos of clients you have worked with (recommended size 300px x 200px)
testimonials-title: Title of the work with me section
testimonials-text_html: Short blurb about the servies you offer
testimonials-section: Do you want to include a section for testimonials?
testimonials:
  - quote: A short testimonial
    author: Who the testimonial is from
gallery-title: Title of the Gallery Section
gallery-text_html: Short blurb about the gallery or your content creation skills
gallery-captions: Do you want to display a caption for each photo?
contact-title: Title of the contact section
contact:
  - type: Eg. Phone, Email, Instagram
    value: Contact Number, Email or URL

<style>

h2, a {
  color: {{page.featured_color}};
}
hr, a {
  border-color: {{page.featured_color}};
}
section.featured {
  background-color: {{page.featured_color}};
}
.banner-color {
  background-color: {{page.banner_color}};
  color: {{page.banner-text_color}}
}
h1, h2, h3, h4 {
    font-family: '{{page.font-name}}';
}

</style>

<section class="banner grid banner-color">
  <div class="col-4_sm-12 inner vertical-align">
      <div>
        {% if page.logo %}
          <img class="logo" src="{{page.logo_path}}" />
        {% else %}
         <h1> {{page.banner-title}} </h1>
        {% endif %}
         <p class="mob-hide"> {{page.banner-subtitle}} </p>
      </div>
     <p class="pin-bottom mob-hide"> MEDIA KIT</p>
  </div>
  <div class="col-8_sm-12 bg" style="background-image:url('{{page.banner-image_path}}')">
    <!-- background image -->
    <p class="pin-bottom banner-color mob-show"> MEDIA KIT</p>
  </div>
</section>
<section>
  <h2 class="editable">{{page.intro-title}}</h2>
  <hr />
  <div class="editable">
  {{page.intro-text_html}}
  </div>
</section>
<!--- - - - - - - - - -->
{% if page.instagram %}
<section class="no-padding">
  {{page.instagram-code}}
</section>
{% endif %}
<section class="stats-section">
   <h2 class="editable"> {{page.stats-title}} </h2>
   <hr />
   <div class="grid-center">
     {% for stat in page.stats %}
      <div class="col-3_sm-6_xs-12 center">
        <span class="info">{{stat.amount}}</span>
        <span class="info-subtitle">{{stat.subtitle}}</span>
        <h3>{{stat.title}}</h3>
      </div>
      {% endfor %}
   </div>
</section>
<!--- - - - - - - - - -->
<section>
  <h2 class="editable"> {{page.audience-title}} </h2>
  <hr />
  <div class="editable">
      {{page.audience-text_html}}
  </div>

</section>

<!— - - - - - - - - –> {% if page.brand-partnerships %} <section>

<h2 class="editable"> {{page.brand-title}} </h2>
<hr />
<div class="editable">
  {{page.brand-text_html}}
</div>

{% if page.brand-logo-displayed %}

<div class="grid-center margin-top">
  {% for logo in page.brand-logos %}
  <div class="col-3_sm-6_xs-12">
       <div class="logo-item" style="background-image:url('{{logo.image_path}}');">
       </div>
   </div>
   {% endfor %}
</div>

{% endif %} </section> {% endif %}

<!— - - - - - - - - –>

<section>

<h2 class="editable"> {{page.testimonials-title}} </h2>
<hr />
<div class="editable">
  {{page.testimonials-text_html}}
</div>

{% if page.testimonials-section %}

<div class="grid-center margin-top">
  {% for testimonial in page.testimonials %}
   <div class="col-4_sm-12 testimonial">
     <p>{{testimonial.quote}}</p>
     <p class="author">- {{testimonial.author}}</p>
   </div>
   {% endfor %}
</div>
{% endif %}

</section>

<!– - - - - - –>

<section class="gallery-section">
  <h2 class="editable"> {{page.gallery-title}} </h2>
  <hr />
  <div class="editable">
    {{page.gallery-text_html}}
  </div>
   <div class="grid-center margin-top">
     {% for gallery in page.gallery %}
      <div class="col-3_sm-6_xs-12">
        <div class="gallery-item" style="background-image:url('{{gallery.image_path}}');">
        </div>
        {% if page.gallery-captions %}
          <p class="caption">{{gallery.caption}}</p>
        {% endif %}
      </div>
      {% endfor %}
   </div>
</section>

<!– - - - - - –>

<section class=“featured editable”>

<h2>{{page.contact-title}} </h2>
<hr />
{% for item in page.contact %}
<p> <strong> {{item.type}}:  </strong> {{item.value}} </p>
{% endfor %}

</section> <footer>

<p> Media Kit Created with <i class="fa fa-heart" aria-hidden="true"></i> by <a href="http://www.instituteofcode.com">The Institute of Code </a> </p>
<p class="subtle">Get your own<a href="http://www.letscollab.io"> online media kit at letscollab.io</a> <br />or join one of our courses in Bali and in 10 days we'll teach you how to <a href="http://www.instituteofcode.com/courses/social-media"> become an influencer or social media manager.</a> </p>

</footer>