/*
 * This code is unlicensed and stuff. Go make cool things. Maybe link to http://somadesign.ca if you want. And tell me what you've done.
 *
 * Inspired by:
 * 	http://blog.anomalyinnovations.com/2010/03/creating-a-realistic-looking-button-with-css3/
 * 	http://flyosity.com/tutorial/crafting-subtle-realistic-user-interfaces.php
 *
 */
/* line 11, ../../vendor/assets/stylesheets/buttons.css.scss */
.button, input[type=button], input[type=submit], button {
  text-decoration: none;
  border-color: #888;
  border-color: rgba(0, 0, 0, 0.56);
  cursor: pointer;
  outline: none;
  color: #111;
  font-family: "Lucida Grande","Lucida Sans","Lucida Sans Unicode","Segoe UI",Verdana,sans-serif;
  display: inline-block;
  font-weight: bold;
  text-align: center;
  background-color: #aaa;
  background-image: url(/nals/assets/button-gradient.png);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.75)), to(rgba(255, 255, 255, 0)));
  background-image: linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
  background-repeat: repeat-x;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.67);
  line-height: 2;
  padding: 0 1em;
  height: 2em;
  -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset, -1px -1px 0 rgba(255, 255, 255, 0.5) inset;
  -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset, -1px -1px 0 rgba(255, 255, 255, 0.5) inset;
  box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) inset, -1px -1px 0 rgba(255, 255, 255, 0.5) inset;
  -webkit-transition: background .185s linear;
  -moz-transition: all .185s linear;
  -o-transition: all .185s linear;
  transition: all .185s linear;
  /** Make the text unselectable **/
  -moz-user-select: none;
  -webkit-user-select: none;
}

/* line 44, ../../vendor/assets/stylesheets/buttons.css.scss */
.button, button, input[type=submit], input[type=button] {
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
}

/* line 52, ../../vendor/assets/stylesheets/buttons.css.scss */
.button:hover, .button:focus, button:hover, button:focus, input[type=button]:hover, input[type=button]:focus, input[type=submit]:hover, input[type=submit]:focus {
  background-color: #a8c0cb;
}

/* line 55, ../../vendor/assets/stylesheets/buttons.css.scss */
.button:active, button:active, input[type=submit]:active, input[type=button]:active {
  line-height: 2.2;
  -moz-box-shadow: 0 0.33em 1em rgba(0, 0, 0, 0.67) inset, 1px 1px 0 rgba(255, 255, 255, 0.25) inset, -1px -1px 0 rgba(255, 255, 255, 0.25) inset;
  -webkit-box-shadow: 0 0.33em 2em rgba(0, 0, 0, 0.67) inset, 1px 1px 0 rgba(255, 255, 255, 0.25) inset, -1px -1px 0 rgba(255, 255, 255, 0.25) inset;
  box-shadow: 0 0.33em 2em rgba(0, 0, 0, 0.67) inset, 1px 1px 0 rgba(255, 255, 255, 0.25) inset, -1px -1px 0 rgba(255, 255, 255, 0.25) inset;
  -webkit-transition: line-height .1s linear;
  -moz-transition: all .1s linear;
  -o-transition: all .1s linear;
  transition: all .1s linear;
}

/* line 74, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.bg, .button.bg:hover, .button.bg:focus {
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.75)), to(rgba(255, 255, 255, 0)));
}

/* Colors/Styles */
/* line 80, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.blue {
  background-color: #9eb4bf;
}

/* line 83, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.blue:hover {
  background-color: #b4cdda;
}

/* line 86, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.darkblue {
  background-color: #046;
  color: #fff;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
}

/* line 91, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.darkblue:hover {
  background-color: #00547e;
}

/* line 94, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.red {
  background-color: #900;
  color: #fff;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
}

/* line 99, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.red:hover {
  background-color: #b30000;
}

/* line 102, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.pill, .button.pill:before {
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  border-radius: 1em;
}

/* line 107, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.black {
  background-color: #000;
  color: #fff;
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
}

/* line 112, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.black:hover {
  background-color: #222;
}

/* line 115, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.sharp {
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.33) 50%, transparent 50%, transparent 100%);
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.75)), color-stop(0.5, rgba(255, 255, 255, 0.33)), color-stop(0.5, transparent), to(transparent));
  background-repeat: repeat-x;
}

/* line 125, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.small {
  font-size: 10px;
}

/* line 128, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.large {
  font-size: 15px;
}

/* line 131, ../../vendor/assets/stylesheets/buttons.css.scss */
.button.webkit {
  -webkit-transition: all .185s linear;
}
