kennethkalmer/powerdns-on-rails

/* recommended base settings */
html, body { height: 100%; }
.humane {
  filter                : progid:DXImageTransform.Microsoft.alpha(opacity=100);
  -ms-filter            : "progid:DXImageTransform.Microsoft.alpha(opacity=100)";
  position              : fixed;
  _position             : absolute; /* ie6 */
  -moz-transition       : all .5s;  /* .5s transition */
  -webkit-transition    : all .5s;
  -o-transition         : all .5s;
  -ms-transition        : all .5s;
  transition            : all .5s;
  visibility            : hidden;
  z-index               : 100000;
}
.humane.humane-show { visibility : visible; }
/* ie hover state, recommended */
.humane:hover {
  filter                : progid:DXImageTransform.Microsoft.alpha(opacity=20);
  -ms-filter            : "progid:DXImageTransform.Microsoft.alpha(opacity=20)";
}
/* standards hover state, recommended */
div.humane.humane-show:hover { opacity: 0.2; }

/* custom settings */
.humane {
  font-family           : Verdana, sans-serif;
  font-size             : 25px;
  letter-spacing        : -1px;
  top                   : 25%;
  left                  : 25%;
  opacity               : 0;
  width                 : 50%;
  color                 : #fff;
  padding               : 10px;
  text-align            : center;
  background-color      : #000;
  background-color      : rgba(0,0,0,0.8);
  background-image      : -moz-linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));
  background-image      : -ms-linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));
  background-image      : -o-linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));
  background-image      : -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.8)), to(rgba(50,50,50,.8)));
  background-image      : -webkit-linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));
  background-image      : linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));;
  -moz-border-radius    : 15px;
  -webkit-border-radius : 15px;
  -o-border-radius      : 15px;
  border-radius         : 15px;
  text-shadow           : 0 -1px 1px #ddd;
  -moz-box-shadow       : 0 4px 4px -4px #000;
  -webkit-box-shadow    : 0 4px 4px -4px #000;
  box-shadow            : 0 4px 4px -4px #000;
}

/* custom animation for css transition supported browsers */
.humane.humane-show { opacity: 1; }

/* other customizations */
.humane p {
  margin                : 1em;
  display               : inline;
}
.humane ul {
  list-style            : none;
  margin                : 0;
  padding               : 0;
}
.humane .error {
  color                 : red;
  text-shadow           : 0 -1px 1px #f33;
}