3D CSS Rollover Buttons Without Images

It turns out it’s not that hard to create the illusion of a 3D rollover button using nothing more than CSS and no images. Play the video below to watch over my shoulder as I do it.

Color Scheme Generator 2:
http://www.wellstyled.com/tools/colorscheme2/index-en.html
The CSS:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
input.subscribeButton {
font-family: Arial, Helvetica, sans-serif;
color: #333333;
font-weight: bold;
border: 2px solid;
padding: 2px 5px 2px 5px;
border-color: #D9D4C3 [...]