.shadow_inset {
  -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.4) inset;
  -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.4) inset;
  box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0px -20px 40px rgba(0, 0, 0, 0.4) inset;
}
.shadow_inset:before,
.shadow_inset:after {
  content: "";
  position: absolute;
  z-index: -2;
  bottom:15px;
  left:10px;
  width:50%;
  height:20%;
  -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
  -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
  box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
  -webkit-transform:rotate(-3deg);
  -moz-transform:rotate(-3deg);
  -ms-transform:rotate(-3deg);
  -o-transform:rotate(-3deg);
  transform:rotate(-3deg);
}

.surf {
  -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.4) inset;
  -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.4) inset;
  box-shadow:0 1px 4px rgba(0, 0, 0, 0.8), 0px 0px 16px rgba(0, 0, 0, 0.4) inset;
  -webkit-border-radius:3px 1px 1px 3px;
  -moz-border-radius:3px 1px 1px 3px;
  border-radius:1px 1px 3px 3px;
}

.qat_bubble {
  position:relative;
  padding:16px;
  margin:1em 0 1em;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
  -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.8), 0 0 20px rgba(0, 0, 0, 0.4);
  -moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.8), 0 0 20px rgba(0, 0, 0, 0.4);
  box-shadow:0 1px 2px rgba(0, 0, 0, 0.8), 0 0 20px rgba(0, 0, 0, 0.4);
}
.qat_bubble:after {
  content:"";
  position:absolute;
  top: 24px;
  right: -32px;
  bottom: auto;
  left: auto;
  border-width:10px 0 10px 32px; /* vary these values to change the angle of the vertex */
  border-style:solid;
  border-color: transparent #322222;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

#header {
  box-shadow:-1px 1px 1px rgba(0, 0, 0, 0.8), -20px 0px 40px rgba(0, 0, 0, 0.2) inset;
}

#menu {
  -webkit-box-shadow:0 0 40px rgba(0, 0, 0, 0.2) inset;
  -moz-box-shadow:0 0 40px rgba(0, 0, 0, 0.2) inset;
  box-shadow:-1px 2px 1px rgba(0, 0, 0, 0.8), 0px 0px 40px rgba(0, 0, 0, 0.2) inset;
  -webkit-border-radius:3px 1px 1px 3px;
  -moz-border-radius:3px 1px 1px 3px;
  border-radius:1px 1px 3px 3px;
}

#content {
  -webkit-box-shadow:0 0 40px rgba(0, 0, 0, 0.2) inset;
  -moz-box-shadow:0 0 40px rgba(0, 0, 0, 0.2) inset;
  box-shadow:-1px 1px 1px rgba(0, 0, 0, 0.8), 0px 0px 40px rgba(0, 0, 0, 0.2) inset;
  -webkit-border-radius:3px 1px 1px 3px;
  -moz-border-radius:3px 1px 1px 3px;
  border-radius:3px 1px 1px 3px;
}

#menu h1, h2, h3, h4, h5, h6 {
  -webkit-box-shadow:1 0px 1px rgba(0, 0, 0, 0.8);
  -moz-box-shadow:0 0px 1px rgba(0, 0, 0, 0.8);
  box-shadow:-2px 0px 1px rgba(0, 0, 0, 0.8);
  margin-left: -10%;
  font-weight: bold;
}

#menu h1 { margin-left: -10%; }


#content h1, h2, h3, h4, h5, h6 {
  -webkit-box-shadow:1 0px 1px rgba(0, 0, 0, 0.8);
  -moz-box-shadow:0 0px 1px rgba(0, 0, 0, 0.8);
  box-shadow:-2px 0px 1px rgba(0, 0, 0, 0.8);
  margin-left: -10%;
  margin-top: 0.5em;
  font-weight: bold;
}

#content h1 { margin-left: -10%; font-size: 24pt; }
#content h2 { margin-left: -9%; font-size: 22pt; }
#content h3 { margin-left: -8%; font-size: 20pt; }
#content h4 { margin-left: -7%; font-size: 18pt; }
#content h5 { margin-left: -6%; font-size: 16pt; }
#content h6 { margin-left: -5%; font-size: 14pt; }

#content pre {
  -webkit-box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1) inset;
  -moz-box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1) inset;
  box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1) inset;
}


.shadow_light {
  -webkit-box-shadow:0 0px 1px rgba(0, 0, 0, 0.8);
  -moz-box-shadow:0 0px 1px rgba(0, 0, 0, 0.8);
  box-shadow:0 0px 1px rgba(0, 0, 0, 0.8);
}