/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

* { margin: 0; padding: 0; }
body { font: 14px Georgia, serif; background: #ca7000 url(../images/bg.png) top center no-repeat; }
#page-wrap { width: 500px; margin: 0 auto; padding: 240px 0 0 0; }
a { outline: 0; }

ul { list-style: none; }
ul li { margin: 0 0 5px 0; }
ul li a { background: rgba(255,138,30,0.2); padding: 10px; display: block; -moz-border-radius: 12px; -webkit-border-radius: 12px; color: #402e16; text-decoration: none; font: bold 14px Helvetica, Sans-Serif; letter-spacing: -1px; }
ul li a span { background: #402e16; color: white; padding: 4px 8px; -moz-border-radius: 9px; -webkit-border-radius: 9px; margin: 0 5px 0 0; }
ul li a:hover { background: rgba(255,138,30,0.7); -moz-box-shadow: 0 0 10px #333; -webkit-box-shadow: 0 0 10px #333; }
ul li a:hover span { background: black; }

.button { display: block; text-indent: -9999px; background: url(../images/buttons.png); width: 231px; height: 84px; float: left; margin: 30px 15px 30px 10px; }
#button-source {  }
#button-source:hover { background-position: 0 -84px; }
#button-source:active { background-position: 0 -168px; }

#button-photoshop { background-position: -231px 0; margin-right: 0; }
#button-photoshop:hover { background-position: -231px -84px; }
#button-photoshop:active { background-position: -231px -168px; }

p { text-align: center; font: 30px Georgia, Serif; color: white; }
p a { color: white; text-decoration: none; }
p span { font: 14px Georgia, Serif; text-transform: uppercase; letter-spacing: 4px; display: block; }
p a:hover { text-decoration: underline; }