<?php
/**
 * Style guide
 * This is a template part. It must be used within The Loop.
 *
 * @package Bimber_Theme 5.0
 */

// Prevent direct script access.
if ( ! defined( 'ABSPATH' ) ) {
	die( 'No direct script access allowed' );
}

get_header();
?>

	<div class="g1-row g1-row-layout-page g1-row-padding-m">
		<div class="g1-row-background">
		</div>
		<div class="g1-row-inner">

			<div class="g1-column" id="primary">
				<div id="content" role="main">

				<article <?php post_class( 'entry-tpl-classic' ); ?>>
					<div class="g1-content-narrow g1-typography-xl entry-content" itemprop="articleBody">

<p><span class="g1-button-solid g1-button g1-button-xs">  solid xs</span></p>
<p><span class="g1-button-solid g1-button g1-button-s">   solid s</span></p>
<p><span class="g1-button-solid g1-button g1-button-m">   solid m</span></p>
<p><span class="g1-button-solid g1-button g1-button-l">   solid l</span></p>
<p><span class="g1-button-solid g1-button g1-button-xl">  solid xl</span></p>

<p><span class="g1-button-wide g1-button-solid g1-button g1-button-xs">  wide solid xs</span></p>
<p><span class="g1-button-wide g1-button-solid g1-button g1-button-s">   wide solid s</span></p>
<p><span class="g1-button-wide g1-button-solid g1-button g1-button-m">   wide solid m</span></p>
<p><span class="g1-button-wide g1-button-solid g1-button g1-button-l">   wide solid l</span></p>
<p><span class="g1-button-wide g1-button-solid g1-button g1-button-xl">  wide solid xl</span></p>

<p><span class="g1-button-simple g1-button g1-button-xs">  simple xs</span></p>
<p><span class="g1-button-simple g1-button g1-button-s">   simple s</span></p>
<p><span class="g1-button-simple g1-button g1-button-m">   simple m</span></p>
<p><span class="g1-button-simple g1-button g1-button-l">   simple l</span></p>
<p><span class="g1-button-simple g1-button g1-button-xl">  simple xl</span></p>

<p><span class="g1-button-wide g1-button-simple g1-button g1-button-xs">  wide simple xs</span></p>
<p><span class="g1-button-wide g1-button-simple g1-button g1-button-s">   wide simple s</span></p>
<p><span class="g1-button-wide g1-button-simple g1-button g1-button-m">   wide simple m</span></p>
<p><span class="g1-button-wide g1-button-simple g1-button g1-button-l">   wide simple l</span></p>
<p><span class="g1-button-wide g1-button-simple g1-button g1-button-xl">  wide simple xl</span></p>

<p><span class="g1-button-subtle g1-button g1-button-xs">  subtle xs</span></p>
<p><span class="g1-button-subtle g1-button g1-button-s">   subtle s</span></p>
<p><span class="g1-button-subtle g1-button g1-button-m">   subtle m</span></p>
<p><span class="g1-button-subtle g1-button g1-button-l">   subtle l</span></p>
<p><span class="g1-button-subtle g1-button g1-button-xl">  subtle xl</span></p>

<p><span class="g1-button-wide g1-button-subtle g1-button g1-button-xs">  wide subtle xs</span></p>
<p><span class="g1-button-wide g1-button-subtle g1-button g1-button-s">   wide subtle s</span></p>
<p><span class="g1-button-wide g1-button-subtle g1-button g1-button-m">   wide subtle m</span></p>
<p><span class="g1-button-wide g1-button-subtle g1-button g1-button-l">   wide subtle l</span></p>
<p><span class="g1-button-wide g1-button-subtle g1-button g1-button-xl">  wide subtle xl</span></p>

<p>The paragraph <strong>bold</strong> <em>em</em></p>
<p class="g1-meta">G1 meta class</p>

<h3 class="g1-zeta">.g1-zeta</h3>
<h3 class="g1-epsilon">.g1-epsilon</h3>
<h3 class="g1-delta">.g1-delta</h3>
<h3 class="g1-gamma">.g1-gamma</h3>
<h3 class="g1-beta">.g1-beta</h3>
<h3 class="g1-mega">.g1-mega</h3>
<h3 class="g1-giga">.g1-giga</h3>

<h3 class="g1-zeta g1-zeta-2nd">.g1-zeta  g1-zeta-2nd</h3>
<h3 class="g1-epsilon g1-epsilon-2nd">.g1-epsilon g1-epsilon-2nd</h3>
<h3 class="g1-delta g1-delta-2nd">.g1-delta g1-delta-2nd</h3>
<h3 class="g1-gamma g1-gamma-2nd">.g1-gamma g1-gamma-2nd</h3>
<h3 class="g1-beta g1-beta-2nd">.g1-beta g1-beta-2nd</h3>
<h3 class="g1-mega g1-mega-2nd">.g1-mega g1-mega-2nd</h3>
<h3 class="g1-giga g1-giga-2nd">.g1-giga g1-giga-2nd</h3>

<h3 class="g1-zeta g1-zeta-3rd">.g1-zeta  g1-zeta-3rd</h3>
<h3 class="g1-epsilon g1-epsilon-3rd">.g1-epsilon g1-epsilon-3rd</h3>
<h3 class="g1-delta g1-delta-3rd">.g1-delta g1-delta-3rd</h3>
<h3 class="g1-gamma g1-gamma-3rd">.g1-gamma g1-gamma-3rd</h3>
<h3 class="g1-beta g1-beta-3rd">.g1-beta g1-beta-3rd</h3>
<h3 class="g1-mega g1-mega-3rd">.g1-mega g1-mega-3rd</h3>
<h3 class="g1-giga g1-giga-3rd">.g1-giga g1-giga-3rd</h3>

<span class="g1-link">.g1-link</span>
<span class="g1-link g1-link-left">.g1-link g1-link-left</span>
<span class="g1-link g1-link-right">.g1-link g1-link-right</span>

<div class="g1-tabs">
	<ul class="g1-tab-items">
		<li class="g1-tab-item g1-tab-item-current">
			<a class="g1-tab">Our site</a>
		</li>
		<li class="g1-tab-item">
			<a class="g1-tab">Facebook</a>
		</li>
	</ul>
	<ul class="g1-subtab-items">
		<li class="g1-subtab-item">
			<a class="g1-subtab">First</a>
		</li>
		<li class="g1-subtab-item g1-tab-item-current">
			<a class="g1-subtab">Second</a>
		</li>
</div>

<div class="g1-tabs">
	<ul class="g1-tab-items">
		<li class="g1-tab-item g1-tab-item-current g1-tab-item-icon">
			<a class="g1-tab">Our site</a>
		</li>
		<li class="g1-tab-item g1-tab-item-icon">
			<a class="g1-tab">Facebook</a>
		</li>
		<li class="g1-tab-item  g1-tab-item-icon">
			<a class="g1-tab">Facebook</a>
		</li>
		<li class="g1-tab-item g1-tab-item-icon">
			<a class="g1-tab">Facebook</a>
		</li>
	</ul>
	<ul class="g1-subtab-items">
		<li class="g1-subtab-item g1-tab-item-current">
			<a class="g1-subtab">First</a>
		</li>
		<li class="g1-subtab-item">
			<a class="g1-subtab">Second</a>
		</li>
</div>


					</div>
				</article>

				</div><!-- #content -->
			</div><!-- #primary -->
		</div>
	</div><!-- .g1-row -->


<?php get_footer();