kettek/css/style_pretty.css

121 lines
3.6 KiB
CSS

.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);
}