/*---- general ----*/
.hide, #nav li span { position: absolute; left: -9999px; font-size: 0; }

.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }

img { display: block; border: 0; }
img.inline { display: inline; vertical-align: middle; }


/*---- layout ----*/
body { margin: 0; padding: 0; background: #fff url("../i/bg.png") repeat-x top; font-family: helvetica, arial, sans-serif; color: #222; text-align: center; }

#container, #wrapper { position: relative; margin: 0 auto; width: 780px; text-align: left; }
#banner h1, #banner a { position: absolute; top: 0; right: 0; background: transparent url("../i/brand.png") no-repeat 0 -160px; width: 120px; height: 160px; }
#banner a:hover { background-position: 0 0; }
#content, #pagebody { padding: 190px 0 0; text-align: left; }
#content { padding-left: 20px; }
#pagebody-inner { padding: 0 0 0 20px; }
.header, .gab a { position: absolute; top: 100px; left: 0; background-repeat: no-repeat; width: 250px; height: 80px; display: block; }
.home { background-image: url("../i/home.png"); }
.gab a { background-image: url("../i/gab.png"); }
.services { background-image: url("../i/services.png"); }
.portfolio { background-image: url("../i/portfolio.png"); }
.about { background-image: url("../i/about.png"); }
.contact { background-image: url("../i/contact.png"); }

#alpha { float: left; width: 480px; }
div.entry { padding: 0 0 2em; }
.comment-content, .comments-open-content { background-color: #eef0ec; padding: .5em .75em; margin: 0 0 1em; }
.comment-content { margin: 0; }
.comment { padding: 0 0 1.5em; }
#beta { float: right; width: 235px; }
div.module { padding: 0 1em 1em 0; }
img.rss { padding: 0 0 .25em; }
#footer { clear: both; padding: 1em 20px; font-size: 75%; }


/*---- typography ----*/
h3, h4, h5, h6 { margin: 1em 0 0; padding: 0; font-family: georgia, serif; }
h1, h2, h3.entry-header { margin: 0; padding: 0; font-family: georgia, serif; }
h2.date-header, h2.module-header,
h2.archive-header, .comments-open-header,
h3.comments-header { font-size: 1em; padding: 0 0 .2em; margin: 0 0 .5em; border-bottom: 1px solid #999; }
.entry-footer, .comment-footer { border-top: 1px solid #999; padding: 0 0 .2em; margin: .5em 0 0; font-size: 90%; }
.entry-footer { text-align: right; }
#alpha p { line-height: 1.3em; }
pre { margin: 1em 0; padding: 1em; border: 1px solid #bbb; background-color: #f6f6f6; }
code { background-color: #efefef; }
ul, ol { margin: 1em 0 0; padding: 0; }
p.update { background: url("../i/update.png") no-repeat left top; padding: 2px 0 10px 65px; }
p.comments-open-moderated { }
ul.archive-list, #beta ul, #footer ul { margin: 0; padding: 0; list-style: none; }
ul.archive-list li, #beta li { padding: 0 0 .1em; }
abbr, acronym { border-bottom: 1px dotted #666; cursor: help; }


/*---- links ----*/
a { color: #f70; }
a img { border: 0; }
a:hover { background-color: #ddd; color: #f50; text-decoration: none; }
.archive-content a, .entry-header a, #beta a, #footer a { text-decoration: none; color: #f70; }
#beta h2.module-header a { font-weight: bold; }
.entry-header a { color: #000; }
.entry-header a:hover { color: #933; }


/*---- navigation ----*/
#nav { position: absolute; top: 0; left: 15px; width: 300px; height: 60px; }
#nav ul { margin: 0; padding: 0; list-style: none; }
#nav li, #nav li a { margin: 0; padding: 0; float: left; background: transparent url("../i/nav.png") no-repeat; height: 60px; text-decoration: none; }
#nav li a:hover { background: none; }

/* default states */
#nav li#gab a { background-position: 0 -120px; width: 38px; }
#nav li#portfolio a { background-position: -38px -120px; width: 72px; }
#nav li#about a { background-position: -110px -120px; width: 53px; }
#nav li#contact a { background-position: -163px -120px; width: 68px; }

/* hover states */
#nav li#gab { background-position: 0 -60px; }
#nav li#portfolio { background-position: -38px -60px; }
#nav li#about { background-position: -110px -60px; }
#nav li#contact { background-position: -163px -60px; }

/* here states */
#nav li#gab.here, #nav li#gab.here a { background-position: 0 0; }
#nav li#portfolio.here, #nav li#portfolio.here a { background-position: -38px 0; }
#nav li#about.here, #nav li#about.here a { background-position: -110px 0; }
#nav li#contact.here, #nav li#contact.here a { background-position: -163px 0; }

#nav li.here a { cursor: default; }


/*---- forms ----*/
#alpha form label { display: block; }
#alpha form p { margin: 0; padding: 0 0 .75em; }


/*---- tables ----*/
table { border-collapse: collapse; width: 100%; margin: 0 0 25px; font-size: 70%; }
tr { border: 1px solid #444; }
th, td { padding: 6px 8px; }
tr.top th { background-color: #444; color: #fff; }
tr.noborder { border: 0; }

th { vertical-align: bottom; font-weight: bold; text-align: left; }
td { vertical-align: top; }

th.storage, th.users { text-align: center; }
td.storage, td.users { text-align: right; }

td.up { background-color: #9b9; }
td.down { background-color: #b99; }


/*---- forms ----*/
input, textarea { border: 1px solid #999; }
p.msg { border: 1px solid #933; padding: 10px; }
form div { padding: 0 0 10px 0; }
textarea { display: block; width: 370px; height: 100px; }