html { height: 100%; margin-bottom: 1px; }
body { margin: 0 0 10px 0; padding: 0; font-family: Arial, Helvetica, sans-serif; text-align: center; color: #666; font-size: .8em; }
#rapper { width: 500px; margin: 0 auto; padding: 0; text-align: left; }
#content { width: 100%; margin: 0; padding: 20px 0; float: left; }
#nav { font-size: 85%; width: 500px; list-style: none; margin: 0; padding: 0; float: left; border-bottom: 1px solid #567090; border-top: 1px solid #567090; background: #FFF; }
#nav li { float: left; margin: 0 20px 0 0; padding: 2px 0 2px; }
#nav a, #nav a:link, #nav a:visited { color: #F0AA2E; text-decoration: none; font-weight: bold; }
#nav a:hover, #nav a:active { color: #567090; }
#nav a.active { border-bottom: 1px solid #567090; color: #567090; padding: 2px 0 1px; }
#footer { color: #999; font-size: 80%; margin: 0; padding: 2px 0; border-bottom: 1px solid #567090; border-top: 1px solid #567090; clear: both; background: #FFF; }
#footer a { color: #999; text-decoration: none; }
#footer a:hover, #footer a:active { color: #666; }
h1 { margin: 0; padding: 0; }
h2 { font-size: 100%; color: #567090; margin: 0; padding: 0; font-weight: bold; }
h3 { font-size: 100%; color: #907656; margin: 0; padding: 0; font-weight: bold; }
p { margin: 0 0 10px 0; padding: 0; }
dl { margin: 0; padding: 0px; }
dt { font-size: 100%; color: #567090; margin: 0; padding: 0; font-weight: bold; }
dd { margin: 0 0 10px; padding: 0; }
a:link { color: #F0AA2E; text-decoration: underline; }
a:visited { color: #567090; text-decoration: underline; }
a:hover { text-decoration: none; color: #567090; }
a:active { text-decoration: none; color: #F0AA2E; }

/* Index Styles */

#index #content { padding-bottom: 40px; }
#port-preview { margin: 40px 0 0; }
#web, #print, #identity { margin: 0; padding: 0; width: 160px; float: left; border-left: 1px solid #CCC; }
#web h2, #print h2, #identity h2 { padding: 0 0 0 5px; }
#identity img, #web img, #print img { border: 1px solid #CCC; padding: 3px; margin: 10px 10px 0; }

/* Portfolio Styles */

#portfolio #rapper { background: url(../images/port_menu_bkg.gif) repeat-y 395px; }
#portfolio #content { width: 307px; }
#portfolio #content img { border: 1px solid #CCC; padding: 3px; text-align: center; margin: 10px 0; }
#sidebar { float: right; font-size: 85%; margin: 10px 6px 0 0; padding: 0; width: 110px; }
#sidebar ul { list-style: none; margin: 5px 0 15px; padding: 0; }
#sidebar li { list-style: none; background: url(../images/bullet.gif) no-repeat 0px 3px; padding: 0 0 2px 10px; margin: 0; }
#sidebar a:link { color: #567090; text-decoration: none; }
#sidebar a:visited { color: #567090; text-decoration: none; }
#sidebar a:hover { color: #F0AA2E; text-decoration: underline; }
#sidebar a:active { color: #F0AA2E; text-decoration: underline; }
#image .enlarge { text-align: right; font-size: 85%; margin: 0 0 3px; padding: 0; }
#portfolio #content #image img { margin-bottom: 5px; }
#image .enlarge a { color: #999; text-decoration: none; }
#image .enlarge a:hover { text-decoration: underline; }

/* Resume Styles */

#resume #content ul { padding: 0px; margin: 10px 0 20px 20px; list-style: none; }
#resume #content li { list-style: none; background: url(../images/callout.gif) no-repeat 0px 2px; padding: 0 20px 10px 17px; margin: 0; }

/* Various Classes */

.head { color: #999; font-weight: normal; font-size: 130%; margin-bottom: 10px; }
.clr { clear: both; }
.link { background: url(../images/callout.gif) no-repeat 0px 2px; padding-left: 16px; }
.callout { background: url(../images/callout.gif) no-repeat 0px 2px; padding-left: 18px; margin: 3px 0 0 10px; }
.port { float: right; padding: 0; margin: 0; }