/*------- kanso.css --------*/
/**
  * Kanso - Semantic Flat Buttons
  *
  * Version: 2.0.1
  * Author & copyright (c) 2013: Kris Olszewski
  * Repo: https://github.com/KrisOlszewski/Kanso/
  *
  * Font Awesome 4.0.0 by Dave Gandy - http://fontawesome.io
  *
  */

.button {
  position: relative;
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 7px 14px;
  border: 1px solid transparent;
  border-radius: 2px;
  background-color: transparent;
  color: inherit;
  vertical-align: middle;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  white-space: normal;
  font-weight: normal;
  font-style: normal;
  line-height: 20px;
  cursor: pointer;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-appearance: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.button:hover,
.button:focus {
  outline: 0;
  text-decoration: none;
}

.button:active,
.button.is-active {
  -webkit-box-shadow: none;
  box-shadow: none;
  text-decoration: none;
}

.button[disabled],
.button.is-disabled {
  opacity: 0.25;
  filter: alpha(opacity=70);
  cursor: not-allowed;
  pointer-events: none;
}

.button.is-default {
  border-color: #656d78;
  background-color: #f5f7fa;
  color: #434a54;
}

.button.is-default:hover,
.button.is-default:focus {
  border-color: #737c89;
  background-color: white;
}

.button.is-default:active,
.button.is-default.is-active {
  border-color: #575e67;
  background-color: #e1e7f0;
}

.button.is-primary {
  border-color: #2494be;
  background-color: #3bafda;
  color: white;
}

.button.is-primary:hover,
.button.is-primary:focus {
  border-color: #2aa8d7;
  background-color: #55badf;
}

.button.is-primary:active,
.button.is-primary.is-active {
  border-color: #1f80a4;
  background-color: #27a2cf;
}

.button.is-secondary {
  border-color: #7652d1;
  background-color: #967adc;
  color: white;
}

.button.is-secondary:hover,
.button.is-secondary:focus {
  border-color: #896ad7;
  background-color: #a992e2;
}

.button.is-secondary:active,
.button.is-secondary.is-active {
  border-color: #633acb;
  background-color: #8362d6;
}

.button.is-success {
  border-color: #72a53b;
  background-color: #8cc152;
  color: white;
}

.button.is-success:hover,
.button.is-success:focus {
  border-color: #82bc43;
  background-color: #9bc969;
}

.button.is-success:active,
.button.is-success.is-active {
  border-color: #628e33;
  background-color: #7db440;
}

.button.is-warning {
  border-color: #f4a911;
  background-color: #f6bb42;
  color: white;
}

.button.is-warning:hover,
.button.is-warning:focus {
  border-color: #f5b42e;
  background-color: #f7c65f;
}

.button.is-warning:active,
.button.is-warning.is-active {
  border-color: #dc970a;
  background-color: #f5b025;
}

.button.is-danger {
  border-color: #c42737;
  background-color: #FA5453;
  color: white;
}

.button.is-danger:hover,
.button.is-danger:focus {
  border-color: #d63344;
  background-color: #df5e6a;
}

.button.is-danger:active,
.button.is-danger.is-active {
  border-color: #aa2230;
  background-color: #d52a3c;
}

.button.is-inverse {
  border-color: #434a54;
  background-color: #656d78;
  color: white;
}

.button.is-inverse:hover,
.button.is-inverse:focus {
  border-color: #515965;
  background-color: #737c89;
}

.button.is-inverse:active,
.button.is-inverse.is-active {
  border-color: #353b43;
  background-color: #575e67;
}

.button.is-link {
  color: #3fc1f1;
}

.button.is-link:hover,
.button.is-link:focus {
  color: #373737;
}

.button.is-link:active,
.button.is-link.is-active {
  color: #57c9f3;
}

.button.is-block {
  display: block;
  width: 100%;
}

.button.is-block + .button.is-block {
  margin-top: 10px;
}

.button-group-row:after {
  display: table;
  clear: both;
  content: ' ';
}

.button-group:after {
  display: table;
  clear: both;
  content: ' ';
}

.button-group.pull-left {
  float: left;
  margin-right: 36px;
}

.button-group.pull-right {
  float: right;
  margin-left: 36px;
}

.button-group .button {
  float: left;
  margin-left: -1px;
}

.button-group .button:first-child {
  margin-left: 0;
}

.button-group .button:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.button-group .button:first-child:not(:only-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.button-group .button:last-child:not(:only-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
/*
.button.has-icon-spacing .fa {
  margin-right: 5px;
}

.button.has-fixed-icon {
  padding: 7px 9px;
}

.button.has-fixed-icon .fa {
  width: 1.2857142857142858em;
  text-align: center;
}
*/

.button.icon {
    padding-left: 37px
}
.button.icon i{
    background-image: url('page/glyphicons01w.png');
}
.button i {
    display: inline-block;
    height: 34px;
    left: 5px;
    position: absolute;
    top: 0;
    width: 34px;
}
.button.black i{ background-image: url('page/glyphicons01.png');}
.button.blue i{ background-image: url('page/glyphicons01b.png');}
.button.pink i{ background-image: url('page/glyphicons01p.png');}
.button.green i{ background-image: url('page/glyphicons01g.png');}
.button.red i{ background-image: url('page/glyphicons01r.png');}
.button.yellow i{ background-image: url('page/glyphicons01y.png');}

/* colum step -58    (((n-1) x 58)-6) x (-1) */
/* line 1 */
.button.tag i{ background-position: 6px 2px; }    /* col 1 */
.button.ok i{ background-position: -52px 2px; }    /* col 2 */
.button.delete i{ background-position: -110px 2px; }    /* col 3 */
.button.add i{ background-position: -168px 2px; }    /* col 4 */
.button.sub i{ background-position: -226px 2px; }    /* col 5 */
.button.star i{ background-position: -284px 2px; }    /* col 6 */
.button.loop i{ background-position: -342px 2px; }    /* col 7 */
.button.down i{ background-position: -400px 2px; }    /* col 8 */
.button.up i{ background-position: -458px 2px; }    /* col 9 */
.button.right i{ background-position: -516px 2px; }    /* col 10 */
.button.left i{ background-position: -574px 2px; }    /* col 11 */
.button.visit i{ background-position: -632px 2px; }    /* col 12 */
.button.confirm i{ background-position: -690px 2px; }    /* col 13 */
.button.warning i{ background-position: -748px 2px; }    /* col 14 */

/* line 3 */
.button.key i{ background-position: 6px -44px; }    /* col 1 */
.button.list i{ background-position: -52px -44px; }    /* col 2 */
.button.layout i{ background-position: -110px -44px; }    /* col 3 */
.button.bar i{ background-position: -168px -44px; }    /* col 4 */
.button.card i{ background-position: -226px -44px; }    /* col 5 */
.button.grid i{ background-position: -284px -44px; }    /* col 6 */
.button.full i{ background-position: -342px -44px; }    /* col 7 */
.button.resize i{ background-position: -400px -44px; }    /* col 8 */
.button.date i{ background-position: -458px -44px; }    /* col 9 */
.button.calendar i{ background-position: -516px -44px; }    /* col 10 */
.button.group i{ background-position: -574px -44px; }    /* col 11 */
.button.person i{ background-position: -632px -44px; }    /* col 12 */
.button.man i{ background-position: -690px -44px; }    /* col 13 */
.button.girl i{ background-position: -748px -44px; }    /* col 14 */

/* line 3 */
.button.rubber i{ background-position: 6px -90px; }    /* col 1 */
.button.pen i{ background-position: -52px -90px; }    /* col 2 */
.button.edit i{ background-position: -110px -90px; }    /* col 3 */
.button.pencil i{ background-position: -168px -90px; }    /* col 4 */
.button.t1 i{ background-position: -226px -90px; }    /* col 5 */
.button.t2 i{ background-position: -284px -90px; }    /* col 6 */
.button.bag i{ background-position: -342px -90px; }    /* col 7 */
.button.disk i{ background-position: -400px -90px; }    /* col 8 */
.button.crop i{ background-position: -458px -90px; }    /* col 9 */
.button.mail i{ background-position: -516px -90px; }    /* col 10 */
.button.mail2 i{ background-position: -574px -90px; }    /* col 11 */
.button.box i{ background-position: -632px -90px; }    /* col 12 */
.button.clip i{ background-position: -690px -90px; }    /* col 13 */
.button.clip2 i{ background-position: -748px -90px; }    /* col 14 */