Ajax Loader
HTML 
<div class="plate">
1
<div class="plate">
2
  <p class="script"><span>The Real</span></p>
3
  <p class="shadow text1">AMERICAN</p>
4
  <p class="shadow text2">BBQ</p>
5
  <p class="shadow text3">SAUCE</p>
6
  <p class="script"><span>by Remia</span></p>
7
</div>
 
CSS 
@import url(http://fonts.googleapis.com/css?family=Arvo:700);
1
@import url(http://fonts.googleapis.com/css?family=Arvo:700);
2
@import url(http://fonts.googleapis.com/css?family=Seaweed+Script);
3
body {
4
  background-color: #222;
5
}
6
.plate {
7
  width: 410px;
8
  margin: 10% auto;
9
}
10
.shadow {
11
  color: #fff;
12
  font-family: Arvo;
13
  font-weight: bold;
14
  text-shadow:
15
    -3px -3px 0 #222,
16
    3px -3px 0 #222,
17
    -3px 3px 0 #222,
18
    3px 3px 0 #222,
19
    4px 4px 0 #fff,
20
    5px 5px 0 #fff,
21
    6px 6px 0 #fff,
22
    7px 7px 0 #fff;
23
  line-height: 0.8em;
24
  letter-spacing: 0.1em;
25
  transform: scaleY(0.7);
26
  -webkit-transform: scaleY(0.7);
27
  -moz-transform: scaleY(0.7);
28
  margin:0;
29
  text-align: center;
30
}
31
.script {
32
  font-family: "Seaweed Script";
33
  color: #fff;
34
  text-align: center;
35
  font-size: 40px;
36
  position: relative;
37
  margin:0;
38
}
39
.script span {
40
  background-color: #222;
41
  padding: 0 0.3em;
42
}
43
.script:before {
44
  content:"";
45
  display: block;
46
  position: absolute;
47
  z-index:-1;
48
  top: 50%;
49
  width: 100%;
50
  border-bottom: 3px solid #fff;
51
}
52
.text1 {
53
  font-size: 60px;
54
}
55
.text2 {
56
  font-size: 169px;
57
}
58
.text3 {
59
  font-size: 100px;
60
}
 

CSS3 Typography

CSSDeck G+