/* reset */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, code, cite,
del, dfn, em, img, ins, kbd, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, audio, canvas, dialog, figure, footer, header, hgroup, mark, menu, nav,
section, time, video { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
body { line-height: 1.5; }
article, aside, canvas, dialog, figure, footer, header, hgroup, nav, section { display: block; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a { color:inherit; outline: none; text-decoration: none; }
a img { border: none; }

/* main typography */
body { background-color:#fff; color: #000; font-size: 82%; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 400 }
html > body { font-size: 13px }

/* headings*/
h1, h2, h3, h4, h5, h6 { color: #111; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif }
h2, h3, h6 { font-weight: 800 }
h1 { font-size: 1.6em; line-height: 1; margin: 1em 0 0.5em }
h2 { font-size: 1.5em; line-height: 1; margin: 1.07em 0 0.54em }
h3 { font-size: 1.4em; line-height: 1; margin: 1.14em 0 0.57em }
h4 { font-size: 1.3em; line-height: 1; margin: 1.23em 0 0.62em }
h5 { font-size: 1.2em; line-height: 1; margin: 1.33em 0 0.67em }
h6 { font-size: 1em; line-height: 1; margin: 1.6em 0 0.8em }

/*text elements*/
small { font-size: 11px; }
b, strong { font-weight: 800}
.clear { clear: both; }

/* sections */
body#hello { margin:23% 0 0 1.6em; overflow: hidden }

#layer { position: fixed; z-index: 100 }
#hello h1, #hello h2, #hello li { font: 900 23px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: uppercase; display: inline }

/* all kinds of opacity //
#hello h1, #hello h2, #hello li { opacity: .7; -moz-opacity:0.7; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -khtml-opacity: 0.7 }
*/

#hello h1, #hello h2 { color: #474747 }
#hello ul { list-style: none }
#hello li a { color: #111 }
#hello li a:hover { color: #fff; background-color: #111 }
#hello small { font-size:13px }
.footer { position: fixed; left: 1.6em; bottom: 1em; color: #555; font-size: 11px; font-weight: normal; text-transform: none }
.footer a { color: #111; text-decoration: none }

#grid { background-color: transparent; background-image: url(../img/raster.png); background-repeat: repeat; position:fixed; height:100%; width:100%; top:0; left:0; z-index: 99 }

#rndimg img { position:fixed; width: 100%; height: 100%; top: 0; left: 0; border: 0; z-index:98 }

img#fs { background-color: white; background-image: url(lib/loader.gif); background-repeat: no-repeat; background-position: 50% 50%; position: fixed; top: 0; left: 0; width: 100%; height: 100% }

body#bulbs { margin-top: -200px; margin-left: -360px; position: absolute; top: 50%; left: 50%; width: 720px; height: 400px; border: 0 }
body#bulbs img { float:left; display: block; margin: 0; padding: 0px; width: 240px; height: 160px; border: 0 }
body#bulbs p { padding-top: 3em; clear: both; text-align: center }
body#bulbs small { color:#ccc }

body#berlin { margin-top: -300px; margin-left: -400px; position: absolute; top: 50%; left: 50%; width: 800px; height: 600px; border: 0 }
body#berlin img { float:left; display: block; margin: 0; padding: 0; width: 266px; height: 150px; border: 0 }

body#contact { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }		
#contact img { position: fixed; top: 0; left: 0; width: 100%; height: 100%; border: 0; z-index: -1 }
#contact .content {margin-top: 23%; margin-left: 1.6em}
#contact h1, body#contact h2, body#contact h3 { font-weight: 900; font-size: 27px; text-transform: uppercase; display: inline; }
#contact h1 { color: #aaa; }
#contact h2 { color: #fff; }
#contact h3 { color: #111; }
#contact h3 a { color: #000; text-decoration: none; border: 0; }
#contact h3 a:hover { color: #fff; background-color: #000; text-decoration: none; border: 0; }
#contact p { padding: 1em 0; }
#contact a { border-bottom: 1px dotted #666; }
#contact a:hover { border-bottom: 1px solid #000; }

body#hands { overflow: hidden }
body#hands #img_cont { top:0px; left:15%; position:absolute }
body#hands #text { font:normal 13px/1.2 Helvetica, Arial, serif; color:black; position: absolute; width: 200px; left:-10px; top:575px; z-index: 100 }
body#hands #text a { border-bottom: 1px dotted black }
body#hands #text a:hover { border-bottom: 1px solid black }
body#hands #copy { font:normal 10px/1.2 Helvetica, Arial, serif; color:#333; text-align: right; position: absolute; width: 400px; left:385px; top:685px; z-index: 100 }
body#hands img {display:block}
body#hands #img_cont img#i01 { height:150px; width:125px; position: absolute; left:630px; top:190px; z-index: 101 }
body#hands #img_cont img#i02 { position: absolute; left:150px; top:180px; z-index: 102 }
body#hands #img_cont img#i03 { height:240px; width:330px; position: absolute; left:300px; top:42px; z-index: 103 }
body#hands #img_cont img#i04 { height:120px; width:120px; position: absolute; left:30px; top:60px; z-index: 104 }
body#hands #img_cont img#i05 { position: absolute; left:-10px; top:285px; z-index: 105 }
body#hands #img_cont img#i06 { height:195px; width:165px; position: absolute; left:620px; top:475px; z-index: 110 }
body#hands #img_cont img#i07 { position: absolute; left:450px; top:310px; z-index: 109 }
body#hands #img_cont img#i08 { position: absolute; left:125px; top:450px; z-index: 108 }
body#hands img#i09 { height:800px; width:800px; position: absolute; right:0; bottom:-50px ;z-index:-1 }

body#korgism { margin-top: -250px; margin-left: -400px; padding: 0; position: absolute; top: 50%; left: 50%; width: 800px; height: 500px; border: 0 }
body#korgism img { float: left; display: block; margin: 0; padding: 0; width: 200px; height: 150px; border: 0 }
body#korgism p { padding-top: 3em; clear: both; text-align: center }
body#korgism small { color:#ccc }
body#korgism a { text-decoration: none; border-bottom: 1px dotted black}
body#korgism a:hover { text-decoration: none; border-bottom: 1px solid black}

body#media { width: 400px; margin:0 auto; }
#media #header { padding: 2em 0; }
#media h1, body#media h2 { font: 900 23px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: uppercase; display: inline; }
#media h1 a { color: #666; text-decoration: none }
#media h1 a:hover { color: #fff; background-color: #000; text-decoration: none }
#media h2 { color: #111; }
#media #v1,#media #v2, #media #v3,#media #v4,#media #v5, #media #v6 { clear: both; display: block; float: left; padding:8px 0; }
#media a { color: #666; text-decoration: none }
#media a:hover { color: #000; text-decoration: none; border-bottom: 1px solid #000 }
#media #footer { clear: both; display: block; color: #aaa; font-size: 11px; padding: 4em 0; }
#media .media {padding:2em 0 .4em 0}
#media video { height:240px; width:320px; padding-top:1em }

body#numbers { margin-top: -270px; margin-left: -360px; position: absolute; top: 50%; left: 50%; width: 720px; height: 540px; border: 0 }
body#numbers img { float:left; display: block; margin: 0; padding: 0; width: 240px; height: 180px; border: 0 }

/*[-top, -right, -bottom, -left]*/
/* end */