cssOMS/button.css

/* Global */
/* Content Container */
/* Content box */
/* Navigation */
/* Colors */
.btn {
  cursor: pointer; }

button, input[type="submit"], input[type="button"], a.button {
  border: 1px solid #b7b7b7;
  cursor: pointer;
  text-shadow: 1px 1px 1px #ffffff;
  min-width: 70px;
  height: 2rem;
  font-size: 0.9rem;
  background: #f1f1f1;
  -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
  box-shadow: inset 1px 1px 0px 0px #ffffff; }
  button:hover, button :active, input[type="submit"]:hover, input[type="submit"] :active, input[type="button"]:hover, input[type="button"] :active, a.button:hover, a.button :active {
    text-shadow: -1px -1px 1px #ffffff;
    background: #d6d6d6; }

button.red {
  color: #ffffff;
  text-shadow: 1px 1px 1px #696969;
  background: #d9645b;
  background: -moz-linear-gradient(top, #f17068 0, #d16059 100);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f17068), color-stop(100, #d16059));
  background: -webkit-linear-gradient(top, #f17068 0, #d16059 100);
  background: -o-linear-gradient(top, #f17068 0, #d16059 100);
  background: -ms-linear-gradient(top, #f17068 0, #d16059 100);
  background: linear-gradient(to bottom, #f17068 0, #d16059 100);
  -moz-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
  -webkit-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
  box-shadow: inset 1px 1px 0px 0px #ff8d7c; }
  button.red:hover, button.red :active {
    text-shadow: -1px -1px 1px #696969;
    background: #d9645b;
    background: -moz-linear-gradient(top, #d16059 0, #f17068 100);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d16059), color-stop(100, #f17068));
    background: -webkit-linear-gradient(top, #d16059 0, #f17068 100);
    background: -o-linear-gradient(top, #d16059 0, #f17068 100);
    background: -ms-linear-gradient(top, #d16059 0, #f17068 100);
    background: linear-gradient(to bottom, #d16059 0, #f17068 100); }

button.green {
  color: #ffffff;
  text-shadow: 1px 1px 1px #696969;
  background: #90d99d;
  background: -moz-linear-gradient(top, #9df1ad 0, #77d17c 100);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9df1ad), color-stop(100, #77d17c));
  background: -webkit-linear-gradient(top, #9df1ad 0, #77d17c 100);
  background: -o-linear-gradient(top, #9df1ad 0, #77d17c 100);
  background: -ms-linear-gradient(top, #9df1ad 0, #77d17c 100);
  background: linear-gradient(to bottom, #9df1ad 0, #77d17c 100);
  -moz-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
  -webkit-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
  box-shadow: inset 1px 1px 0px 0px #c8ffb6; }
  button.green:hover, button.green :active {
    text-shadow: -1px -1px 1px #696969;
    background: #90d99d;
    background: -moz-linear-gradient(top, #77d17c 0, #9df1ad 100);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #77d17c), color-stop(100, #9df1ad));
    background: -webkit-linear-gradient(top, #77d17c 0, #9df1ad 100);
    background: -o-linear-gradient(top, #77d17c 0, #9df1ad 100);
    background: -ms-linear-gradient(top, #77d17c 0, #9df1ad 100);
    background: linear-gradient(to bottom, #77d17c 0, #9df1ad 100); }

button.blue {
  color: #ffffff;
  text-shadow: 1px 1px 1px #696969;
  background: #97afd9;
  background: -moz-linear-gradient(top, #beddf1 0, #7ba9d1 100);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #beddf1), color-stop(100, #7ba9d1));
  background: -webkit-linear-gradient(top, #beddf1 0, #7ba9d1 100);
  background: -o-linear-gradient(top, #beddf1 0, #7ba9d1 100);
  background: -ms-linear-gradient(top, #beddf1 0, #7ba9d1 100);
  background: linear-gradient(to bottom, #beddf1 0, #7ba9d1 100);
  -moz-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
  -webkit-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
  box-shadow: inset 1px 1px 0px 0px #cbf3ff; }
  button.blue:hover, button.blue :active {
    text-shadow: -1px -1px 1px #696969;
    background: #97afd9;
    background: -moz-linear-gradient(top, #7ba9d1 0, #beddf1 100);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #7ba9d1), color-stop(100, #beddf1));
    background: -webkit-linear-gradient(top, #7ba9d1 0, #beddf1 100);
    background: -o-linear-gradient(top, #7ba9d1 0, #beddf1 100);
    background: -ms-linear-gradient(top, #7ba9d1 0, #beddf1 100);
    background: linear-gradient(to bottom, #7ba9d1 0, #beddf1 100); }

ul.btns {
  list-style: none;
  overflow: hidden;
  font-size: 12px; }
  ul.btns li {
    background: #f5f5ff;
    border-left: 1px solid #b7b7b7;
    border-top: 1px solid #b7b7b7;
    border-bottom: 1px solid #b7b7b7;
    float: left;
    text-shadow: -1px -1px 1px #ffffff;
    cursor: pointer;
    -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
    -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
    box-shadow: inset 1px 1px 0px 0px #ffffff; }
    ul.btns li:last-child {
      border-right: 1px solid #b7b7b7; }
    ul.btns li:before {
      border-left-color: #b7b7b7;
      margin-left: 1px; }
  ul.btns a {
    display: block;
    padding: 10px; }
  ul.btns .active {
    cursor: default; }
  ul.btns .active, ul.btns li:hover {
    background: #ffffff; }

button.simple {
  background: #f5f5ff;
  border: 1px solid #b7b7b7;
  text-shadow: -1px -1px 1px #ffffff;
  padding: 5px;
  min-width: 40px; }
  button.simple:hover {
    background: #ffffff; }

/*# sourceMappingURL=button.css.map */