<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Agaric</title>
<meta name="description" content="">
<meta name="generator" content="kss-node">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="./kss-assets/kss.css">
<link rel="stylesheet" href="../agaric/css/agaric.css">

</head>
<body id="kss-node" >

<!-- kss-sidebar -->
<div class="kss-sidebar">
    <header class="kss-sidebar__header">
        <a class="kss-link" href="index.html">
            <h1 class="kss-doc-title">Agaric</h1>
        </a>
    </header>
    <nav class="kss-nav">
        <ul class="kss-nav__menu">
                    <li class="kss-nav__menu-item">
                <a class="kss-nav__menu-link" href="section-componenet.html">
                  <!-- <span class="kss-nav__ref">1</span>  -->
                  Componenet</a>
                <!-- Design links stright to item tempplate -->
                            </li>
                    <li class="kss-nav__menu-item">
                <a class="kss-nav__menu-link" href="section-base.html">
                  <!-- <span class="kss-nav__ref">2</span>  -->
                  Base</a>
                <!-- Design links stright to item tempplate -->
                                <ul class="kss-nav__menu-child">
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-blockquote">
                                                    <!-- <span class="kss-nav__ref">2.1</span> -->
                            Blockquote
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-elements">
                                                    <!-- <span class="kss-nav__ref">2.2</span> -->
                            Elements
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-elements-byline">
                                                    <!-- <span class="kss-nav__ref">2.2.1</span> -->
                            Byline
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-elements-rule">
                                                    <!-- <span class="kss-nav__ref">2.2.2</span> -->
                            Rule
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-elements-titles">
                                                    <!-- <span class="kss-nav__ref">2.2.3</span> -->
                            Titles
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-form">
                                                    <!-- <span class="kss-nav__ref">2.3</span> -->
                            Form
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography">
                                                    <!-- <span class="kss-nav__ref">2.4</span> -->
                            Typography
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-blockquote">
                                                    <!-- <span class="kss-nav__ref">2.4.1</span> -->
                            Blockquote
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-definitionlist">
                                                    <!-- <span class="kss-nav__ref">2.4.2</span> -->
                            Definition List
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-headings">
                                                    <!-- <span class="kss-nav__ref">2.4.3</span> -->
                            Headings
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-horizontalrule">
                                                    <!-- <span class="kss-nav__ref">2.4.4</span> -->
                            Horizontal Rule
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-link">
                                                    <!-- <span class="kss-nav__ref">2.4.5</span> -->
                            Link
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-orderedlist">
                                                    <!-- <span class="kss-nav__ref">2.4.6</span> -->
                            Ordered List
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-paragraph">
                                                    <!-- <span class="kss-nav__ref">2.4.7</span> -->
                            Paragraph
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-table">
                                                    <!-- <span class="kss-nav__ref">2.4.8</span> -->
                            Table
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-title">
                                                    <!-- <span class="kss-nav__ref">2.4.9</span> -->
                            Title
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-typography-unorderedlist">
                                                    <!-- <span class="kss-nav__ref">2.4.10</span> -->
                            Unordered List
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables">
                                                    <!-- <span class="kss-nav__ref">2.5</span> -->
                            Bulma Variables
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables">
                                                    <!-- <span class="kss-nav__ref">2.5</span> -->
                            Global Variables
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-animation">
                                                    <!-- <span class="kss-nav__ref">2.5.1</span> -->
                            Animation
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-borders">
                                                    <!-- <span class="kss-nav__ref">2.5.2</span> -->
                            Borders
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-breakpoints">
                                                    <!-- <span class="kss-nav__ref">2.5.3</span> -->
                            Breakpoints
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-colors">
                                                    <!-- <span class="kss-nav__ref">2.5.4</span> -->
                            Colors
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-fonts">
                                                    <!-- <span class="kss-nav__ref">2.5.5</span> -->
                            Fonts
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-grid">
                                                    <!-- <span class="kss-nav__ref">2.5.6</span> -->
                            Grid
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-variables-typography">
                                                    <!-- <span class="kss-nav__ref">2.5.7</span> -->
                            Typography
                        </a>
                    </li>
                                        <li class="kss-nav__menu-item">
                                                <a class="kss-nav__menu-link" href="section-base.html#kssref-base-figure">
                                                    <!-- <span class="kss-nav__ref">2.6</span> -->
                            Figures and Images
                        </a>
                    </li>
                                    </ul>
                            </li>
                    <li class="kss-nav__menu-item">
                <a class="kss-nav__menu-link" href="section-layout.html">
                  <!-- <span class="kss-nav__ref">3</span>  -->
                  Layout</a>
                <!-- Design links stright to item tempplate -->
                            </li>
                    <li class="kss-nav__menu-item">
                <a class="kss-nav__menu-link" href="section-component.html">
                  <!-- <span class="kss-nav__ref">4</span>  -->
                  Component</a>
                <!-- Design links stright to item tempplate -->
                            </li>
                </ul>
    </nav>
</div>

<!-- kss-main -->
<div class="kss-main-wrap">
<article role="main" class="kss-main">


  <!-- Section -->
    <div id="" class="kss-section kss-section--depth-1 ">
  <a name="kssref-base"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base">Info</a>
                        <h1 class="kss-title">
                                <a class="kss-link" href="#kssref-base">2
                                    Base
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Styling for basic HTML block and inline elements.</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric.scss</code>, line
                22
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-blockquote"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-blockquote">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-blockquote">2.1
                                    Blockquote
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Intended for use on node pages such as blog posts and case studies.</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-blockquote" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-blockquote">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.blockquote.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-elements"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-elements">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-elements">2.2
                                    Elements
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Extend Bulma basic HTML elements in <code>.content</code> blocks. It includes color classes.</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
                                          <div class="kss-parameters__title">Parameters:</div>
                <ul class="kss-parameters">
                                <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-blue</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-marine</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-berry</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-cinnamon</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-dark</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-grey</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-dandelion</code>
                  </div>
                  <div class="kss-parameters__description">
                    color
                                      </div>
                </li>
                                </ul>
                          
                          <!-- Example -->
                                    <div id="base-elements" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-elements">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.elements.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-elements-byline"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-elements-byline">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-elements-byline">2.2.1
                                    Byline
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-elements-byline" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-elements-byline">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.elements.scss</code>, line
                83
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-elements-rule"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-elements-rule">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-elements-rule">2.2.2
                                    Rule
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Adds big border</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-elements-rule" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-elements-rule">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.elements.scss</code>, line
                52
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-elements-titles"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-elements-titles">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-elements-titles">2.2.3
                                    Titles
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Extends Bulma <code>.title</code> and <code>.subtitle</code> classes</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
                                          <div class="kss-parameters__title">Parameters:</div>
                <ul class="kss-parameters">
                                <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-compact</code>
                  </div>
                  <div class="kss-parameters__description">
                    remove margins and spacing
                                      </div>
                </li>
                                </ul>
                          
                          <!-- Example -->
                                    <div id="base-elements-titles" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-elements-titles">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.elements.scss</code>, line
                67
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-form"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-form">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-form">2.3
                                    Form
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Extends Bulma Form classes.</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-form" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-form">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.form.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-typography"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography">2.4
                                    Typography
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>...</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
                                          <div class="kss-parameters__title">Parameters:</div>
                <ul class="kss-parameters">
                                <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-sans</code>
                  </div>
                  <div class="kss-parameters__description">
                    sans serif @font-face {
                                      </div>
                </li>
                                                          <li class="kss-parameters__item">
                  <div class="kss-parameters__name">
                    <code>.is-mono</code>
                  </div>
                  <div class="kss-parameters__description">
                    monospace font
                                      </div>
                </li>
                                </ul>
                          
                          <!-- Example -->
                                    <div id="base-typography" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-blockquote"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-blockquote">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-blockquote">2.4.1
                                    Blockquote
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-blockquote" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-blockquote">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                119
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-definitionlist"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-definitionlist">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-definitionlist">2.4.2
                                    Definition List
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-definitionlist" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-definitionlist">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                134
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-headings"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-headings">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-headings">2.4.3
                                    Headings
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-headings" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-headings">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                67
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-horizontalrule"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-horizontalrule">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-horizontalrule">2.4.4
                                    Horizontal Rule
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-horizontalrule" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-horizontalrule">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                149
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-link"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-link">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-link">2.4.5
                                    Link
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-link" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-link">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                139
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-orderedlist"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-orderedlist">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-orderedlist">2.4.6
                                    Ordered List
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-orderedlist" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-orderedlist">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                124
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-paragraph"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-paragraph">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-paragraph">2.4.7
                                    Paragraph
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-paragraph" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-paragraph">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                114
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-table"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-table">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-table">2.4.8
                                    Table
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-table" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-table">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                144
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-title"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-title">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-title">2.4.9
                                    Title
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-title" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-title">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                21
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-typography-unorderedlist"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-typography-unorderedlist">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-typography-unorderedlist">2.4.10
                                    Unordered List
                </a>
              </>
              <!-- Description -->
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-typography-unorderedlist" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-typography-unorderedlist">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.typography.scss</code>, line
                129
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-variables"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables">2.5
                                    Bulma Variables
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Customize Bulma variables</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-variables"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables">2.5
                                    Global Variables
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Custom overrides of <code>bulma/utilities/initial-variables.sass</code>.</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric.scss</code>, line
                3
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-animation"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-animation">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-animation">2.5.1
                                    Animation
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Animation timing</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-animation" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-animation">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                175
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-borders"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-borders">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-borders">2.5.2
                                    Borders
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Border radius</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-borders" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-borders">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                185
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-breakpoints"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-breakpoints">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-breakpoints">2.5.3
                                    Breakpoints
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Set responsive breakpoints</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-breakpoints" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-breakpoints">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                161
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-colors"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-colors">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-colors">2.5.4
                                    Colors
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Assign colors</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-colors" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-colors">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                14
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-fonts"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-fonts">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-fonts">2.5.5
                                    Fonts
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Set fonts</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-fonts" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-fonts">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                90
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-grid"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-grid">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-grid">2.5.6
                                    Grid
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Customize grid dimensions</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-grid" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-grid">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                152
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-3 ">
  <a name="kssref-base-variables-typography"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-variables-typography">Info</a>
                        <h3 class="kss-title">
                                <a class="kss-link" href="#kssref-base-variables-typography">2.5.7
                                    Typography
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>Customize type sizes and weights</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-variables-typography" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-variables-typography">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_variables.scss</code>, line
                127
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>


  <!-- Section -->
    <section id="" class="kss-section kss-section--depth-2 ">
  <a name="kssref-base-figure"></a>
        <div class="kss-pattern"><!-- kss-pattern -->
          <!-- Header -->
          <div class="kss-pattern__header"><!-- kss-pattern__header -->
            <a class="kss-code-toggle" href="#base-figure">Info</a>
                        <h2 class="kss-title">
                                <a class="kss-link" href="#kssref-base-figure">2.6
                                    Figures and Images
                </a>
              </>
              <!-- Description -->
                              <div class="kss-description">
                  <p>...</p>

                </div>
                          </div><!-- kss-pattern__header -->
            <!-- Parameters -->
            
                          <!-- Example -->
                                    <div id="base-figure" class="kss-pattern-code"><!-- kss-pattern-code -->
            <a class="kss-code-toggle" href="#base-figure">Close</a>
            <!-- Source -->
                          <div class="kss-source kss-style">
                <b>Source</b><br>
                <code>agaric/_base.figure.scss</code>, line
                1
              </div>
                        <!-- Markup -->
                                                </div><!-- kss-pattern-code -->
      </div><!-- kss-pattern -->

  </>

</article>
</div>

<script src="../agaric/js/jquery-3.2.1.min.js"></script>

<!-- Automatically built using <a href="https://github.com/kss-node/kss-node">kss-node</a>. -->
<script>
  $(document).ready(function() {
    $(".kss-code-toggle").on("click tap", function(e) {
      e.preventDefault();
      var url = $(this).attr('href')
      var objRef = url.substring(url.indexOf('#') + 1);
      $("#" + objRef).toggleClass('active');
    });
  });
</script>
</body>
</html>