/*
*@module: tips 
*@Author: zmx 2013-02-16
*@Update: zmx 2013-08-21
*/
.tips {
  position: absolute;
  padding: 5px 10px;
  border-radius: 3px;
  font-size: 12px;
  background: #fff4bd;
  border: 1px solid #f3ca4f; }
  .tips .arrow {
    position: absolute;
    zoom: 1;
    width: 0px;
    height: 0px;
    line-height: 0;
    font-size: 0;
    border: 8px dashed transparent; }
  .tips .arrow-top {
    border-bottom: 8px solid #f3ca4f;
    left: 20px;
    top: -16px; }
    .tips .arrow-top .arrow-in {
      border-bottom: 8px solid #fff4bd;
      margin: -7px 0 0 -8px; }
  .tips .arrow-right {
    border-left: 8px solid #f3ca4f;
    top: 20px;
    right: -16px;
    _right: -17px; }
    .tips .arrow-right .arrow-in {
      border-left: 8px solid #fff4bd;
      margin: -8px 0 0 -9px; }
  .tips .arrow-bottom {
    border-top: 8px solid #f3ca4f;
    left: 20px;
    bottom: -16px; }
    .tips .arrow-bottom .arrow-in {
      border-top: 8px solid #fff4bd;
      margin: -9px 0 0 -8px; }
  .tips .arrow-left {
    border-right: 8px solid #f3ca4f;
    top: 20px;
    left: -16px; }
    .tips .arrow-left .arrow-in {
      border-right: 8px solid #fff4bd;
      margin: -8px 0 0 -7px; }
  .tips .close {
    float: right;
    display: block;
    color: #000000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20);
    position: absolute;
    right: 1px;
    top: 3px; }
  .tips .close:hover {
    color: #000000;
    text-decoration: none;
    opacity: 0.4;
    filter: alpha(opacity=40);
    cursor: pointer; }

.tips-shut {
  padding: 5px 25px 5px 10px; }

.tips-wrong {
  background: #ffdbdb;
  border: 1px solid #f9adad; }
  .tips-wrong .arrow-top {
    border-bottom: 8px solid #f9adad;
    left: 20px;
    top: -16px; }
    .tips-wrong .arrow-top .arrow-in {
      border-bottom: 8px solid #ffdbdb;
      margin: -7px 0 0 -8px; }
  .tips-wrong .arrow-right {
    border-left: 8px solid #f9adad;
    top: 20px;
    right: -16px;
    _right: -17px; }
    .tips-wrong .arrow-right .arrow-in {
      border-left: 8px solid #ffdbdb;
      margin: -8px 0 0 -9px; }
  .tips-wrong .arrow-bottom {
    border-top: 8px solid #f9adad;
    left: 20px;
    bottom: -16px; }
    .tips-wrong .arrow-bottom .arrow-in {
      border-top: 8px solid #ffdbdb;
      margin: -9px 0 0 -8px; }
  .tips-wrong .arrow-left {
    border-right: 8px solid #f9adad;
    top: 20px;
    left: -16px; }
    .tips-wrong .arrow-left .arrow-in {
      border-right: 8px solid #ffdbdb;
      margin: -8px 0 0 -7px; }

.tips-succ {
  background: #d8f5c4;
  border: 1px solid #a7ca92; }
  .tips-succ .arrow-top {
    border-bottom: 8px solid #a7ca92;
    left: 20px;
    top: -16px; }
    .tips-succ .arrow-top .arrow-in {
      border-bottom: 8px solid #d8f5c4;
      margin: -7px 0 0 -8px; }
  .tips-succ .arrow-right {
    border-left: 8px solid #a7ca92;
    top: 20px;
    right: -16px;
    _right: -17px; }
    .tips-succ .arrow-right .arrow-in {
      border-left: 8px solid #d8f5c4;
      margin: -8px 0 0 -9px; }
  .tips-succ .arrow-bottom {
    border-top: 8px solid #a7ca92;
    left: 20px;
    bottom: -16px; }
    .tips-succ .arrow-bottom .arrow-in {
      border-top: 8px solid #d8f5c4;
      margin: -9px 0 0 -8px; }
  .tips-succ .arrow-left {
    border-right: 8px solid #a7ca92;
    top: 20px;
    left: -16px; }
    .tips-succ .arrow-left .arrow-in {
      border-right: 8px solid #d8f5c4;
      margin: -8px 0 0 -7px; }

.tips-system {
  background: #dbe9ff;
  border: 1px solid #b4c9e7; }
  .tips-system .arrow-top {
    border-bottom: 8px solid #b4c9e7;
    left: 20px;
    top: -16px; }
    .tips-system .arrow-top .arrow-in {
      border-bottom: 8px solid #dbe9ff;
      margin: -7px 0 0 -8px; }
  .tips-system .arrow-right {
    border-left: 8px solid #b4c9e7;
    top: 20px;
    right: -16px;
    _right: -17px; }
    .tips-system .arrow-right .arrow-in {
      border-left: 8px solid #dbe9ff;
      margin: -8px 0 0 -9px; }
  .tips-system .arrow-bottom {
    border-top: 8px solid #b4c9e7;
    left: 20px;
    bottom: -16px; }
    .tips-system .arrow-bottom .arrow-in {
      border-top: 8px solid #dbe9ff;
      margin: -9px 0 0 -8px; }
  .tips-system .arrow-left {
    border-right: 8px solid #b4c9e7;
    top: 20px;
    left: -16px; }
    .tips-system .arrow-left .arrow-in {
      border-right: 8px solid #dbe9ff;
      margin: -8px 0 0 -7px; }

.alert {
  margin: 10px 0;
  padding: 5px 10px;
  position: relative;
  background: #fff4bf;
  border: 1px solid #f3ca4f; }
  .alert .state .icon {
    color: #c58619; }
  .alert .close {
    float: right;
    display: block;
    color: #000000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20);
    position: absolute;
    right: 1px;
    top: 3px; }
  .alert .close:hover {
    color: #000000;
    text-decoration: none;
    opacity: 0.4;
    filter: alpha(opacity=40);
    cursor: pointer; }

.alert-con .hd {
  font-weight: 700;
  margin-bottom: 10px; }
.alert-con p {
  margin: 0; }
.alert-con ul li {
  list-style-type: disc;
  margin-left: 15px; }
.alert-con .underline a {
  text-decoration: underline; }

.alert-wrong {
  background: #ffd9d9;
  border: 1px solid #f9adad; }
  .alert-wrong .state .icon {
    color: #e64552; }

.alert-succ {
  background: #d6f2c2;
  border: 1px solid #a7ca92; }
  .alert-succ .state .icon {
    color: #5cbb5c; }

.alert-system {
  background: #d9e9ff;
  border: 1px solid #b4c9e7; }
  .alert-system .state .icon {
    color: #6292d8; }

.alert-shut {
  padding-right: 25px; }

.alert-state {
  padding-left: 50px; }
  .alert-state .state {
    position: absolute;
    top: 10px;
    left: 15px; }
    .alert-state .state .icon {
      font-size: 28px; }

.alert-blank {
  border: none;
  background: none; }