* { margin: 0; padding: 0; }
img { border: 0; }
body { margin: 6em 0; background-color: #ddd; font-family: Consolas, "Bitstream Vera Sans", Arial, sans-serif; }
#wrap { margin: auto; background-color: #fff; color: #444; }

.bl { width: 580px; margin: 0 auto; background: url(../images/bl.gif) 0 100% no-repeat #fff; }
.br { background: url(../images/br.gif) 100% 100% no-repeat; }
.tl { background: url(../images/tl.gif) 0 0 no-repeat; }
.tr { padding: 1em; background: url(../images/tr.gif) 100% 0 no-repeat; }

#titlebar h1 { color: #888; font-size: 10px; line-height: 200%; font-weight: normal; text-align: center; letter-spacing: .05em; }

#header { height: 200px; background: url(../images/wad3.gif) 30px 20px no-repeat #fff; }
#header ul { top: 40px; position: relative; float: right; padding-right: 30px; list-style-type: none; text-align: left; }
#header ul li { padding-bottom: 10px; }
#header ul li a { padding-left: 36px; color: #444; text-decoration: none; font: normal 24px Consolas, "Bitstream Vera Sans", Arial, sans-serif; letter-spacing: .05em; }
#header ul li#or a:hover { color: #f70; background: url(../images/hex_ora.gif) left center no-repeat; }
#header ul li#gr a:hover { color: #9b0; background: url(../images/hex_grn.gif) left center no-repeat; }
#header ul li#bl a:hover { color: #0ae; background: url(../images/hex_blu.gif) left center no-repeat; }

#content { padding: 0 30px; text-align: left; }
#content h1 { padding-bottom: 12px; font-size: 24px; font-weight: normal; text-align: right; }
#content h2 { margin-bottom: 20px; font-size: 20px; font-weight: normal; text-align: right; }
#content h3 { margin-bottom: 12px; padding-left: .5em; border-left: 4px solid #888; font-size: 16px; line-height: 24px; font-weight: normal; }
#content h4 { margin-bottom: 6px; font-size: 14px; }
#content p { padding-bottom: 18px; font-size: 14px; line-height: 22px; }
#content ul { margin-bottom: 18px; list-style: none; font-size: 14px; }
#content ul li { padding-left: 18px; line-height: 22px; background: url(../images/bullet.gif) no-repeat 0 6px; }
#content a { color: #048; }
#content a:hover { background-color: #dff; }
#content a:active { color: #dff; background-color: #048; }

#footer { margin-top: 1em; color: #888; text-align: center; }
#footer p { padding: 0 0 6px 0; font-size: 12px; }
#footer a { color: #888; }
#footer a:hover { background-color: #ccc; }
#footer a:active { color: #ccc; background-color: #888; }

#quote { margin-bottom: 18px; }
#quote h2 { padding-top: 12px; }
#quote div { clear: both; margin-bottom: 12px; }
#quote label { float: left; width: 180px; padding: 6px 12px; font-size: 12px; text-align: right; }
#quote input, #quote textarea { width: 240px; padding: 3px; border: 1px solid #aaa; font-size: 12px; font-family: "Bitstream Vera Sans" Arial, sans-serif; }
#quote .submit { width: auto; }

ul#folio { list-style: none; text-align: center; }
ul#folio li { padding: 24px 0; background: none; text-align: center; }

.portfolio { margin: .5em 0; text-align: center; }
.portfolio img { margin: .75em }
.portfolio h2 { margin: 10px 0!important; text-align: left!important; }
.portfolio a:hover { background-color: #fff!important; }
.portfolio a:active { background-color: #fff!important; }

.orange { color: #f70; }
.green { color: #9b0; }
.blue { color: #0ae; }