/*
*@module: button 
*@Author: zmx 2013-02-16
*@Update: juhailin 2014-01-16
*@log: del .btn:*line-height:16px;
*@log: ie6 ie7 <A> <button> vertical
*@log: add btn btn-system.. background-image
*/
.btn, .btn:link, .btn:visited {
  line-height: 28px;
  height: 28px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  text-align: center;
  padding: 0 15px;
  color: #333;
  overflow: visible;
  cursor: pointer;
  text-shadow: 1px 1px white;
  background-color: #f3f3f3;
  border: solid 1px #cccccc;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #e6e6e6), color-stop(100%, #f7f7f7));
  background-image: -webkit-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -moz-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -o-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(to bottom, #f7f7f7, #e6e6e6);
}

a.btn, a.btn:link, a.btn:visited {
  height: 26px;
  line-height: 26px;
  *vertical-align: top;
}

button.btn {
  _height: 28px!important;
  *padding: 0 5px;
  *line-height: 26px;
  overflow: hidden;
}

.btn-small, .btn-small:link, .btn-small:visited {
  line-height: 24px;
  height: 24px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  text-align: center;
  padding: 0 10px;
  color: #333;
  overflow: visible;
  cursor: pointer;
  text-shadow: 1px 1px white;
  background-color: #f3f3f3;
  border: solid 1px #cccccc;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #e6e6e6), color-stop(100%, #f7f7f7));
  background-image: -webkit-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -moz-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -o-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(to bottom, #f7f7f7, #e6e6e6);
}

a.btn-small {
  height: 22px;
  line-height: 22px;
}

.btn-large, .btn-large:link, .btn-large:visited {
  font-size: 14px;
  line-height: 36px;
  height: 36px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  text-align: center;
  padding: 0 15px;
  color: #333;
  overflow: visible;
  cursor: pointer;
  text-shadow: 1px 1px white;
  background-color: #f3f3f3;
  border: solid 1px #cccccc;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #e6e6e6), color-stop(100%, #f7f7f7));
  background-image: -webkit-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -moz-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: -o-linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(bottom, #e6e6e6, #f7f7f7);
  background-image: linear-gradient(to bottom, #f7f7f7, #e6e6e6);
}

a.btn-large {
  height: 34px;
  line-height: 34px;
}

.btn:hover, .btn-large:hover, .btn-small:hover {
  color: #333;
  background-color: #e9e9e9;
  text-decoration: none;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #f7f7f7, #e6e6e6);
}

.btn:active
, .btn-large:active
, .btn-small:active {
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}

.btn-main, .btn-main:link, .btn-main:visited {
  color: #fff;
  background-color: #e64545;
  border: solid 1px #e64545;
  text-shadow: 0 1px rgba(51, 51, 51, 0.3);
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #e64545), color-stop(100%, #e65050));
  background-image: -webkit-linear-gradient(bottom, #e64545, #e65050);
  background-image: -moz-linear-gradient(bottom, #e64545, #e65050);
  background-image: -o-linear-gradient(bottom, #e64545, #e65050);
  background-image: linear-gradient(bottom, #e64545, #e65050);
  background-image: linear-gradient(to bottom, #e65050, #e64545);
}

.btn-main:hover {
  color: #fff;
  border: solid 1px #e64545;
  background-color: #e64545;
  text-shadow: 0 1px rgba(51, 51, 51, 0.3);
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #e65050, #e64545);
}

.btn-main:active {
  color: #fff;
  border: solid 1px #e64545;
  background-color: #e65050;
  text-shadow: 0 1px rgba(51, 51, 51, 0.3);
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #e65050, #e64545);
}

.btn-main-light{
  color: #e64545 !important;
  background: rgba(230, 69, 69, .1);
  border: 1px solid #e64545;
}

.btn-main-light:hover{
   color: #e64545 !important;
   border: solid 1px #e64545;
   background: rgba(230, 69, 69, .2);
 }

.btn-system, .btn-system:link, .btn-system:visited {
  color: #fff;
  background-color: #538eed;
  border: solid 1px #4582e5;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  text-shadow: 0 1px rgba(51, 51, 51, 0.3);
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #4787ed), color-stop(100%, #6498ed));
  background-image: -webkit-linear-gradient(bottom, #4787ed, #6498ed);
  background-image: -moz-linear-gradient(bottom, #4787ed, #6498ed);
  background-image: -o-linear-gradient(bottom, #4787ed, #6498ed);
  background-image: linear-gradient(bottom, #4787ed, #6498ed);
  background-image: linear-gradient(to bottom, #6498ed, #4787ed);
}

.btn-system:hover {
  color: #fff;
  background-color: #538eed;
  border: 1px solid #4582e5;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #6498ed, #4787ed);
}

.btn-system:active {
  color: #fff;
  background-color: #538eed;
  border: 1px solid #4582e5;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #6498ed, #4787ed);
}

.btn-succ, .btn-succ:link, .btn-succ:visited {
  color: #fff;
  background-color: #49ac49;
  border: solid 1px #42a642;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  text-shadow: 0 1px rgba(51, 51, 51, 0.3);
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #42a642), color-stop(100%, #50b250));
  background-image: -webkit-linear-gradient(bottom, #42a642, #50b250);
  background-image: -moz-linear-gradient(bottom, #42a642, #50b250);
  background-image: -o-linear-gradient(bottom, #42a642, #50b250);
  background-image: linear-gradient(bottom, #42a642, #50b250);
  background-image: linear-gradient(to bottom, #50b250, #42a642);
}

.btn-succ:hover {
  color: #fff;
  background-color: #49ac49;
  border: 1px solid #42a642;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #50b250, #42a642);
}

.btn-succ:active {
  color: #fff;
  background-color: #49ac49;
  border: 1px solid #42a642;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #50b250, #42a642);
}

.btn-warning, .btn-warning:link, .btn-warning:visited {
  color: #703602;
  background-color: #ffb319;
  border: solid 1px #ffb319;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
  background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #ffb319), color-stop(100%, #ffb726));
  background-image: -webkit-linear-gradient(bottom, #ffb319, #ffb726);
  background-image: -moz-linear-gradient(bottom, #ffb319, #ffb726);
  background-image: -o-linear-gradient(bottom, #ffb319, #ffb726);
  background-image: linear-gradient(bottom, #ffb319, #ffb726);
  background-image: linear-gradient(to bottom, #ffb726, #ffb319);
}

.btn-warning:hover {
  color: #703602;
  background-color: #ffb319;
  border: solid 1px #ffb319;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #ffb726, #ffb319);
}

.btn-warning:active {
  color: #703602;
  background-color: #ffb319;
  border: solid 1px #ffb319;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: linear-gradient(to bottom, #ffb726, #ffb319);
}

.btn-disabled, .btn-disabled:hover, .btn-disabled:link, .btn-disabled:visited {
  color: #999;
  background-color: #dcdcdc;
  border: solid 1px #d4d4d4;
  text-shadow: 1px 1px rgba(255, 255, 255, 0.6);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: inset 1px 1px rgba(255, 255, 255, 0.1);
  -moz-box-shadow: inset 1px 1px rgba(255, 255, 255, 0.1);
  box-shadow: inset 1px 1px rgba(255, 255, 255, 0.1);
  background-image: linear-gradient(to bottom, #e0e0e0, #d9d9d9);
}