
/**
 * Zimit.less
 *
 * Final less to css compile file.
 *
 * @project Zimit Framework
 * @version 0.9.9
 * @author Jorge Garrido Oval, firezenk@gmail.com
 * @copyright 2012
 * @license MIT
 */
/**
 * Fonts.less
 *
 * Font definition for all styled texts.
 *
 * @project Zimit Framework
 * @version 0.9.9
 * @author Jorge Garrido Oval, firezenk@gmail.com
 * @copyright 2012
 * @license MIT 
 */

/* Custom component to show file/folder trees. This component use the root custom element 'tree' but you can also use 'ol';

	<ol>
      <li>
          <label for="subfolder1"><icon>folder</icon> Folder 1</label>
          <input type="checkbox" id="subfolder1" />
          <ol>
              <li class="file"><icon>file</icon> <a href="">File 2</a></li>
              <li class="file"><icon>file</icon> <a href="">File 2</a></li>
              <li class="file"><icon>file</icon> <a href="">File 2</a></li>
              <li>
                  <label for="subfolder2"><icon>folder</icon> Folder 2</label>
                  <input type="checkbox" id="subfolder2" />
                  <ol>
                      <li class="file"><icon>file</icon> <a href="">File 3</a></li>
                      <li class="file"><icon>file</icon> <a href="">File 3</a></li>
                      <li class="file"><icon>file</icon> <a href="">File 3</a></li>
                  </ol>
              </li>
          </ol>
      </li>
      <li class="file"><icon>file</icon> File 1</li>
      <li class="file"><icon>file</icon> File 1</li>
    </ol>
*/
tree,
.tree {
  /*border: 1px solid #979797;*/
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-clip: padding-box;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
}
tree li,
.tree li {
  position: relative;
  list-style: none;
}
tree li:first-child,
.tree li:first-child {
  border-top: 1px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  background-clip: padding-box;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 5px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
}
tree li:last-child,
.tree li:last-child {
  border-bottom: 1px;
  margin-bottom: 1px;
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 5px;
  border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  border-bottom-left-radius: 5px;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  background-clip: padding-box;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;
  -moz-border-radius-topleft: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
}
tree li label,
.tree li label {
  cursor: pointer;
  display: inline;
}
tree li a,
.tree li a {
  color: #000;
  width: 100%;
  text-decoration: none;
  display: inline;
}
tree li input,
.tree li input {
  position: absolute;
  left: -28px;
  margin-left: 0;
  z-index: 2;
  cursor: pointer;
  height: 1em;
  width: 1em;
  top: 11px;
  opacity: 0;
  -webkit-opacity: 0;
  -moz-opacity: 0;
}
tree li input + ol:before,
.tree li input + ol:before {
  font-size: 24px;
  font-weight: bold;
  content: "+";
  margin: -1.5em 0 0 -65px;
  display: block;
}
tree li input + ol > li,
.tree li input + ol > li {
  display: none;
  margin-left: -14px !important;
  padding-left: 1px;
}
tree li input:checked + ol,
.tree li input:checked + ol {
  margin: -1.25em 0 0 -44px;
  padding: 1.563em 0 0 80px;
  height: auto;
}
tree li input:checked + ol:before,
.tree li input:checked + ol:before {
  font-size: 24px;
  font-weight: bold;
  content: "-";
  margin: -1.8em 0 0 -58px;
  display: block;
}
tree li input:checked + ol > li,
.tree li input:checked + ol > li {
  display: block;
  margin: 0 0 0.125em;
}
tree li input:checked + ol > li:last-child,
.tree li input:checked + ol > li:last-child {
  margin: 0 0 0.063em;
}
/* Pagination list-based component;


	<ul class="pagination">
      <li class="prev"><a href="">&laquo;</a></li>
      <li class="current"><a href="">1</a></li>
      <li><a href="">2</a></li>
      <li><a href="">3</a></li>
      <li><a href="">4</a></li>
      <li><a href="">&hellip;</a></li>
      <li><a href="">12</a></li>
      <li><a href="">13</a></li>
      <li class="next"><a href="">&raquo;</a></li>
    </ul>
*/

/**
 * Icons.less
 *
 * Add typographic based icons.
 *
 * @project Zimit Framework
 * @version 0.9.9
 * @author Jorge Garrido Oval, firezenk@gmail.com
 * @copyright 2012
 * @license MIT
 */
@font-face {
  font-family: 'LigatureSymbols';
  src: url('fonts/LigatureSymbols.eot');
  src: url('fonts/LigatureSymbols.eot?#iefix') format('embedded-opentype'), url('fonts/LigatureSymbols.woff') format('woff'), url('fonts/LigatureSymbols.ttf') format('truetype'), url('fonts/LigatureSymbols.svg#LigatureSymbols') format('svg');
  src: url('fonts/LigatureSymbols.ttf') format('truetype');
}
/* Sample for use any font-icon on any element

    <span class="lsf">info</span>
*/
.lsf {
  font-size: 36px;
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
}
/* New elements called 'icon', do the same as .lsf class but more semantic

    <icon>info</icon>
*/
icon {
  font-size: 36px;
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
}
