/* GLOBAL CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
html { overflow-y: scroll; background: #080808; }
body { font: 62.5%; background: url(../images/body-bg.jpg) repeat ; }
a { outline: none; text-decoration: none; border: none; color: inherit; }
a.flash:hover { border-bottom: 4px dotted #58afcc; font-size: larger; }
ul { list-style: none inside; }
/* TYPOGRAPHY */
p { font-family: 'Yanone Kaffeesatz', Helvetica, arial, sans-serif; font-size: 0.95em; line-height: 1.6em;
color: white; text-shadow: 0px 1px 0px #6e6e6e; text-align: justify; letter-spacing: 2px; }
p.facebox { color: #5cf5f5; margin-top: 7px; text-shadow: 0px 2px 1px #000; margin-bottom: -21px; }
p.home-text { margin-top: 10px; }
p.profile-text { padding: 50px 100px 0px 350px; color: #1d1d1d; text-shadow: 0px 1px 0px #fff; line-height: 1.4em; }
p.contact-text { padding: 100px 100px 0px 410px; font-size: 1.8em; color: #58afcc; text-shadow: 0px 1px 0px #fff; }
p.flash-text { padding: 20px 90px 0px 0px; font-size: 2.8em; color: #58afcc; text-shadow: 0px 1px 0px #fff; text-align: center; }
p.flash-text:hover { color: #3e8bcc; cursor: pointer; }
h1 { text-indent: -9999px; }
h1.title-truemax { width: 281px; height: 27px; display: block; background: url(../images/title-truemax.png) top left no-repeat; }
h1.title-design { width: 281px; height: 27px; display: block; background: url(../images/title-design.png) top left no-repeat; }
h1.title-illustration { width: 281px; height: 27px; display: block; background: url(../images/title-illustration.png) top left no-repeat; }
h1.title-webdesign { width: 281px; height: 27px; display: block; background: url(../images/title-webdesign.png) top left no-repeat; }
h1.title-concepts { width: 281px; height: 27px; display: block; background: url(../images/title-concepts.png) top left no-repeat; }
h1.title-favouritethings { width: 301px; height: 27px; display: block; background: url(../images/title-favouritethings.png) top left no-repeat; }
h1.title-wantaquote { width: 301px; height: 27px; display: block; background: url(../images/title-wantaquote.png) top left no-repeat; }
h2 { }
/* IMAGES */
#thumb-box { margin-left: 96px; padding-top: 66px; }
img#page-thumb { padding-right: 50px; padding-bottom: 48px; filter:alpha(opacity=80); -moz-opacity:0.80;
-khtml-opacity: 0.8; opacity: 0.8; }
img#page-thumb:hover { filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity: 1.0; opacity: 1.0; cursor: pointer; }
img.bottom-banner { margin: 15px 0 0 54px; }
/* FLOATS */
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
/* HEADER */
#header-wrap { width: 100%; height: 209px; background: url(../images/header-wrap-bg.jpg) top repeat-x #030303; }
#header { width: 1000px; height: 177px; display: block; margin: 0 auto; background: url(../images/header.jpg) top center no-repeat; }
/* NAVIGATION */
#navigation-box { width: 1000px; height: 32px; display: block; background: yellow; margin: 0 auto; }
#navigation { list-style: none; }
#navigation li { float: left; }
#navigation a * { display: none; }
#navigation a,
#navigation a .hover { height: 32px; position: relative; display: block; background: url(../images/dragon-sprite.jpg) 0 0 no-repeat; }
/* NAV ITEMS */
#navigation a.home { background-position: 0 0; width: 181px; }
#navigation .highlight a.home:hover,
#navigation a.home .hover { background-position: 0 -32px; width: 181px; }
#navigation a.design { background-position: -181px 0px; width: 92px; }
#navigation .highlight a.design:hover,
#navigation a.design .hover { background-position: -181px -32px; }
#navigation a.illustration { background-position: -273px 0; width: 151px; }
#navigation .highlight a.illustration:hover,
#navigation a.illustration .hover { background-position: -273px -32px; }
#navigation a.webdesign { background-position: -424px 0; width: 139px; }
#navigation .highlight a.webdesign:hover,
#navigation a.webdesign .hover { background-position: -424px -32px; }
#navigation a.concepts { background-position: -563px 0; width: 119px; }
#navigation .highlight a.concepts:hover,
#navigation a.concepts .hover { background-position: -563px -32px; }
#navigation a.profile { background-position: -682px 0; width: 97px; }
#navigation .highlight a.profile:hover,
#navigation a.profile .hover { background-position: -682px -32px; }
#navigation a.contact { background-position: -779px 0; width: 221px; }
#navigation .highlight a.contact:hover,
#navigation a.contact .hover { background-position: -779px -32px; }
/* CORNER BADGE FADE */
#corner-badge-fade { display: block; width: 169px; height: 170px; margin-left: 788px; list-style: none; float: right;
z-index: 99; position: absolute; margin-top: 52px; }
#corner-badge-fade li { float: left; }
#corner-badge-fade a * { display: none; }
#corner-badge-fade a,
#corner-badge-fade .hover { height: 170px; position: relative; display: block; background: url(../images/corner-badge.png) 0 0px no-repeat; }
#corner-badge-fade .profile { background-position: 0 0px; width: 169px; }
#corner-badge-fade .highlight a.profile:hover,
#corner-badge-fade a.profile .hover { background-position: 0 -170px; }
/* STRUCTURE */
#page-wrap { width: 100%; min-height: 500px; background: url(../images/pagewrap-bg.jpg) repeat-x; }
#content { width: 1000px; margin: 0 auto; background: white; }
#top-box { width: 1000px; height: 393px; background: url(../images/top-box.jpg) top center no-repeat #030303; }
#bottom-box { width: 1000px; height: 398px; background: url(../images/bottom-box.jpg) top center no-repeat #030303; }
#home-text-box { width: 400px; height: 160px; display: block; margin-left: 90px; margin-top: 33px; }
#home-image-box { width: 451px; height: 120px; display: block; margin-top: 52px; }
/* FOOTER */
#twitter { margin-bottom: 10px; }
#twitter_update_list { margin-right: 11px; width: 386px; margin-top: 55px; font-family: 'Yanone Kaffeesatz', Helvetica, arial, sans-serif; color: #1d1d1d; font-size: 0.8em; letter-spacing: 2px;
text-transform: uppercase; text-align: justify; margin-left: 15px; }
#twitter_update_list li { background: #fff; padding: 5px 6px 3px 6px; margin-bottom: 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
width: inherit; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; }
#twitter_update_list li:hover { filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity: 1.0; opacity: 1.0; cursor: default; }
#twitter_update_list a { color: teal; margin-bottom: 15px; }
#social-buttons { padding-top: 55px; }
/* PAGE LOADER */
#hidepage { z-index:9999; position: absolute; left:0px; top:0px; background: #080808; height: 1000px; width: 100%; }
#hidepage-content { margin: 0 auto; width: 623px; height: 419px; display: block; background: #080808; }
span#loader { width: 32px; height: 32px; display: block; position: absolute; z-index: 1234; left: 49%; top: 345px;
layer-background-color: #080808; }
/* Z-INDEX ELEMENTS */
#left-shadow { width: 130px; height: 100%; z-index: 55; position: fixed; top: 0px; left: 0px; display: block;
background: url(../images/left-shadow.png) top right repeat-y; }
#right-shadow { width: 130px; height: 100%; z-index: 55; position: fixed; top: 0px; right: 0px; display: block;
background: url(../images/right-shadow.png) top left repeat-y; }