Added backed pages.
authorEugen Sawin <sawine@me73.com>
Sun, 18 Dec 2011 03:44:26 +0100
changeset 7344d14b5e7bab
parent 72 c78f182f7412
child 74 c0e6fb6cf6ef
Added backed pages.
books.html
chrome.html
contact.html
dark.css
experiments.html
factory/makefile
factory/v2012/dark.css
howiwork.html
index.html
links.html
linksend.html
machine.js
personalwork.html
resume.html
style.css
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/books.html	Sun Dec 18 03:44:26 2011 +0100
     1.3 @@ -0,0 +1,121 @@
     1.4 +<!DOCTYPE html>
     1.5 +<html lang="en">
     1.6 +  <head>
     1.7 +    <title>ME73</title>
     1.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
     1.9 +    <meta name="description" content="A Digital Playground" />
    1.10 +    <meta name="robots" content="index, follow, noarchive" />
    1.11 +    <meta name="googlebot" content="noarchive" />
    1.12 +    <script src="jquery.js"></script>
    1.13 +    <script src="script.js"></script>
    1.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
    1.15 +    <script type="application/javascript">
    1.16 +      var _gaq = _gaq || [];
    1.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
    1.18 +      _gaq.push(['_trackPageview']);
    1.19 +      (function() {
    1.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
    1.21 +      ga.async = true;
    1.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
    1.23 +      + '.google-analytics.com/ga.js';
    1.24 +      var s = document.getElementsByTagName('script')[0];
    1.25 +      s.parentNode.insertBefore(ga, s);
    1.26 +      })();
    1.27 +    </script>
    1.28 +  </head>
    1.29 +  <body>
    1.30 +    <div id="wrap">
    1.31 +      <div id="header">
    1.32 +        <canvas id="logo">
    1.33 +          FIND A BETTER BROWSER
    1.34 +        </canvas>    
    1.35 +        
    1.36 +      </div>
    1.37 +      <div id="content-wrap">
    1.38 +        <div id="main">
    1.39 +          <p>Here is a list of books, that I find useful or simply enjoyed reading.</p>
    1.40 +<h2>Engineering &amp; Science</h2>
    1.41 +<ul>
    1.42 +<li><h4>G&ouml;del, Escher, Bach: An Eternal Golden Braid</h4><h5>Douglas R. Hofstadter</h5>
    1.43 +A metaphorical fugue on minds and machines in the spirit of Lewis Carroll.
    1.44 +</li>
    1.45 +<li><h4>The Pragmatic Programmer</h4><h5>Andrew Hunt and David Thomas</h5>
    1.46 +A collection of advises for effective software development.
    1.47 +</li>
    1.48 +<li><h4>Effective C++ / More Effective C++</h4><h5>Scott Meyers</h5>
    1.49 +Effective and safe C++ programming advises for practical use.
    1.50 +</li>
    1.51 +<li><h4>Thinking in C++</h4><h5>Bruce Eckel</h5>
    1.52 +A freely available introduction to C++ and its Standard Library.
    1.53 +</li>
    1.54 +<li><h4>Artificial Intelligence: A Modern Approach</h4><h5>Stuart J. Russel and Peter Norvig</h5>
    1.55 +A comprehensive compendium of most techniques for the development of artificial intelligence.
    1.56 +</li>
    1.57 +<li><h4>The Algorithmic Beauty of Plants</h4><h5>Przemyslwa Prusinkieicz and Aristid Lindenmayer</h5>
    1.58 +A wonderful introduction to L-systems and a motivational read.
    1.59 +</li>
    1.60 +<li><h4>Compilers: Principles, Techniques &amp; Tools</h4><h5>Alfred V. Aho, Monica S. Lam and Ravi Sethi</h5>
    1.61 +The standard introduction to compiler development. Also known as the Dragon Book.
    1.62 +</li>
    1.63 +<li><h4>Computer Networks</h4><h5>Andrew S. Tanenbaum</h5>
    1.64 +A good and in-depth textbook for network technology.   
    1.65 +</li>
    1.66 +<li><h4>A Brief History of Time</h4><h5>Stephen W. Hawking</h5>
    1.67 +Popular science. Follow Stephen on his quest for the Theory of Everything.
    1.68 +</li>
    1.69 +</ul>
    1.70 +<h2>Fiction</h2>
    1.71 +<ul>
    1.72 +<li><h4>Do Androids Dream of Electric Sheep?</h4><h5>Philip K. Dick</h5>
    1.73 +A dark vision of mankind's future and the ethics of artificial life.
    1.74 +</li>
    1.75 +<li><h4>Alice in Wonderland</h4><h5>Lewis Carroll</h5>
    1.76 +Follow the rabbit.
    1.77 +</li>
    1.78 +<li><h4>Through the Looking-Glass</h4><h5>Lewis Carroll</h5>
    1.79 +Sequel to Alice in Wonderland.
    1.80 +</li>
    1.81 +<li><h4>1984</h4><h5>George Orwell</h5>
    1.82 +Classic novel about a totalitarian regime and its influence on the society.
    1.83 +</li>
    1.84 +</ul>
    1.85 +<h2>My Books</h2>
    1.86 +<ul>
    1.87 +<li><h4>Luftraummodellierung und Abflugplanung</h4><h5>Eugen Sawin</h5>
    1.88 +Ein Projekt zur Optimierung der Abflugplanung in den Vereinigten Arabischen Emiraten.
    1.89 +<div class="download"><a href="http://www.amazon.de/Luftraummodellierung-Abflugplanung-Optimierung-Vereinigten-Arabischen/dp/3639346203">Buy it on Amazon (German)</a></div>
    1.90 +</li>
    1.91 +</ul>
    1.92 +
    1.93 +        </div>
    1.94 +        <div id="sidebar">
    1.95 +          <p>
    1.96 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
    1.97 +            <br />I'm a programmer,<br />
    1.98 +            a student of computer science,<br />
    1.99 +            a music enthusiast.<br />
   1.100 +            This is my site.
   1.101 +          </p>
   1.102 +          <div id="random_quote"></div>
   1.103 +        </div>
   1.104 +      </div>
   1.105 +      <div id="footer">
   1.106 +        <div id="footer-left">
   1.107 +          <p>
   1.108 +            <a href="mailto:sawine@me73.com">
   1.109 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
   1.110 +          </p>
   1.111 +        </div>
   1.112 +        <div id="footer-right">
   1.113 +          <p class="align-right">
   1.114 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
   1.115 +          </p>
   1.116 +        </div>
   1.117 +      </div>
   1.118 +    </div>
   1.119 +    <script type="application/javascript">
   1.120 +      javascript:load_random_quote();
   1.121 +    </script>
   1.122 +  </body>
   1.123 +</html>
   1.124 +
     2.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     2.2 +++ b/chrome.html	Sun Dec 18 03:44:26 2011 +0100
     2.3 @@ -0,0 +1,94 @@
     2.4 +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     2.5 +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     2.6 +
     2.7 +<head>
     2.8 +<title>ME73 - A Programmer's Playground</title><meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
     2.9 +<meta name="author" content="Eugen Sawin - me73.com" />
    2.10 +<meta name="description" content="A Digital Playground" />
    2.11 +<meta name="robots" content="index, follow, noarchive" />
    2.12 +<meta name="googlebot" content="noarchive" />
    2.13 +<script src="script.js" type="text/javascript"></script>
    2.14 +<link rel="stylesheet" href="dark.css" type="text/css" />
    2.15 +</head>
    2.16 +
    2.17 +<body onload="draw(0, 0, 0, 0, 0);">
    2.18 +<div id="wrap">
    2.19 +	<div id="header">			
    2.20 +    	<h1 id="logo-text"><a href="index.html" title="">ME73</a></h1>		
    2.21 +	    <p id="intro">A Programmer's Playground.</p>
    2.22 +        <div id="nav">
    2.23 +			<ul>
    2.24 +				<li><a href="index.html">Home</a></li>
    2.25 +				<li><a href="chrome.html">Chrome</a></li>
    2.26 +				<li><a href="resume.html">Resume</a></li>
    2.27 +				<li><a href="howiwork.html">How I Work</a></li>
    2.28 +				<li><a href="personalwork.html">Personal Work</a></li>
    2.29 +            	<li><a href="books.html">Books</a></li>
    2.30 +	         	<li><a href="links.html">Links</a></li>			
    2.31 +				<li><a href="contact.html">Contact</a></li>		
    2.32 +			</ul>		
    2.33 +	    </div>	
    2.34 +	</div>
    2.35 +	<div id="content-wrap">				
    2.36 +		<div id="main">
    2.37 +			<p>
    2.38 +<!--<img src="images/world.png" alt="world map" height="280" width="100%" />
    2.39 +-->
    2.40 +<canvas id="mandelbrot" width="670" height="280" onclick="draw2(event);"></canvas> 
    2.41 +<button onclick="draw(0, -2, 0, 0, 0);">Left</button>
    2.42 +<button onclick="draw(0, 2, 0, 0, 0);">Right</button>
    2.43 +<button onclick="draw(0, 0, -2, 0, 0)">Up</button>
    2.44 +<button onclick="draw(0, 0, 2, 0, 0);">Down</button>
    2.45 +<button onclick="draw(0, 0, 0, 2, 0);">Zoom in</button>
    2.46 +<button onclick="draw(0, 0, 0, -2, 0);">Zoom out</button>
    2.47 +<button onclick="draw(0, 0, 0, 0, -1);">Inc Resolution</button>
    2.48 +<button onclick="draw(0, 0, 0, 0, 1);">Dec Resolution</button>
    2.49 +<button onclick="draw(100, 0, 0, 0, 0);">Inc Iterations</button>
    2.50 +<button onclick="draw(-100, 0, 0, 0, 0);">Dec Iterations</button>
    2.51 +</p>
    2.52 +           
    2.53 +      
    2.54 +		</div>
    2.55 +		<div id="sidebar">
    2.56 +	        <p>
    2.57 +				<img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />		
    2.58 +			ME73 is my digital playground.
    2.59 +            I'm a programmer, a student of computer science, a music enthusiast.
    2.60 +            This site serves as a portfolio for my private work.
    2.61 +	        </p>
    2.62 +			<div id="random_quote"></div>	        	
    2.63 +        </div>	
    2.64 +	</div>
    2.65 +  <div id="footer">
    2.66 +	<div id="footer-left">
    2.67 +		<p>
    2.68 +      	<a href="mailto:contact@esawin.com">
    2.69 +		<ul> 
    2.70 +			<li class="name">Eugen Sawin</li> 
    2.71 +			<li class="misc">Software Engineering &amp; Research</li> 
    2.72 +		</ul> 
    2.73 +		</a>
    2.74 +		</p>	
    2.75 +	</div>
    2.76 +	
    2.77 +	<div id="footer-right">
    2.78 +		<p class="align-right">
    2.79 +		<a href="index.html">Home</a> | <a href="#top">Top</a>
    2.80 +		</p>
    2.81 +	</div>	
    2.82 +</div> 
    2.83 +</div>
    2.84 +<script type="text/javascript">
    2.85 +    javascript:load_random_quote();        
    2.86 +</script>
    2.87 +<script type="text/javascript">
    2.88 +var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    2.89 +document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    2.90 +</script>
    2.91 +<script type="text/javascript">
    2.92 +var pageTracker = _gat._getTracker("UA-2137333-1");
    2.93 +pageTracker._trackPageview();
    2.94 +</script>
    2.95 +</body>
    2.96 +</html>
    2.97 +
     3.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     3.2 +++ b/contact.html	Sun Dec 18 03:44:26 2011 +0100
     3.3 @@ -0,0 +1,85 @@
     3.4 +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     3.5 +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     3.6 +
     3.7 +<head>
     3.8 +<title>ME73 - A Programmer's Playground</title><meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
     3.9 +<meta name="author" content="Eugen Sawin - me73.com" />
    3.10 +<meta name="description" content="A Digital Playground" />
    3.11 +<meta name="robots" content="index, follow, noarchive" />
    3.12 +<meta name="googlebot" content="noarchive" />
    3.13 +<script src="script.js" type="text/javascript"></script>
    3.14 +<link rel="stylesheet" href="dark.css" type="text/css" />
    3.15 +</head>
    3.16 +
    3.17 +<body onload="draw(0, 0, 0, 0, 0);">
    3.18 +<div id="wrap">
    3.19 +	<div id="header">			
    3.20 +    	<h1 id="logo-text"><a href="index.html" title="">ME73</a></h1>		
    3.21 +	    <p id="intro">A Programmer's Playground.</p>
    3.22 +        <div id="nav">
    3.23 +			<ul>
    3.24 +				<li><a href="index.html">Home</a></li>
    3.25 +				<li><a href="experiments.html">Experiments</a></li>
    3.26 +				<li><a href="resume.html">Resume</a></li>
    3.27 +				<li><a href="howiwork.html">How I Work</a></li>
    3.28 +				<li><a href="personalwork.html">Personal Work</a></li>
    3.29 +            	<li><a href="books.html">Books</a></li>
    3.30 +	         	<li><a href="links.html">Links</a></li>			
    3.31 +				<li><a href="contact.html">Contact</a></li>		
    3.32 +			</ul>		
    3.33 +	    </div>	
    3.34 +	</div>
    3.35 +	<div id="content-wrap">				
    3.36 +		<div id="main">
    3.37 +						
    3.38 +			<h2>Contact</h2>			
    3.39 +			<p><img src="images/contact.png" alt="water" class="float-left" height="100" width="100" />
    3.40 +			<br />Eugen Sawin<br />
    3.41 +         	<a href="mailto:sawine@me73.com">sawine@me73.com</a>.</p>
    3.42 +			<p>Interested in hiring me for your project? Please visit my business homepage <a href="http://www.esawin.com">www.esawin.com</a>.</p>		
    3.43 +		
    3.44 +      
    3.45 +		</div>
    3.46 +		<div id="sidebar">
    3.47 +	        <p>
    3.48 +				<img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />		
    3.49 +			ME73 is my digital playground.
    3.50 +            I'm a programmer, a student of computer science, a music enthusiast.
    3.51 +            This site serves as a portfolio for my private work.
    3.52 +	        </p>
    3.53 +			<div id="random_quote"></div>	        	
    3.54 +        </div>	
    3.55 +	</div>
    3.56 +  <div id="footer">
    3.57 +	<div id="footer-left">
    3.58 +		<p>
    3.59 +      	<a href="mailto:contact@esawin.com">
    3.60 +		<ul> 
    3.61 +			<li class="name">Eugen Sawin</li> 
    3.62 +			<li class="misc">Software Engineering &amp; Research</li> 
    3.63 +		</ul> 
    3.64 +		</a>
    3.65 +		</p>	
    3.66 +	</div>
    3.67 +	
    3.68 +	<div id="footer-right">
    3.69 +		<p class="align-right">
    3.70 +		<a href="index.html">Home</a> | <a href="#top">Top</a>
    3.71 +		</p>
    3.72 +	</div>	
    3.73 +</div> 
    3.74 +</div>
    3.75 +<script type="text/javascript">
    3.76 +    javascript:load_random_quote();        
    3.77 +</script>
    3.78 +<script type="text/javascript">
    3.79 +var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    3.80 +document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    3.81 +</script>
    3.82 +<script type="text/javascript">
    3.83 +var pageTracker = _gat._getTracker("UA-2137333-1");
    3.84 +pageTracker._trackPageview();
    3.85 +</script>
    3.86 +</body>
    3.87 +</html>
    3.88 +
     4.1 --- a/dark.css	Sun Dec 18 03:36:00 2011 +0100
     4.2 +++ b/dark.css	Sun Dec 18 03:44:26 2011 +0100
     4.3 @@ -1,554 +1,1 @@
     4.4 -/*
     4.5 -ME73.com stylesheet
     4.6 -Author: Eugen Sawin <sawine@me73.com>
     4.7 -*/ 
     4.8 -
     4.9 -* { margin: 0; padding: 0; outline: 0 }
    4.10 -
    4.11 -html { background: #222222; }
    4.12 -
    4.13 -body {
    4.14 -    /*font: 11px/165% 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;*/
    4.15 -    font: 12px/1.4 Helvetica Neue, Arial, Helvetica, 'Liberation Sans', FreeSans, sans-serif;   
    4.16 -    color: #8D8D8D;	
    4.17 -    margin: 0; 	
    4.18 -    padding: 0; 
    4.19 -    background: #222222;	
    4.20 -    text-align: center;
    4.21 -}
    4.22 -
    4.23 -/* Links */
    4.24 -a, a:visited {
    4.25 -    text-decoration: none;
    4.26 -    color: #DEDEDE;	
    4.27 -}
    4.28 -a:hover {
    4.29 -    color: #fff;
    4.30 -    border-bottom: 1px dotted #438800;
    4.31 -}
    4.32 -
    4.33 -/* headers */
    4.34 -h1, h2, h3, h4 {
    4.35 -    /*font-family: 'Trebuchet MS', Helvetica, Tahoma, Arial, Sans-serif;*/
    4.36 -    /*color: #0AEAEA;*/
    4.37 -    color: #FFF;
    4.38 -}
    4.39 -h1 {    
    4.40 -    font-size: 3.1em;	
    4.41 -    letter-spacing: -2px;
    4.42 -    padding: 15px 10px 5px 10px;	
    4.43 -}
    4.44 -h2 {
    4.45 -    font-size: 1.7em;
    4.46 -    /*color: #895F30;*/
    4.47 -    color: #FFF;
    4.48 -    padding: 20px 10px 5px 10px;	
    4.49 -}
    4.50 -h3 {    
    4.51 -    font-size: 1.6em;	
    4.52 -    font-weight: normal;
    4.53 -    padding: 10px 10px 10px 5px;		
    4.54 -}
    4.55 -
    4.56 -h4 {
    4.57 -    color: #AbAbAb;	
    4.58 -    font-size: 1.1em;
    4.59 -    /*font-weight: bold;*/
    4.60 -    padding: 10px 5px 0px 0px;
    4.61 -}
    4.62 -
    4.63 -h5 {
    4.64 -    font-size: 1.0em;
    4.65 -    padding: 0px 0px 0px 0px;
    4.66 -}
    4.67 -
    4.68 -p, dl {
    4.69 -    padding: 5px 20px;
    4.70 -    margin: 0;
    4.71 -}
    4.72 -
    4.73 -ul, ol {
    4.74 -    margin: 5px 20px;
    4.75 -    padding: 0px 20px;
    4.76 -}
    4.77 -ul { list-style: none; }
    4.78 -
    4.79 -dt {
    4.80 -    /*font-weight: bold;*/
    4.81 -    color: #FAFAFA;
    4.82 -}
    4.83 -dd {
    4.84 -    padding-left: 25px; 
    4.85 -}
    4.86 -
    4.87 -/* images */
    4.88 -img {
    4.89 -    background: #1B1B1B;
    4.90 -    border: 4px solid #262626;
    4.91 -    padding: 0px;
    4.92 -}
    4.93 -
    4.94 -img.float-right {
    4.95 -    margin: 5px 0px 5px 10px;  
    4.96 -}
    4.97 -
    4.98 -img.float-left {
    4.99 -    margin: 5px 10px 5px 0px;
   4.100 -}
   4.101 -
   4.102 -canvas {
   4.103 -    border: 4px solid #262626;  
   4.104 -} 
   4.105 -
   4.106 -#logo {
   4.107 -    border-style: none; 
   4.108 -    position: relative;
   4.109 -    margin: 0; 
   4.110 -    padding: 0;
   4.111 -    color: #F8F8F8;    
   4.112 -    /* change the values of top and left to adjust the position of the logo*/
   4.113 -    top: 40px; left: 25px;
   4.114 -    height: 120px;
   4.115 -    width: 670px;
   4.116 -}
   4.117 -
   4.118 -code {
   4.119 -    margin: 5px 0;
   4.120 -    padding: 15px;
   4.121 -    text-align: left;
   4.122 -    display: block;
   4.123 -    overflow: auto;  
   4.124 -    font: 500 1em/1.5em 'Lucida Console', 'Courier New', Monospace;
   4.125 -    /* white-space: pre; */
   4.126 -    background: #070707;
   4.127 -/*border: 1px solid #111;   */
   4.128 -}
   4.129 -acronym {
   4.130 -    cursor: help;
   4.131 -    border-bottom: 1px dotted #5B5B5B;
   4.132 -}
   4.133 -blockquote {
   4.134 -    margin: 15px 10px;
   4.135 -    padding: 10px 10px 10px 35px;  
   4.136 -    background: #070707 url(quote.gif) no-repeat 10px 10px;
   4.137 -    border: 1px solid #111; 
   4.138 -    font-weight: normal;
   4.139 -    font-size: 17px;
   4.140 -    line-height: 1.6em;
   4.141 -    font-style: italic;
   4.142 -    font-family: Georgia, 'Times New Roman', Times, serif;	
   4.143 -    color: #808080;	
   4.144 -}
   4.145 -
   4.146 -/* start - table */
   4.147 -table {
   4.148 -    margin: 15px 0px; 	
   4.149 -    border-collapse: collapse;			
   4.150 -}
   4.151 -th {
   4.152 -    color: #FAFAFA;
   4.153 -    height: 38px;
   4.154 -    padding-left: 0px;
   4.155 -    padding-right: 12px;	
   4.156 -    text-align: left;	
   4.157 -}
   4.158 -tr {
   4.159 -    color: #5b5b5b;
   4.160 -    height: 15px;		
   4.161 -}
   4.162 -td {
   4.163 -    padding-left: 0px;
   4.164 -    padding-right: 12px;	
   4.165 -}
   4.166 -/* end - table */
   4.167 -
   4.168 -
   4.169 -/* form elements */
   4.170 -form {
   4.171 -    margin: 20px 10px; 
   4.172 -    padding: 15px 25px 25px 20px; 
   4.173 -    background: #070707; 	
   4.174 -/*border: 1px solid #111;	*/
   4.175 -}
   4.176 -form p {
   4.177 -    /*border-bottom: 1px solid #101010;*/
   4.178 -    padding: 12px 0 5px 0;	margin: 0;	
   4.179 -}
   4.180 -label {
   4.181 -    font-weight: bold;	
   4.182 -    color: #FAFAFA;
   4.183 -}
   4.184 -input, select, textarea {
   4.185 -    margin: 5px 0;
   4.186 -    padding: 5px;
   4.187 -    font: normal 1em Verdana, Tahoma, sans-serif;
   4.188 -    color: #6A6969;
   4.189 -    background: #0C0C0C;  
   4.190 -/*border: 1px solid #1C1C1C;*/
   4.191 -}
   4.192 -option { padding-right: 0.5em; } 
   4.193 -
   4.194 -#name, #email, #message{
   4.195 -    width: 480px;
   4.196 -}
   4.197 -input.button { 
   4.198 -    font: bold 12px Arial, Verdana, Sans-serif; 
   4.199 -    height: 30px;
   4.200 -    padding: 2px 3px; 
   4.201 -    margin-top: 8px;
   4.202 -    color: #48780E;
   4.203 -    background: #000;
   4.204 -    border-width: 1px;
   4.205 -    border-style: solid;
   4.206 -    border-color: #1B1B1B;
   4.207 -}
   4.208 -
   4.209 -
   4.210 -/* ------------------------------------------
   4.211 -   LAYOUT
   4.212 -   ------------------------------------------- */ 
   4.213 -#wrap { 
   4.214 -    position: relative;
   4.215 -    width: 1020px;
   4.216 -    margin: 0 auto;
   4.217 -    text-align: left;		
   4.218 -}
   4.219 -#content-wrap {
   4.220 -    clear: both;
   4.221 -    width: 1020px;	
   4.222 -    float: left;	
   4.223 -    padding-top: 15px;
   4.224 -    padding-bottom: 50px;	
   4.225 -}
   4.226 -#header {
   4.227 -    position: relative;
   4.228 -    width: 1020px;	
   4.229 -    height: 170px;	
   4.230 -    margin: 0; 
   4.231 -    padding: 0;			
   4.232 -}
   4.233 -#header h1#logo-text a {
   4.234 -    position: absolute;
   4.235 -    margin: 0; padding: 0;
   4.236 -    font: bold 65px 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;	
   4.237 -    letter-spacing: -1.5px;
   4.238 -    color: #F8F8F8;
   4.239 -    text-decoration: none;
   4.240 -    text-transform: none;
   4.241 -    
   4.242 -    /* change the values of top and left to adjust the position of the logo*/
   4.243 -    top: 70px; left: 30px;	
   4.244 -}
   4.245 -#header h1#logo-text a:hover {
   4.246 -    background: none;
   4.247 -    margin-top: 100px;	
   4.248 -    padding-top: 100px;
   4.249 -}
   4.250 -#header img {
   4.251 -    position: relative;
   4.252 -    top: 90px;
   4.253 -    left: 22px;
   4.254 -    border: 0px;
   4.255 -}
   4.256 -
   4.257 -#header p#intro {
   4.258 -    position: absolute;
   4.259 -    margin: 0; 
   4.260 -    padding: 0;
   4.261 -    font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;
   4.262 -    font-weight: bold;
   4.263 -    font-size: 16px;	
   4.264 -    line-height: 1.5em;
   4.265 -    font-style: normal;
   4.266 -    text-transform: none;
   4.267 -    /*color: #6D7D2D;*/
   4.268 -    color: #5ad715;
   4.269 -    width: 400px;
   4.270 -    
   4.271 -    /* change the values of top and left to adjust the position */
   4.272 -    top: 145px; 
   4.273 -    left: 22px;		
   4.274 -}
   4.275 -
   4.276 -/*  Navigation  */
   4.277 -#nav {
   4.278 -    position: absolute;
   4.279 -    margin: 0; 
   4.280 -    padding: 0;		
   4.281 -    height: 50px;
   4.282 -    left: 0px;	
   4.283 -    top: 30px;			
   4.284 -}
   4.285 -#nav ul {
   4.286 -    float: left;
   4.287 -    list-style: none;
   4.288 -    height: 50px;
   4.289 -    margin: 0 0 0 10px; 
   4.290 -    padding: 0;	
   4.291 -    display: inline;
   4.292 -}
   4.293 -#nav ul li {
   4.294 -    display: inline;
   4.295 -    margin: 0; 
   4.296 -    padding: 0;
   4.297 -}
   4.298 -#nav ul li a {
   4.299 -    float: left;
   4.300 -    margin: 0;	
   4.301 -    padding: 0 12px;
   4.302 -    font-weight: bold;
   4.303 -    font-size: 1.25em;
   4.304 -    text-decoration: none;	
   4.305 -    color: #c95723;
   4.306 -    color: #999;	
   4.307 -    text-transform: uppercase;
   4.308 -}
   4.309 -#nav ul li a:hover, 
   4.310 -#nav ul li a:active {
   4.311 -    color: #eee;
   4.312 -    background: none;
   4.313 -    border: none;
   4.314 -}
   4.315 -#nav ul li#current a {	
   4.316 -    color: #D33972;	
   4.317 -}
   4.318 -
   4.319 -#subnav{
   4.320 -    position: absolute;
   4.321 -    margin: 17px 280px; 
   4.322 -    padding: 0;		
   4.323 -    height: 50px;
   4.324 -    left: 10px;	
   4.325 -    top: 30px;		
   4.326 -}
   4.327 -
   4.328 -#subnav ul {
   4.329 -    float: left;
   4.330 -    list-style: none;
   4.331 -    height: 50px;
   4.332 -    margin: 0 0 0 10px; 
   4.333 -    padding: 0;	
   4.334 -    display: inline;
   4.335 -}
   4.336 -#subnav ul li {
   4.337 -    display: inline;
   4.338 -    margin: 0; 
   4.339 -    padding: 0;
   4.340 -}
   4.341 -#subnav ul li a {
   4.342 -    float: left;
   4.343 -    margin: 0;	
   4.344 -    padding: 0 12px;
   4.345 -    font: bold 15px/50px 'Trebuchet MS', Helvetica, Arial, Geneva, sans-serif;	
   4.346 -    text-decoration: none;	
   4.347 -    color: #5ad715;	
   4.348 -    text-transform: uppercase;
   4.349 -}
   4.350 -#subnav ul li a:hover, 
   4.351 -#subnav ul li a:active {
   4.352 -    color: #eee;
   4.353 -    background: none;
   4.354 -    border: none;
   4.355 -}
   4.356 -#subnav ul li#current a {	
   4.357 -    color: #D33972;	
   4.358 -}
   4.359 -
   4.360 -/* Main Column */
   4.361 -#main {
   4.362 -    float: left;
   4.363 -    width: 670px;
   4.364 -    padding: 0; 
   4.365 -    margin: 0 0 0 2px;
   4.366 -    display: inline;	
   4.367 -}
   4.368 -#main h2 {
   4.369 -    padding: 5px 22px;	
   4.370 -    margin: 15px 5px 0px 0px;
   4.371 -    /*font: bold 2.4em 'Trebuchet MS', Helvetica, Arial, sans-serif;				*/
   4.372 -    /*color: #45D5E6;
   4.373 -      color: #00cccc;*/
   4.374 -    color: #FFF;	
   4.375 -}
   4.376 -#main h2 a {
   4.377 -    /*color: #45D5E6;*/
   4.378 -    color: #FFF;
   4.379 -    text-decoration: none;		
   4.380 -    border: none;		
   4.381 -}
   4.382 -#main ul li {
   4.383 -    /*list-style-image: url(images/bullet.png);*/
   4.384 -    list-style: disc;
   4.385 -}
   4.386 -
   4.387 -/* Sidebar */	
   4.388 -#sidebar {
   4.389 -    float: right;
   4.390 -    width: 300px;
   4.391 -    padding: 0; 
   4.392 -    margin: 0px 18px 0 0;		
   4.393 -    display: inline;
   4.394 -    color: #5D5D5D;   
   4.395 -/*border: 4px solid #262626;*/
   4.396 -}
   4.397 -
   4.398 -#random_quote {   
   4.399 -    color: #c95723;
   4.400 -    font-style: italic;
   4.401 -}
   4.402 -
   4.403 -#sidebar h3 {
   4.404 -/*padding: 5px 12px;
   4.405 -  margin: 15px 5px 10px 0;
   4.406 -  font: bold 2.4em 'Trebuchet MS', Tahoma, Helvetica, Arial, sans-serif;				
   4.407 -  color: #45D5E6;*/
   4.408 -/*border-bottom: 1px solid #121212; */
   4.409 -/*background-image: url(pattern.gif);		*/	
   4.410 -}
   4.411 -#sidebar ul.sidemenu {
   4.412 -    text-align: left;
   4.413 -    margin: 20px 5px 20px 0px; 
   4.414 -    padding: 0;		
   4.415 -/*border-top: 1px solid #111;		*/
   4.416 -}
   4.417 -#sidebar ul.sidemenu li {
   4.418 -    list-style: none;
   4.419 -    padding: 8px 10px;
   4.420 -    margin: 0;    
   4.421 -/*border-bottom: 1px solid #111;*/
   4.422 -}
   4.423 -* html body #sidebar ul.sidemenu li {
   4.424 -    height: 1%;
   4.425 -}
   4.426 -#sidebar ul.sidemenu li a {
   4.427 -    text-decoration: none;	
   4.428 -    border: none;
   4.429 -    color: #666666;
   4.430 -    font-weight: bold;		
   4.431 -    /*font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;*/
   4.432 -    font-size: 9pt;		
   4.433 -}
   4.434 -#sidebar ul.sidemenu li a span {
   4.435 -    color: #444;	
   4.436 -    /*font-family: Georgia, 'Times New Roman', Times, serif;*/
   4.437 -    font-style: italic;
   4.438 -    font-weight: normal;	
   4.439 -    font-size: 8pt;
   4.440 -}
   4.441 -#sidebar ul.sidemenu li a:hover,
   4.442 -#sidebar ul.sidemenu li a:hover span {	
   4.443 -    color: #fff;	
   4.444 -}
   4.445 -#sidebar ul.sidemenu ul { margin: 0 0 0 0px; padding: 0; }
   4.446 -#sidebar ul.sidemenu ul li { border: none; }
   4.447 -
   4.448 -/* header quick search */
   4.449 -#sidebar form#quick-search {
   4.450 -    padding: 0; 
   4.451 -    margin: 20px 0 35px 0;
   4.452 -    border: none;
   4.453 -    width: 290px; height: 33px;
   4.454 -/*background: url(header-search.gif) no-repeat;		*/
   4.455 -}
   4.456 -#sidebar form#quick-search p {
   4.457 -    margin: 0; 
   4.458 -    padding: 0;		
   4.459 -}
   4.460 -#sidebar form#quick-search input {
   4.461 -    float: left;
   4.462 -    border: none;
   4.463 -    background: transparent;
   4.464 -    color: #4E4E4E;	
   4.465 -    margin: 0;
   4.466 -}
   4.467 -#sidebar form#quick-search .tbox {
   4.468 -    margin: 5px 0 0 0px; 
   4.469 -    width: 240px;	
   4.470 -    display: inline;	
   4.471 -}
   4.472 -#search form#quick-search .btn{
   4.473 -    width: 24px; height: 24px;			
   4.474 -}
   4.475 -#sidebar form#quick-search label {
   4.476 -    display: none;
   4.477 -}
   4.478 -
   4.479 -/* footer */
   4.480 -#footer {
   4.481 -    clear: both;
   4.482 -    /*padding: 1em 0 2.5em 0;*/
   4.483 -    background: #222222;
   4.484 -    color: #4E4E4E;
   4.485 -    width: 100%;
   4.486 -    float: left;			
   4.487 -}
   4.488 -#footer a {	
   4.489 -    color: #4E4E4E;
   4.490 -    /*color: #0E909C;*/
   4.491 -    border: none;
   4.492 -}
   4.493 -#footer a:hover {
   4.494 -    color: #fafafa;
   4.495 -}
   4.496 -#footer .rssfeed {
   4.497 -    background: url(images/rss.gif) no-repeat left 1px;
   4.498 -    padding-left: 17px;
   4.499 -}
   4.500 -#footer-left {
   4.501 -    float: left;
   4.502 -    width: 70%;
   4.503 -}
   4.504 -#footer-right {
   4.505 -    float: right;
   4.506 -    width: 25%;
   4.507 -}
   4.508 -
   4.509 -.download a
   4.510 -{	
   4.511 -    color: #5ad715;
   4.512 -}
   4.513 -
   4.514 -/* postmeta */
   4.515 -.postmeta {	
   4.516 -    padding: 7px 5px; 
   4.517 -    margin: 5px 5px 5px 5px;	
   4.518 -    font-size: 1em;	
   4.519 -    color: #545454;
   4.520 -    /*border: 1px solid #111; */
   4.521 -    background: #222222; 
   4.522 -}
   4.523 -.postmeta .date{ margin: 0 10px 0 5px;	}
   4.524 -.postmeta a.comments { margin: 0 10px 0 5px;	}
   4.525 -.postmeta a.readmore { margin: 0 10px 0 5px;	}
   4.526 -
   4.527 -.post-info { font-size: .95em; padding-top: 3px; margin-left: 5px; color: #444;	}
   4.528 -.post-info a, .post-info a:visited { color: #AE275A; }
   4.529 -
   4.530 -/* alignment classes */
   4.531 -.float-left  { float: left; }
   4.532 -.float-right { float: right; }
   4.533 -.align-left  { text-align: left; }
   4.534 -.align-right { text-align: right; }
   4.535 -
   4.536 -/* display and additional classes */
   4.537 -.no-border { 
   4.538 -    border: none; 
   4.539 -}
   4.540 -
   4.541 -.clearer { 
   4.542 -    clear: both; 
   4.543 -}
   4.544 -
   4.545 -.clear {
   4.546 -    display:inline-block; 
   4.547 -}
   4.548 -
   4.549 -.clear:after {
   4.550 -    display:block; 
   4.551 -    visibility:hidden; 
   4.552 -    clear:both; 
   4.553 -    height:0; 
   4.554 -    content: "."; 
   4.555 -}
   4.556 -
   4.557 -
   4.558 +*{margin:0;padding:0;outline:0}html{background:#222}body{font:12px/1.4 Helvetica Neue,Arial,Helvetica,'Liberation Sans',FreeSans,sans-serif;color:#8d8d8d;margin:0;padding:0;background:#222;text-align:center}a,a:visited{text-decoration:none;color:#dedede}a:hover{color:#fff;border-bottom:1px dotted #438800}h1,h2,h3,h4{color:#FFF}h1{font-size:3.1em;letter-spacing:-2px;padding:15px 10px 5px 10px}h2{font-size:1.7em;color:#FFF;padding:20px 10px 5px 10px}h3{font-size:1.6em;font-weight:normal;padding:10px 10px 10px 5px}h4{color:#ababab;font-size:1.1em;padding:10px 5px 0 0}h5{font-size:1.0em;padding:0}p,dl{padding:5px 20px;margin:0}ul,ol{margin:5px 20px;padding:0 20px}ul{list-style:none}dt{color:#fafafa}dd{padding-left:25px}img{background:#1b1b1b;border:4px solid #262626;padding:0}img.float-right{margin:5px 0 5px 10px}img.float-left{margin:5px 10px 5px 0}canvas{border:4px solid #262626}#logo{border-style:none;position:relative;margin:0;padding:0;color:#f8f8f8;top:40px;left:25px;height:120px;width:670px}code{margin:5px 0;padding:15px;text-align:left;display:block;overflow:auto;font:500 1em/1.5em 'Lucida Console','Courier New',Monospace;background:#070707}acronym{cursor:help;border-bottom:1px dotted #5b5b5b}blockquote{margin:15px 10px;padding:10px 10px 10px 35px;background:#070707 url(quote.gif) no-repeat 10px 10px;border:1px solid #111;font-weight:normal;font-size:17px;line-height:1.6em;font-style:italic;font-family:Georgia,'Times New Roman',Times,serif;color:#808080}table{margin:15px 0;border-collapse:collapse}th{color:#fafafa;height:38px;padding-left:0;padding-right:12px;text-align:left}tr{color:#5b5b5b;height:15px}td{padding-left:0;padding-right:12px}form{margin:20px 10px;padding:15px 25px 25px 20px;background:#070707}form p{padding:12px 0 5px 0;margin:0}label{font-weight:bold;color:#fafafa}input,select,textarea{margin:5px 0;padding:5px;font:normal 1em Verdana,Tahoma,sans-serif;color:#6a6969;background:#0c0c0c}option{padding-right:.5em}#name,#email,#message{width:480px}input.button{font:bold 12px Arial,Verdana,Sans-serif;height:30px;padding:2px 3px;margin-top:8px;color:#48780e;background:#000;border-width:1px;border-style:solid;border-color:#1b1b1b}#wrap{position:relative;width:1020px;margin:0 auto;text-align:left}#content-wrap{clear:both;width:1020px;float:left;padding-top:15px;padding-bottom:50px}#header{position:relative;width:1020px;height:170px;margin:0;padding:0}#header h1#logo-text a{position:absolute;margin:0;padding:0;font:bold 65px 'Trebuchet MS',Tahoma,Helvetica,Arial,Sans-serif;letter-spacing:-1.5px;color:#f8f8f8;text-decoration:none;text-transform:none;top:70px;left:30px}#header h1#logo-text a:hover{background:0;margin-top:100px;padding-top:100px}#header img{position:relative;top:90px;left:22px;border:0}#header p#intro{position:absolute;margin:0;padding:0;font-family:'Trebuchet MS',Tahoma,Helvetica,Arial,Sans-serif;font-weight:bold;font-size:16px;line-height:1.5em;font-style:normal;text-transform:none;color:#5ad715;width:400px;top:145px;left:22px}#nav{position:absolute;margin:0;padding:0;height:50px;left:0;top:30px}#nav ul{float:left;list-style:none;height:50px;margin:0 0 0 10px;padding:0;display:inline}#nav ul li{display:inline;margin:0;padding:0}#nav ul li a{float:left;margin:0;padding:0 12px;font-weight:bold;font-size:1.25em;text-decoration:none;color:#c95723;color:#999;text-transform:uppercase}#nav ul li a:hover,#nav ul li a:active{color:#eee;background:0;border:0}#nav ul li#current a{color:#d33972}#subnav{position:absolute;margin:17px 280px;padding:0;height:50px;left:10px;top:30px}#subnav ul{float:left;list-style:none;height:50px;margin:0 0 0 10px;padding:0;display:inline}#subnav ul li{display:inline;margin:0;padding:0}#subnav ul li a{float:left;margin:0;padding:0 12px;font:bold 15px/50px 'Trebuchet MS',Helvetica,Arial,Geneva,sans-serif;text-decoration:none;color:#5ad715;text-transform:uppercase}#subnav ul li a:hover,#subnav ul li a:active{color:#eee;background:0;border:0}#subnav ul li#current a{color:#d33972}#main{float:left;width:670px;padding:0;margin:0 0 0 2px;display:inline}#main h2{padding:5px 22px;margin:15px 5px 0 0;color:#FFF}#main h2 a{color:#FFF;text-decoration:none;border:0}#main ul li{list-style:disc}#sidebar{float:right;width:300px;padding:0;margin:0 18px 0 0;display:inline;color:#5d5d5d}#random_quote{color:#c95723;font-style:italic}#sidebar ul.sidemenu{text-align:left;margin:20px 5px 20px 0;padding:0}#sidebar ul.sidemenu li{list-style:none;padding:8px 10px;margin:0}* html body #sidebar ul.sidemenu li{height:1%}#sidebar ul.sidemenu li a{text-decoration:none;border:0;color:#666;font-weight:bold;font-size:9pt}#sidebar ul.sidemenu li a span{color:#444;font-style:italic;font-weight:normal;font-size:8pt}#sidebar ul.sidemenu li a:hover,#sidebar ul.sidemenu li a:hover span{color:#fff}#sidebar ul.sidemenu ul{margin:0;padding:0}#sidebar ul.sidemenu ul li{border:0}#sidebar form#quick-search{padding:0;margin:20px 0 35px 0;border:0;width:290px;height:33px}#sidebar form#quick-search p{margin:0;padding:0}#sidebar form#quick-search input{float:left;border:0;background:transparent;color:#4e4e4e;margin:0}#sidebar form#quick-search .tbox{margin:5px 0 0 0;width:240px;display:inline}#search form#quick-search .btn{width:24px;height:24px}#sidebar form#quick-search label{display:none}#footer{clear:both;background:#222;color:#4e4e4e;width:100%;float:left}#footer a{color:#4e4e4e;border:0}#footer a:hover{color:#fafafa}#footer .rssfeed{background:url(images/rss.gif) no-repeat left 1px;padding-left:17px}#footer-left{float:left;width:70%}#footer-right{float:right;width:25%}.download a{color:#5ad715}.postmeta{padding:7px 5px;margin:5px 5px 5px 5px;font-size:1em;color:#545454;background:#222}.postmeta .date{margin:0 10px 0 5px}.postmeta a.comments{margin:0 10px 0 5px}.postmeta a.readmore{margin:0 10px 0 5px}.post-info{font-size:.95em;padding-top:3px;margin-left:5px;color:#444}.post-info a,.post-info a:visited{color:#ae275a}.float-left{float:left}.float-right{float:right}.align-left{text-align:left}.align-right{text-align:right}.no-border{border:0}.clearer{clear:both}.clear{display:inline-block}.clear:after{display:block;visibility:hidden;clear:both;height:0;content:"."}
   4.559 \ No newline at end of file
     5.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     5.2 +++ b/experiments.html	Sun Dec 18 03:44:26 2011 +0100
     5.3 @@ -0,0 +1,83 @@
     5.4 +<!DOCTYPE html>
     5.5 +<html lang="en">
     5.6 +  <head>
     5.7 +    <title>ME73</title>
     5.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
     5.9 +    <meta name="description" content="A Digital Playground" />
    5.10 +    <meta name="robots" content="index, follow, noarchive" />
    5.11 +    <meta name="googlebot" content="noarchive" />
    5.12 +    <script src="jquery.js"></script>
    5.13 +    <script src="script.js"></script>
    5.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
    5.15 +    <script type="application/javascript">
    5.16 +      var _gaq = _gaq || [];
    5.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
    5.18 +      _gaq.push(['_trackPageview']);
    5.19 +      (function() {
    5.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
    5.21 +      ga.async = true;
    5.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
    5.23 +      + '.google-analytics.com/ga.js';
    5.24 +      var s = document.getElementsByTagName('script')[0];
    5.25 +      s.parentNode.insertBefore(ga, s);
    5.26 +      })();
    5.27 +    </script>
    5.28 +  </head>
    5.29 +  <body>
    5.30 +    <div id="wrap">
    5.31 +      <div id="header">
    5.32 +        <canvas id="logo">
    5.33 +          FIND A BETTER BROWSER
    5.34 +        </canvas>    
    5.35 +        
    5.36 +      </div>
    5.37 +      <div id="content-wrap">
    5.38 +        <div id="main">
    5.39 +          <p>
    5.40 +<!--<img src="images/world.png" alt="world map" height="280" width="100%" />
    5.41 +-->
    5.42 +<canvas id="mandelbrot" width="670" height="670" onclick="draw2(event);"></canvas> 
    5.43 +<button onclick="draw(0, -2, 0, 0, 0);">Left</button>
    5.44 +<button onclick="draw(0, 2, 0, 0, 0);">Right</button>
    5.45 +<button onclick="draw(0, 0, -2, 0, 0)">Up</button>
    5.46 +<button onclick="draw(0, 0, 2, 0, 0);">Down</button>
    5.47 +<button onclick="draw(0, 0, 0, 2, 0);">Zoom in</button>
    5.48 +<button onclick="draw(0, 0, 0, -2, 0);">Zoom out</button>
    5.49 +<button onclick="draw(0, 0, 0, 0, -1);">Inc Resolution</button>
    5.50 +<button onclick="draw(0, 0, 0, 0, 1);">Dec Resolution</button>
    5.51 +<button onclick="draw(100, 0, 0, 0, 0);">Inc Iterations</button>
    5.52 +<button onclick="draw(-100, 0, 0, 0, 0);">Dec Iterations</button>
    5.53 +</p>
    5.54 +
    5.55 +        </div>
    5.56 +        <div id="sidebar">
    5.57 +          <p>
    5.58 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
    5.59 +            <br />I'm a programmer,<br />
    5.60 +            a student of computer science,<br />
    5.61 +            a music enthusiast.<br />
    5.62 +            This is my site.
    5.63 +          </p>
    5.64 +          <div id="random_quote"></div>
    5.65 +        </div>
    5.66 +      </div>
    5.67 +      <div id="footer">
    5.68 +        <div id="footer-left">
    5.69 +          <p>
    5.70 +            <a href="mailto:sawine@me73.com">
    5.71 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
    5.72 +          </p>
    5.73 +        </div>
    5.74 +        <div id="footer-right">
    5.75 +          <p class="align-right">
    5.76 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
    5.77 +          </p>
    5.78 +        </div>
    5.79 +      </div>
    5.80 +    </div>
    5.81 +    <script type="application/javascript">
    5.82 +      javascript:load_random_quote();
    5.83 +    </script>
    5.84 +  </body>
    5.85 +</html>
    5.86 +
     6.1 --- a/factory/makefile	Sun Dec 18 03:36:00 2011 +0100
     6.2 +++ b/factory/makefile	Sun Dec 18 03:44:26 2011 +0100
     6.3 @@ -7,4 +7,5 @@
     6.4  compile:
     6.5  	./create_page -a $(FRAME)
     6.6  	java -jar yuicompressor.jar $(VERSION)/script.js -o ../script.js --charset utf-8
     6.7 +	java -jar yuicompressor.jar $(VERSION)/dark.css -o ../dark.css --charset utf-8
     6.8  
     7.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     7.2 +++ b/factory/v2012/dark.css	Sun Dec 18 03:44:26 2011 +0100
     7.3 @@ -0,0 +1,554 @@
     7.4 +/*
     7.5 +ME73.com stylesheet
     7.6 +Author: Eugen Sawin <sawine@me73.com>
     7.7 +*/ 
     7.8 +
     7.9 +* { margin: 0; padding: 0; outline: 0 }
    7.10 +
    7.11 +html { background: #222222; }
    7.12 +
    7.13 +body {
    7.14 +    /*font: 11px/165% 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;*/
    7.15 +    font: 12px/1.4 Helvetica Neue, Arial, Helvetica, 'Liberation Sans', FreeSans, sans-serif;   
    7.16 +    color: #8D8D8D;	
    7.17 +    margin: 0; 	
    7.18 +    padding: 0; 
    7.19 +    background: #222222;	
    7.20 +    text-align: center;
    7.21 +}
    7.22 +
    7.23 +/* Links */
    7.24 +a, a:visited {
    7.25 +    text-decoration: none;
    7.26 +    color: #DEDEDE;	
    7.27 +}
    7.28 +a:hover {
    7.29 +    color: #fff;
    7.30 +    border-bottom: 1px dotted #438800;
    7.31 +}
    7.32 +
    7.33 +/* headers */
    7.34 +h1, h2, h3, h4 {
    7.35 +    /*font-family: 'Trebuchet MS', Helvetica, Tahoma, Arial, Sans-serif;*/
    7.36 +    /*color: #0AEAEA;*/
    7.37 +    color: #FFF;
    7.38 +}
    7.39 +h1 {    
    7.40 +    font-size: 3.1em;	
    7.41 +    letter-spacing: -2px;
    7.42 +    padding: 15px 10px 5px 10px;	
    7.43 +}
    7.44 +h2 {
    7.45 +    font-size: 1.7em;
    7.46 +    /*color: #895F30;*/
    7.47 +    color: #FFF;
    7.48 +    padding: 20px 10px 5px 10px;	
    7.49 +}
    7.50 +h3 {    
    7.51 +    font-size: 1.6em;	
    7.52 +    font-weight: normal;
    7.53 +    padding: 10px 10px 10px 5px;		
    7.54 +}
    7.55 +
    7.56 +h4 {
    7.57 +    color: #AbAbAb;	
    7.58 +    font-size: 1.1em;
    7.59 +    /*font-weight: bold;*/
    7.60 +    padding: 10px 5px 0px 0px;
    7.61 +}
    7.62 +
    7.63 +h5 {
    7.64 +    font-size: 1.0em;
    7.65 +    padding: 0px 0px 0px 0px;
    7.66 +}
    7.67 +
    7.68 +p, dl {
    7.69 +    padding: 5px 20px;
    7.70 +    margin: 0;
    7.71 +}
    7.72 +
    7.73 +ul, ol {
    7.74 +    margin: 5px 20px;
    7.75 +    padding: 0px 20px;
    7.76 +}
    7.77 +ul { list-style: none; }
    7.78 +
    7.79 +dt {
    7.80 +    /*font-weight: bold;*/
    7.81 +    color: #FAFAFA;
    7.82 +}
    7.83 +dd {
    7.84 +    padding-left: 25px; 
    7.85 +}
    7.86 +
    7.87 +/* images */
    7.88 +img {
    7.89 +    background: #1B1B1B;
    7.90 +    border: 4px solid #262626;
    7.91 +    padding: 0px;
    7.92 +}
    7.93 +
    7.94 +img.float-right {
    7.95 +    margin: 5px 0px 5px 10px;  
    7.96 +}
    7.97 +
    7.98 +img.float-left {
    7.99 +    margin: 5px 10px 5px 0px;
   7.100 +}
   7.101 +
   7.102 +canvas {
   7.103 +    border: 4px solid #262626;  
   7.104 +} 
   7.105 +
   7.106 +#logo {
   7.107 +    border-style: none; 
   7.108 +    position: relative;
   7.109 +    margin: 0; 
   7.110 +    padding: 0;
   7.111 +    color: #F8F8F8;    
   7.112 +    /* change the values of top and left to adjust the position of the logo*/
   7.113 +    top: 40px; left: 25px;
   7.114 +    height: 120px;
   7.115 +    width: 670px;
   7.116 +}
   7.117 +
   7.118 +code {
   7.119 +    margin: 5px 0;
   7.120 +    padding: 15px;
   7.121 +    text-align: left;
   7.122 +    display: block;
   7.123 +    overflow: auto;  
   7.124 +    font: 500 1em/1.5em 'Lucida Console', 'Courier New', Monospace;
   7.125 +    /* white-space: pre; */
   7.126 +    background: #070707;
   7.127 +/*border: 1px solid #111;   */
   7.128 +}
   7.129 +acronym {
   7.130 +    cursor: help;
   7.131 +    border-bottom: 1px dotted #5B5B5B;
   7.132 +}
   7.133 +blockquote {
   7.134 +    margin: 15px 10px;
   7.135 +    padding: 10px 10px 10px 35px;  
   7.136 +    background: #070707 url(quote.gif) no-repeat 10px 10px;
   7.137 +    border: 1px solid #111; 
   7.138 +    font-weight: normal;
   7.139 +    font-size: 17px;
   7.140 +    line-height: 1.6em;
   7.141 +    font-style: italic;
   7.142 +    font-family: Georgia, 'Times New Roman', Times, serif;	
   7.143 +    color: #808080;	
   7.144 +}
   7.145 +
   7.146 +/* start - table */
   7.147 +table {
   7.148 +    margin: 15px 0px; 	
   7.149 +    border-collapse: collapse;			
   7.150 +}
   7.151 +th {
   7.152 +    color: #FAFAFA;
   7.153 +    height: 38px;
   7.154 +    padding-left: 0px;
   7.155 +    padding-right: 12px;	
   7.156 +    text-align: left;	
   7.157 +}
   7.158 +tr {
   7.159 +    color: #5b5b5b;
   7.160 +    height: 15px;		
   7.161 +}
   7.162 +td {
   7.163 +    padding-left: 0px;
   7.164 +    padding-right: 12px;	
   7.165 +}
   7.166 +/* end - table */
   7.167 +
   7.168 +
   7.169 +/* form elements */
   7.170 +form {
   7.171 +    margin: 20px 10px; 
   7.172 +    padding: 15px 25px 25px 20px; 
   7.173 +    background: #070707; 	
   7.174 +/*border: 1px solid #111;	*/
   7.175 +}
   7.176 +form p {
   7.177 +    /*border-bottom: 1px solid #101010;*/
   7.178 +    padding: 12px 0 5px 0;	margin: 0;	
   7.179 +}
   7.180 +label {
   7.181 +    font-weight: bold;	
   7.182 +    color: #FAFAFA;
   7.183 +}
   7.184 +input, select, textarea {
   7.185 +    margin: 5px 0;
   7.186 +    padding: 5px;
   7.187 +    font: normal 1em Verdana, Tahoma, sans-serif;
   7.188 +    color: #6A6969;
   7.189 +    background: #0C0C0C;  
   7.190 +/*border: 1px solid #1C1C1C;*/
   7.191 +}
   7.192 +option { padding-right: 0.5em; } 
   7.193 +
   7.194 +#name, #email, #message{
   7.195 +    width: 480px;
   7.196 +}
   7.197 +input.button { 
   7.198 +    font: bold 12px Arial, Verdana, Sans-serif; 
   7.199 +    height: 30px;
   7.200 +    padding: 2px 3px; 
   7.201 +    margin-top: 8px;
   7.202 +    color: #48780E;
   7.203 +    background: #000;
   7.204 +    border-width: 1px;
   7.205 +    border-style: solid;
   7.206 +    border-color: #1B1B1B;
   7.207 +}
   7.208 +
   7.209 +
   7.210 +/* ------------------------------------------
   7.211 +   LAYOUT
   7.212 +   ------------------------------------------- */ 
   7.213 +#wrap { 
   7.214 +    position: relative;
   7.215 +    width: 1020px;
   7.216 +    margin: 0 auto;
   7.217 +    text-align: left;		
   7.218 +}
   7.219 +#content-wrap {
   7.220 +    clear: both;
   7.221 +    width: 1020px;	
   7.222 +    float: left;	
   7.223 +    padding-top: 15px;
   7.224 +    padding-bottom: 50px;	
   7.225 +}
   7.226 +#header {
   7.227 +    position: relative;
   7.228 +    width: 1020px;	
   7.229 +    height: 170px;	
   7.230 +    margin: 0; 
   7.231 +    padding: 0;			
   7.232 +}
   7.233 +#header h1#logo-text a {
   7.234 +    position: absolute;
   7.235 +    margin: 0; padding: 0;
   7.236 +    font: bold 65px 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;	
   7.237 +    letter-spacing: -1.5px;
   7.238 +    color: #F8F8F8;
   7.239 +    text-decoration: none;
   7.240 +    text-transform: none;
   7.241 +    
   7.242 +    /* change the values of top and left to adjust the position of the logo*/
   7.243 +    top: 70px; left: 30px;	
   7.244 +}
   7.245 +#header h1#logo-text a:hover {
   7.246 +    background: none;
   7.247 +    margin-top: 100px;	
   7.248 +    padding-top: 100px;
   7.249 +}
   7.250 +#header img {
   7.251 +    position: relative;
   7.252 +    top: 90px;
   7.253 +    left: 22px;
   7.254 +    border: 0px;
   7.255 +}
   7.256 +
   7.257 +#header p#intro {
   7.258 +    position: absolute;
   7.259 +    margin: 0; 
   7.260 +    padding: 0;
   7.261 +    font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;
   7.262 +    font-weight: bold;
   7.263 +    font-size: 16px;	
   7.264 +    line-height: 1.5em;
   7.265 +    font-style: normal;
   7.266 +    text-transform: none;
   7.267 +    /*color: #6D7D2D;*/
   7.268 +    color: #5ad715;
   7.269 +    width: 400px;
   7.270 +    
   7.271 +    /* change the values of top and left to adjust the position */
   7.272 +    top: 145px; 
   7.273 +    left: 22px;		
   7.274 +}
   7.275 +
   7.276 +/*  Navigation  */
   7.277 +#nav {
   7.278 +    position: absolute;
   7.279 +    margin: 0; 
   7.280 +    padding: 0;		
   7.281 +    height: 50px;
   7.282 +    left: 0px;	
   7.283 +    top: 30px;			
   7.284 +}
   7.285 +#nav ul {
   7.286 +    float: left;
   7.287 +    list-style: none;
   7.288 +    height: 50px;
   7.289 +    margin: 0 0 0 10px; 
   7.290 +    padding: 0;	
   7.291 +    display: inline;
   7.292 +}
   7.293 +#nav ul li {
   7.294 +    display: inline;
   7.295 +    margin: 0; 
   7.296 +    padding: 0;
   7.297 +}
   7.298 +#nav ul li a {
   7.299 +    float: left;
   7.300 +    margin: 0;	
   7.301 +    padding: 0 12px;
   7.302 +    font-weight: bold;
   7.303 +    font-size: 1.25em;
   7.304 +    text-decoration: none;	
   7.305 +    color: #c95723;
   7.306 +    color: #999;	
   7.307 +    text-transform: uppercase;
   7.308 +}
   7.309 +#nav ul li a:hover, 
   7.310 +#nav ul li a:active {
   7.311 +    color: #eee;
   7.312 +    background: none;
   7.313 +    border: none;
   7.314 +}
   7.315 +#nav ul li#current a {	
   7.316 +    color: #D33972;	
   7.317 +}
   7.318 +
   7.319 +#subnav{
   7.320 +    position: absolute;
   7.321 +    margin: 17px 280px; 
   7.322 +    padding: 0;		
   7.323 +    height: 50px;
   7.324 +    left: 10px;	
   7.325 +    top: 30px;		
   7.326 +}
   7.327 +
   7.328 +#subnav ul {
   7.329 +    float: left;
   7.330 +    list-style: none;
   7.331 +    height: 50px;
   7.332 +    margin: 0 0 0 10px; 
   7.333 +    padding: 0;	
   7.334 +    display: inline;
   7.335 +}
   7.336 +#subnav ul li {
   7.337 +    display: inline;
   7.338 +    margin: 0; 
   7.339 +    padding: 0;
   7.340 +}
   7.341 +#subnav ul li a {
   7.342 +    float: left;
   7.343 +    margin: 0;	
   7.344 +    padding: 0 12px;
   7.345 +    font: bold 15px/50px 'Trebuchet MS', Helvetica, Arial, Geneva, sans-serif;	
   7.346 +    text-decoration: none;	
   7.347 +    color: #5ad715;	
   7.348 +    text-transform: uppercase;
   7.349 +}
   7.350 +#subnav ul li a:hover, 
   7.351 +#subnav ul li a:active {
   7.352 +    color: #eee;
   7.353 +    background: none;
   7.354 +    border: none;
   7.355 +}
   7.356 +#subnav ul li#current a {	
   7.357 +    color: #D33972;	
   7.358 +}
   7.359 +
   7.360 +/* Main Column */
   7.361 +#main {
   7.362 +    float: left;
   7.363 +    width: 670px;
   7.364 +    padding: 0; 
   7.365 +    margin: 0 0 0 2px;
   7.366 +    display: inline;	
   7.367 +}
   7.368 +#main h2 {
   7.369 +    padding: 5px 22px;	
   7.370 +    margin: 15px 5px 0px 0px;
   7.371 +    /*font: bold 2.4em 'Trebuchet MS', Helvetica, Arial, sans-serif;				*/
   7.372 +    /*color: #45D5E6;
   7.373 +      color: #00cccc;*/
   7.374 +    color: #FFF;	
   7.375 +}
   7.376 +#main h2 a {
   7.377 +    /*color: #45D5E6;*/
   7.378 +    color: #FFF;
   7.379 +    text-decoration: none;		
   7.380 +    border: none;		
   7.381 +}
   7.382 +#main ul li {
   7.383 +    /*list-style-image: url(images/bullet.png);*/
   7.384 +    list-style: disc;
   7.385 +}
   7.386 +
   7.387 +/* Sidebar */	
   7.388 +#sidebar {
   7.389 +    float: right;
   7.390 +    width: 300px;
   7.391 +    padding: 0; 
   7.392 +    margin: 0px 18px 0 0;		
   7.393 +    display: inline;
   7.394 +    color: #5D5D5D;   
   7.395 +/*border: 4px solid #262626;*/
   7.396 +}
   7.397 +
   7.398 +#random_quote {   
   7.399 +    color: #c95723;
   7.400 +    font-style: italic;
   7.401 +}
   7.402 +
   7.403 +#sidebar h3 {
   7.404 +/*padding: 5px 12px;
   7.405 +  margin: 15px 5px 10px 0;
   7.406 +  font: bold 2.4em 'Trebuchet MS', Tahoma, Helvetica, Arial, sans-serif;				
   7.407 +  color: #45D5E6;*/
   7.408 +/*border-bottom: 1px solid #121212; */
   7.409 +/*background-image: url(pattern.gif);		*/	
   7.410 +}
   7.411 +#sidebar ul.sidemenu {
   7.412 +    text-align: left;
   7.413 +    margin: 20px 5px 20px 0px; 
   7.414 +    padding: 0;		
   7.415 +/*border-top: 1px solid #111;		*/
   7.416 +}
   7.417 +#sidebar ul.sidemenu li {
   7.418 +    list-style: none;
   7.419 +    padding: 8px 10px;
   7.420 +    margin: 0;    
   7.421 +/*border-bottom: 1px solid #111;*/
   7.422 +}
   7.423 +* html body #sidebar ul.sidemenu li {
   7.424 +    height: 1%;
   7.425 +}
   7.426 +#sidebar ul.sidemenu li a {
   7.427 +    text-decoration: none;	
   7.428 +    border: none;
   7.429 +    color: #666666;
   7.430 +    font-weight: bold;		
   7.431 +    /*font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;*/
   7.432 +    font-size: 9pt;		
   7.433 +}
   7.434 +#sidebar ul.sidemenu li a span {
   7.435 +    color: #444;	
   7.436 +    /*font-family: Georgia, 'Times New Roman', Times, serif;*/
   7.437 +    font-style: italic;
   7.438 +    font-weight: normal;	
   7.439 +    font-size: 8pt;
   7.440 +}
   7.441 +#sidebar ul.sidemenu li a:hover,
   7.442 +#sidebar ul.sidemenu li a:hover span {	
   7.443 +    color: #fff;	
   7.444 +}
   7.445 +#sidebar ul.sidemenu ul { margin: 0 0 0 0px; padding: 0; }
   7.446 +#sidebar ul.sidemenu ul li { border: none; }
   7.447 +
   7.448 +/* header quick search */
   7.449 +#sidebar form#quick-search {
   7.450 +    padding: 0; 
   7.451 +    margin: 20px 0 35px 0;
   7.452 +    border: none;
   7.453 +    width: 290px; height: 33px;
   7.454 +/*background: url(header-search.gif) no-repeat;		*/
   7.455 +}
   7.456 +#sidebar form#quick-search p {
   7.457 +    margin: 0; 
   7.458 +    padding: 0;		
   7.459 +}
   7.460 +#sidebar form#quick-search input {
   7.461 +    float: left;
   7.462 +    border: none;
   7.463 +    background: transparent;
   7.464 +    color: #4E4E4E;	
   7.465 +    margin: 0;
   7.466 +}
   7.467 +#sidebar form#quick-search .tbox {
   7.468 +    margin: 5px 0 0 0px; 
   7.469 +    width: 240px;	
   7.470 +    display: inline;	
   7.471 +}
   7.472 +#search form#quick-search .btn{
   7.473 +    width: 24px; height: 24px;			
   7.474 +}
   7.475 +#sidebar form#quick-search label {
   7.476 +    display: none;
   7.477 +}
   7.478 +
   7.479 +/* footer */
   7.480 +#footer {
   7.481 +    clear: both;
   7.482 +    /*padding: 1em 0 2.5em 0;*/
   7.483 +    background: #222222;
   7.484 +    color: #4E4E4E;
   7.485 +    width: 100%;
   7.486 +    float: left;			
   7.487 +}
   7.488 +#footer a {	
   7.489 +    color: #4E4E4E;
   7.490 +    /*color: #0E909C;*/
   7.491 +    border: none;
   7.492 +}
   7.493 +#footer a:hover {
   7.494 +    color: #fafafa;
   7.495 +}
   7.496 +#footer .rssfeed {
   7.497 +    background: url(images/rss.gif) no-repeat left 1px;
   7.498 +    padding-left: 17px;
   7.499 +}
   7.500 +#footer-left {
   7.501 +    float: left;
   7.502 +    width: 70%;
   7.503 +}
   7.504 +#footer-right {
   7.505 +    float: right;
   7.506 +    width: 25%;
   7.507 +}
   7.508 +
   7.509 +.download a
   7.510 +{	
   7.511 +    color: #5ad715;
   7.512 +}
   7.513 +
   7.514 +/* postmeta */
   7.515 +.postmeta {	
   7.516 +    padding: 7px 5px; 
   7.517 +    margin: 5px 5px 5px 5px;	
   7.518 +    font-size: 1em;	
   7.519 +    color: #545454;
   7.520 +    /*border: 1px solid #111; */
   7.521 +    background: #222222; 
   7.522 +}
   7.523 +.postmeta .date{ margin: 0 10px 0 5px;	}
   7.524 +.postmeta a.comments { margin: 0 10px 0 5px;	}
   7.525 +.postmeta a.readmore { margin: 0 10px 0 5px;	}
   7.526 +
   7.527 +.post-info { font-size: .95em; padding-top: 3px; margin-left: 5px; color: #444;	}
   7.528 +.post-info a, .post-info a:visited { color: #AE275A; }
   7.529 +
   7.530 +/* alignment classes */
   7.531 +.float-left  { float: left; }
   7.532 +.float-right { float: right; }
   7.533 +.align-left  { text-align: left; }
   7.534 +.align-right { text-align: right; }
   7.535 +
   7.536 +/* display and additional classes */
   7.537 +.no-border { 
   7.538 +    border: none; 
   7.539 +}
   7.540 +
   7.541 +.clearer { 
   7.542 +    clear: both; 
   7.543 +}
   7.544 +
   7.545 +.clear {
   7.546 +    display:inline-block; 
   7.547 +}
   7.548 +
   7.549 +.clear:after {
   7.550 +    display:block; 
   7.551 +    visibility:hidden; 
   7.552 +    clear:both; 
   7.553 +    height:0; 
   7.554 +    content: "."; 
   7.555 +}
   7.556 +
   7.557 +
     8.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     8.2 +++ b/howiwork.html	Sun Dec 18 03:44:26 2011 +0100
     8.3 @@ -0,0 +1,144 @@
     8.4 +<!DOCTYPE html>
     8.5 +<html lang="en">
     8.6 +  <head>
     8.7 +    <title>ME73</title>
     8.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
     8.9 +    <meta name="description" content="A Digital Playground" />
    8.10 +    <meta name="robots" content="index, follow, noarchive" />
    8.11 +    <meta name="googlebot" content="noarchive" />
    8.12 +    <script src="jquery.js"></script>
    8.13 +    <script src="script.js"></script>
    8.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
    8.15 +    <script type="application/javascript">
    8.16 +      var _gaq = _gaq || [];
    8.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
    8.18 +      _gaq.push(['_trackPageview']);
    8.19 +      (function() {
    8.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
    8.21 +      ga.async = true;
    8.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
    8.23 +      + '.google-analytics.com/ga.js';
    8.24 +      var s = document.getElementsByTagName('script')[0];
    8.25 +      s.parentNode.insertBefore(ga, s);
    8.26 +      })();
    8.27 +    </script>
    8.28 +  </head>
    8.29 +  <body>
    8.30 +    <div id="wrap">
    8.31 +      <div id="header">
    8.32 +        <canvas id="logo">
    8.33 +          FIND A BETTER BROWSER
    8.34 +        </canvas>    
    8.35 +        
    8.36 +      </div>
    8.37 +      <div id="content-wrap">
    8.38 +        <div id="main">
    8.39 +          <h2>Programming Languages</h2>
    8.40 +<p><!--<img src="images/binary.png" alt="binary" class="float-right" height="100" width="100" />-->
    8.41 +Some programming languages I've used, where the number of * show my level of expertise in the given language:</p>
    8.42 +<ul>
    8.43 +<li>
    8.44 +<h4>QBasic  *</h4>
    8.45 +My first.</li>
    8.46 +<li>
    8.47 +<h4>C++  *****</h4>
    8.48 +The dragon of system programming. My workhorse for efficient solutions.</li>
    8.49 +<li>
    8.50 +<h4>Java  ***</h4>
    8.51 +It's ok. I prefer tea.</li>
    8.52 +<li>
    8.53 +<h4>Haskell  *</h4>
    8.54 +Functional love-hate relationship.</li>
    8.55 +<li>
    8.56 +<h4>Prolog  **</h4>
    8.57 +Blew my mind. Awakened my interest in logics, not so much in using the language.</li>
    8.58 +<li>
    8.59 +<h4>C  *****</h4>
    8.60 +Clean, flat, structured. Runs the world under the hood.</li>
    8.61 +<li>
    8.62 +<h4>Assembly  **</h4>
    8.63 +The isomorphism from human mnemonics to machine code. Feel the cold touch of the machine mind.</li>
    8.64 +<li>
    8.65 +<h4>C#  ***</h4>
    8.66 +It's better than ok. I prefer seeing clear.</li>
    8.67 +<li>
    8.68 +<h4>Python  *****</h4>
    8.69 +Pragmatic, well-tempered, aesthetic. Fits perfectly into my method of working.</li>
    8.70 +<li>
    8.71 +<h4>Javascript  ***</h4>
    8.72 +The saviour of web frontends. Makes web development endurable.</li>
    8.73 +<li>
    8.74 +<h4>Go  *</h4>
    8.75 +Good idea, weird syntax. Doesn't go well with me.</li>
    8.76 +<li>
    8.77 +<h4>Common Lisp  **</h4>
    8.78 +The purity of programming love. Haven't seen the light yet.</li>
    8.79 +</ul>
    8.80 +<h2>Operating Systems</h2>
    8.81 +<ul>
    8.82 +<li><h4>GNU/Linux</h4>
    8.83 +Ubuntu, openSUSE, Red Hat and CentOS.</li>
    8.84 +<li><h4>Microsoft Windows</h4>
    8.85 +Windows 95/98/2000/XP/Vista/7.</li>
    8.86 +<li><h4>AmigaOS</h4>
    8.87 +Been a while...</li>
    8.88 +</ul>
    8.89 +<h2>Environments</h2>
    8.90 +<ul>
    8.91 +<li>
    8.92 +<h4>Emacs</h4>
    8.93 +My prefered editor. And I prefer my prefered editor.</li>
    8.94 +<li>
    8.95 +<h4>Visual Studio</h4>
    8.96 +Good IDE on Windows. Great debugger integration.</li>
    8.97 +<li>
    8.98 +<h4>Eclipse</h4>
    8.99 +Extendable. It's ok.</li>
   8.100 +</ul>
   8.101 +<h2>Tools</h2>
   8.102 +<ul>
   8.103 +<li>
   8.104 +<h4>Internet</h4>
   8.105 +Chrome for browsing and IRSSI for IRC.</li>
   8.106 +<li>
   8.107 +<h4>Documentation</h4>
   8.108 +LaTeX.</li>
   8.109 +<li>
   8.110 +<h4>Version Control</h4>
   8.111 +Mercurial for private work. 
   8.112 +Subversion/CVS when forced.</li>
   8.113 +</ul>
   8.114 +
   8.115 +
   8.116 +        </div>
   8.117 +        <div id="sidebar">
   8.118 +          <p>
   8.119 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
   8.120 +            <br />I'm a programmer,<br />
   8.121 +            a student of computer science,<br />
   8.122 +            a music enthusiast.<br />
   8.123 +            This is my site.
   8.124 +          </p>
   8.125 +          <div id="random_quote"></div>
   8.126 +        </div>
   8.127 +      </div>
   8.128 +      <div id="footer">
   8.129 +        <div id="footer-left">
   8.130 +          <p>
   8.131 +            <a href="mailto:sawine@me73.com">
   8.132 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
   8.133 +          </p>
   8.134 +        </div>
   8.135 +        <div id="footer-right">
   8.136 +          <p class="align-right">
   8.137 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
   8.138 +          </p>
   8.139 +        </div>
   8.140 +      </div>
   8.141 +    </div>
   8.142 +    <script type="application/javascript">
   8.143 +      javascript:load_random_quote();
   8.144 +    </script>
   8.145 +  </body>
   8.146 +</html>
   8.147 +
     9.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     9.2 +++ b/index.html	Sun Dec 18 03:44:26 2011 +0100
     9.3 @@ -0,0 +1,72 @@
     9.4 +<!DOCTYPE html>
     9.5 +<html lang="en">
     9.6 +  <head>
     9.7 +    <title>ME73</title>
     9.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
     9.9 +    <meta name="description" content="A Digital Playground" />
    9.10 +    <meta name="robots" content="index, follow, noarchive" />
    9.11 +    <meta name="googlebot" content="noarchive" />
    9.12 +    <script src="jquery.js"></script>
    9.13 +    <script src="script.js"></script>
    9.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
    9.15 +    <script type="application/javascript">
    9.16 +      var _gaq = _gaq || [];
    9.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
    9.18 +      _gaq.push(['_trackPageview']);
    9.19 +      (function() {
    9.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
    9.21 +      ga.async = true;
    9.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
    9.23 +      + '.google-analytics.com/ga.js';
    9.24 +      var s = document.getElementsByTagName('script')[0];
    9.25 +      s.parentNode.insertBefore(ga, s);
    9.26 +      })();
    9.27 +    </script>
    9.28 +  </head>
    9.29 +  <body>
    9.30 +    <div id="wrap">
    9.31 +      <div id="header">
    9.32 +        <canvas id="logo">
    9.33 +          FIND A BETTER BROWSER
    9.34 +        </canvas>    
    9.35 +        
    9.36 +      </div>
    9.37 +      <div id="content-wrap">
    9.38 +        <div id="main">
    9.39 +          <p>
    9.40 +  <img src="images/mandelbrot.png" alt="Mandelbrot" height="280" width="100%" />
    9.41 +</p>
    9.42 +       
    9.43 +
    9.44 +        </div>
    9.45 +        <div id="sidebar">
    9.46 +          <p>
    9.47 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
    9.48 +            <br />I'm a programmer,<br />
    9.49 +            a student of computer science,<br />
    9.50 +            a music enthusiast.<br />
    9.51 +            This is my site.
    9.52 +          </p>
    9.53 +          <div id="random_quote"></div>
    9.54 +        </div>
    9.55 +      </div>
    9.56 +      <div id="footer">
    9.57 +        <div id="footer-left">
    9.58 +          <p>
    9.59 +            <a href="mailto:sawine@me73.com">
    9.60 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
    9.61 +          </p>
    9.62 +        </div>
    9.63 +        <div id="footer-right">
    9.64 +          <p class="align-right">
    9.65 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
    9.66 +          </p>
    9.67 +        </div>
    9.68 +      </div>
    9.69 +    </div>
    9.70 +    <script type="application/javascript">
    9.71 +      javascript:load_random_quote();
    9.72 +    </script>
    9.73 +  </body>
    9.74 +</html>
    9.75 +
    10.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    10.2 +++ b/links.html	Sun Dec 18 03:44:26 2011 +0100
    10.3 @@ -0,0 +1,126 @@
    10.4 +<!DOCTYPE html>
    10.5 +<html lang="en">
    10.6 +  <head>
    10.7 +    <title>ME73</title>
    10.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
    10.9 +    <meta name="description" content="A Digital Playground" />
   10.10 +    <meta name="robots" content="index, follow, noarchive" />
   10.11 +    <meta name="googlebot" content="noarchive" />
   10.12 +    <script src="jquery.js"></script>
   10.13 +    <script src="script.js"></script>
   10.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
   10.15 +    <script type="application/javascript">
   10.16 +      var _gaq = _gaq || [];
   10.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
   10.18 +      _gaq.push(['_trackPageview']);
   10.19 +      (function() {
   10.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
   10.21 +      ga.async = true;
   10.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
   10.23 +      + '.google-analytics.com/ga.js';
   10.24 +      var s = document.getElementsByTagName('script')[0];
   10.25 +      s.parentNode.insertBefore(ga, s);
   10.26 +      })();
   10.27 +    </script>
   10.28 +  </head>
   10.29 +  <body>
   10.30 +    <div id="wrap">
   10.31 +      <div id="header">
   10.32 +        <canvas id="logo">
   10.33 +          FIND A BETTER BROWSER
   10.34 +        </canvas>    
   10.35 +        
   10.36 +      </div>
   10.37 +      <div id="content-wrap">
   10.38 +        <div id="main">
   10.39 +          <h2>The Good</h2>
   10.40 +<ul>
   10.41 +<li><h4><a href="http://www.wikipedia.org">Wikipedia</a></h4>
   10.42 +The fascination of community, the wealth of knowledge.
   10.43 +</li>
   10.44 +<li><h4><a href="http://www.ted.com">TED</a></h4>
   10.45 +Inspiring.
   10.46 +</li>
   10.47 +<li><h4><a href="http://www.xkcd.com">xkcd</a></h4>
   10.48 +Kernel dumping thrice a week.
   10.49 +</li>
   10.50 +</ul>
   10.51 +
   10.52 +<h2>The Bad</h2>
   10.53 +<ul>
   10.54 +<li><h4><a href="https://twitter.com/notchnik">@notchnik</a></h4>
   10.55 +The emptyness in 140 characters.
   10.56 +</li>
   10.57 +<li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
   10.58 +Staying in touch with people by keeping them at a distance.
   10.59 +</li>
   10.60 +</ul>
   10.61 +
   10.62 +<h2>Professional</h2>
   10.63 +<ul>
   10.64 +<li><h4><a href="http://www4.informatik.tu-muenchen.de/~schulz/">Dr. Stephan Schulz</a></h4>
   10.65 +My advisor during my bachelor thesis and creator of the brainiac theorem prover called E.
   10.66 +</li>
   10.67 +</ul>
   10.68 +
   10.69 +<h2>Friends (with websites)</h2>
   10.70 +<ul>
   10.71 +<!--<li><h4><a href="http://www.tomrocket.com">Thomas Witt</a></h4>
   10.72 +A good friend and designer for the visual arts.
   10.73 +</li>-->
   10.74 +<li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
   10.75 +A fellow student and companion in the quest for world domination.
   10.76 +</li>
   10.77 +<li><h4><a href="http://www.unidentify.com">Michael Chlebek</a></h4>
   10.78 +A friend, programmer and amateuer photographer.
   10.79 +</li>
   10.80 +<!--<li><h4><a href="http://thuber.net">Thomas Huber</a></h4>
   10.81 +A fellow student of artificial intelligence.
   10.82 +</li>-->
   10.83 +</ul>
   10.84 +
   10.85 +<h2>Recursive</h2>
   10.86 +<ul>
   10.87 +<li><h4><a href="links.html">ME73</a></h4>
   10.88 +A recursion.
   10.89 +</li>
   10.90 +<li><h4><a href="linksend.html">ME73</a></h4>
   10.91 +A well-founded recursion.
   10.92 +</li>
   10.93 +</ul>
   10.94 +
   10.95 +
   10.96 +
   10.97 +
   10.98 +        </div>
   10.99 +        <div id="sidebar">
  10.100 +          <p>
  10.101 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
  10.102 +            <br />I'm a programmer,<br />
  10.103 +            a student of computer science,<br />
  10.104 +            a music enthusiast.<br />
  10.105 +            This is my site.
  10.106 +          </p>
  10.107 +          <div id="random_quote"></div>
  10.108 +        </div>
  10.109 +      </div>
  10.110 +      <div id="footer">
  10.111 +        <div id="footer-left">
  10.112 +          <p>
  10.113 +            <a href="mailto:sawine@me73.com">
  10.114 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
  10.115 +          </p>
  10.116 +        </div>
  10.117 +        <div id="footer-right">
  10.118 +          <p class="align-right">
  10.119 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
  10.120 +          </p>
  10.121 +        </div>
  10.122 +      </div>
  10.123 +    </div>
  10.124 +    <script type="application/javascript">
  10.125 +      javascript:load_random_quote();
  10.126 +    </script>
  10.127 +  </body>
  10.128 +</html>
  10.129 +
    11.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    11.2 +++ b/linksend.html	Sun Dec 18 03:44:26 2011 +0100
    11.3 @@ -0,0 +1,118 @@
    11.4 +<!DOCTYPE html>
    11.5 +<html lang="en">
    11.6 +  <head>
    11.7 +    <title>ME73</title>
    11.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
    11.9 +    <meta name="description" content="A Digital Playground" />
   11.10 +    <meta name="robots" content="index, follow, noarchive" />
   11.11 +    <meta name="googlebot" content="noarchive" />
   11.12 +    <script src="jquery.js"></script>
   11.13 +    <script src="script.js"></script>
   11.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
   11.15 +    <script type="application/javascript">
   11.16 +      var _gaq = _gaq || [];
   11.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
   11.18 +      _gaq.push(['_trackPageview']);
   11.19 +      (function() {
   11.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
   11.21 +      ga.async = true;
   11.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
   11.23 +      + '.google-analytics.com/ga.js';
   11.24 +      var s = document.getElementsByTagName('script')[0];
   11.25 +      s.parentNode.insertBefore(ga, s);
   11.26 +      })();
   11.27 +    </script>
   11.28 +  </head>
   11.29 +  <body>
   11.30 +    <div id="wrap">
   11.31 +      <div id="header">
   11.32 +        <canvas id="logo">
   11.33 +          FIND A BETTER BROWSER
   11.34 +        </canvas>    
   11.35 +        
   11.36 +      </div>
   11.37 +      <div id="content-wrap">
   11.38 +        <div id="main">
   11.39 +          <h2>The Good</h2>
   11.40 +<ul>
   11.41 +<li><h4><a href="http://www.wikipedia.org">Wikipedia</a></h4>
   11.42 +The fascination of community, the wealth of knowledge.
   11.43 +</li>
   11.44 +<li><h4><a href="http://www.ted.com">TED</a></h4>
   11.45 +Inspiring.
   11.46 +</li>
   11.47 +<li><h4><a href="http://www.xkcd.com">xkcd</a></h4>
   11.48 +Kernel dumping thrice a week.
   11.49 +</li>
   11.50 +</ul>
   11.51 +
   11.52 +<h2>The Bad</h2>
   11.53 +<ul>
   11.54 +<li><h4><a href="https://plus.google.com/101733701635400621767/">Google+ profile</a></h4>
   11.55 +Staying in touch with people by keeping them at a distance.
   11.56 +</li>
   11.57 +</ul>
   11.58 +
   11.59 +<h2>Professional</h2>
   11.60 +<ul>
   11.61 +<li><h4><a href="http://www4.informatik.tu-muenchen.de/~schulz/">Dr. Stephan Schulz</a></h4>
   11.62 +My advisor during my bachelor thesis and creator of the brainiac theorem prover called E.
   11.63 +</li>
   11.64 +</ul>
   11.65 +
   11.66 +<h2>Friends (with websites)</h2>
   11.67 +<ul>
   11.68 +<!--<li><h4><a href="http://www.tomrocket.com">Thomas Witt</a></h4>
   11.69 +A good friend and designer for the visual arts.
   11.70 +</li>-->
   11.71 +<li><h4><a href="http://www.chris-koenig.de">Christian König</a></h4>
   11.72 +A fellow student and companion in the quest for world domination.
   11.73 +</li>
   11.74 +<li><h4><a href="http://www.unidentify.com">Michael Chlebek</a></h4>
   11.75 +A friend, programmer and amateuer photographer.
   11.76 +</li>
   11.77 +<!--<li><h4><a href="http://thuber.net">Thomas Huber</a></h4>
   11.78 +A fellow student of artificial intelligence.
   11.79 +</li>-->
   11.80 +</ul>
   11.81 +
   11.82 +<h2>Recursive</h2>
   11.83 +<ul>
   11.84 +<li>
   11.85 +The End.<br />
   11.86 +Recursive humour recycled from <a href="http://www4.informatik.tu-muenchen.de/~schulz/">Stephan Schulz</a>, to preserve the environment.
   11.87 +</li>
   11.88 +</ul>
   11.89 +
   11.90 +        </div>
   11.91 +        <div id="sidebar">
   11.92 +          <p>
   11.93 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
   11.94 +            <br />I'm a programmer,<br />
   11.95 +            a student of computer science,<br />
   11.96 +            a music enthusiast.<br />
   11.97 +            This is my site.
   11.98 +          </p>
   11.99 +          <div id="random_quote"></div>
  11.100 +        </div>
  11.101 +      </div>
  11.102 +      <div id="footer">
  11.103 +        <div id="footer-left">
  11.104 +          <p>
  11.105 +            <a href="mailto:sawine@me73.com">
  11.106 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
  11.107 +          </p>
  11.108 +        </div>
  11.109 +        <div id="footer-right">
  11.110 +          <p class="align-right">
  11.111 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
  11.112 +          </p>
  11.113 +        </div>
  11.114 +      </div>
  11.115 +    </div>
  11.116 +    <script type="application/javascript">
  11.117 +      javascript:load_random_quote();
  11.118 +    </script>
  11.119 +  </body>
  11.120 +</html>
  11.121 +
    12.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    12.2 +++ b/machine.js	Sun Dec 18 03:44:26 2011 +0100
    12.3 @@ -0,0 +1,145 @@
    12.4 +function main()
    12.5 +{
    12.6 +    var canvas = document.getElementById("machine");
    12.7 +    var context = new Context(canvas);
    12.8 +    var gl = context.gl;
    12.9 +    context.object = new Box(1, context);
   12.10 +    gl.clearColor(0.0, 0.0, 0.0, 1.0);
   12.11 +    gl.enable(gl.DEPTH_TEST);
   12.12 +    draw(context);
   12.13 +}
   12.14 +
   12.15 +function Context(canvas)
   12.16 +{
   12.17 +    try 
   12.18 +    {
   12.19 +	this.gl = canvas.getContext("experimental-webgl");
   12.20 +	this.viewport = {'width': canvas.width,
   12.21 +			 'height': canvas.height};
   12.22 +    } 
   12.23 +    catch(e) 
   12.24 +    {
   12.25 +	alert(e);
   12.26 +    }
   12.27 +    if (!this.gl) alert("Failed: WebGL init.");
   12.28 +    this.mvMatrix = mat4.create();
   12.29 +    this.pMatrix = mat4.create();
   12.30 +    this.shader = new Shader(this);    
   12.31 +}
   12.32 +Context.prototype.updateMatrixUniforms = function()
   12.33 +{
   12.34 +    var gl = this.gl;
   12.35 +    var program = this.shader.program;
   12.36 +    var pMatrix = this.pMatrix;
   12.37 +    var mvMatrix = this.mvMatrix;
   12.38 +    gl.uniformMatrix4fv(program.pMatrixUniform, false, pMatrix);
   12.39 +    gl.uniformMatrix4fv(program.mvMatrixUniform, false, mvMatrix);
   12.40 +}
   12.41 +
   12.42 +function Shader(context)
   12.43 +{
   12.44 +    var gl = context.gl;
   12.45 +    var fragment = loadShader(gl, "shader-fs");
   12.46 +    var vertex = loadShader(gl, "shader-vs");
   12.47 +    this.program = gl.createProgram();
   12.48 +    gl.attachShader(this.program, vertex);
   12.49 +    gl.attachShader(this.program, fragment);
   12.50 +    gl.linkProgram(this.program);
   12.51 +
   12.52 +    if (!gl.getProgramParameter(this.program, gl.LINK_STATUS))
   12.53 +    {
   12.54 +	alert("Failed: Shader init.");
   12.55 +    }
   12.56 +
   12.57 +    gl.useProgram(this.program);
   12.58 +    this.vertexPosition = gl.getAttribLocation(this.program, "aVertexPosition");
   12.59 +    gl.enableVertexAttribArray(this.vertexPosition);
   12.60 +    this.pMatrixUniform = gl.getUniformLocation(this.program, "uPMatrix");
   12.61 +    this.mvMatrixUniform = gl.getUniformLocation(this.program, "uMVMatrix");
   12.62 +
   12.63 +    function loadShader(gl, id)
   12.64 +    {
   12.65 +	var script = document.getElementById(id);
   12.66 +	if (!script) return null;
   12.67 +	
   12.68 +	var str = "";
   12.69 +	var child = script.firstChild;
   12.70 +	while (child)
   12.71 +	{
   12.72 +	    if (child.nodeType == 3) str += child.textContent;
   12.73 +	    child = child.nextSibling;
   12.74 +	}
   12.75 +	
   12.76 +	var shader;
   12.77 +	var common = "x-shader/x-";
   12.78 +	if (script.type == common + "fragment") shader = gl.createShader(gl.FRAGMENT_SHADER);
   12.79 +	else if (script.type == common + "vertex") shader = gl.createShader(gl.VERTEX_SHADER);
   12.80 +	else return null;
   12.81 +
   12.82 +	gl.shaderSource(shader, str);
   12.83 +	gl.compileShader(shader);
   12.84 +
   12.85 +	if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS))
   12.86 +        {
   12.87 +	    alert(gl.getShaderInfoLog(shader));
   12.88 +	    return null;
   12.89 +	}
   12.90 +
   12.91 +	return shader;
   12.92 +    }
   12.93 +}
   12.94 +
   12.95 +
   12.96 +function Box(size, context)
   12.97 +{
   12.98 +    var gl = context.gl;
   12.99 +    this.size = size || 1;
  12.100 +    this.buffer = gl.createBuffer();
  12.101 +    gl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);
  12.102 +    var vertices = [1.0, 1.0, 0.0,
  12.103 +		    -1.0, 1.0, 0.0,
  12.104 +		    1.0, -1.0, 0.0,
  12.105 +		    -1.0, -1.0, 0.0];
  12.106 +    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
  12.107 +    this.itemSize = 3;
  12.108 +    this.numItems = 4;
  12.109 +}
  12.110 +
  12.111 +function draw(context)
  12.112 +{
  12.113 +    var gl = context.gl;
  12.114 +    var viewport = context.viewport;
  12.115 +    var shader = context.shader;
  12.116 +    var mvMatrix = context.mvMatrix;
  12.117 +    var pMatrix = context.pMatrix;
  12.118 +    var object = context.object;
  12.119 +    gl.viewport(0, 0, viewport.width, viewport.height);
  12.120 +    gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  12.121 +    mat4.perspective(45, viewport.width / viewport.height, 0.1, 100.0, pMatrix);
  12.122 +    mat4.identity(mvMatrix);
  12.123 +    mat4.translate(mvMatrix, [0.0, 0.0, -7.0]);
  12.124 +    gl.bindBuffer(gl.ARRAY_BUFFER, object.buffer);
  12.125 +    gl.vertexAttribPointer(shader.vertexPosition, object.itemSize, gl.FLOAT, false, 0, 0); 
  12.126 +    gl.uniformMatrix4fv(shader.pMatrixUniform, false, pMatrix);
  12.127 +    gl.uniformMatrix4fv(shader.mvMatrixUniform, false, mvMatrix);
  12.128 +    //context.updateMatrixUniforms();
  12.129 +    gl.drawArrays(gl.TRIANGLE_STRIP, 0, object.numItems);
  12.130 +    return context;
  12.131 +} 
  12.132 +
  12.133 +function drawScene(context) {
  12.134 +        gl.viewport(0, 0, viewport.width, viewport.height);
  12.135 +        gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  12.136 + 
  12.137 +        mat4.perspective(45, viewport.width / viewport.height, 0.1, 100.0, pMatrix);
  12.138 + 
  12.139 +        mat4.identity(mvMatrix); 
  12.140 +        mat4.translate(mvMatrix, [0.0, 0.0, -7.0]);
  12.141 +  
  12.142 +        gl.bindBuffer(gl.ARRAY_BUFFER, object.buffer);
  12.143 +        gl.vertexAttribPointer(shader.vertexPosition, object.itemSize, gl.FLOAT, false, 0, 0);
  12.144 +        gl.uniformMatrix4fv(shader.pMatrixUniform, false, pMatrix);
  12.145 +	gl.uniformMatrix4fv(shader.mvMatrixUniform, false, mvMatrix);
  12.146 +        gl.drawArrays(gl.TRIANGLE_STRIP, 0, object.numItems);
  12.147 +    }
  12.148 + 
  12.149 \ No newline at end of file
    13.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    13.2 +++ b/personalwork.html	Sun Dec 18 03:44:26 2011 +0100
    13.3 @@ -0,0 +1,214 @@
    13.4 +<!DOCTYPE html>
    13.5 +<html lang="en">
    13.6 +  <head>
    13.7 +    <title>ME73</title>
    13.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
    13.9 +    <meta name="description" content="A Digital Playground" />
   13.10 +    <meta name="robots" content="index, follow, noarchive" />
   13.11 +    <meta name="googlebot" content="noarchive" />
   13.12 +    <script src="jquery.js"></script>
   13.13 +    <script src="script.js"></script>
   13.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
   13.15 +    <script type="application/javascript">
   13.16 +      var _gaq = _gaq || [];
   13.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
   13.18 +      _gaq.push(['_trackPageview']);
   13.19 +      (function() {
   13.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
   13.21 +      ga.async = true;
   13.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
   13.23 +      + '.google-analytics.com/ga.js';
   13.24 +      var s = document.getElementsByTagName('script')[0];
   13.25 +      s.parentNode.insertBefore(ga, s);
   13.26 +      })();
   13.27 +    </script>
   13.28 +  </head>
   13.29 +  <body>
   13.30 +    <div id="wrap">
   13.31 +      <div id="header">
   13.32 +        <canvas id="logo">
   13.33 +          FIND A BETTER BROWSER
   13.34 +        </canvas>    
   13.35 +        
   13.36 +      </div>
   13.37 +      <div id="content-wrap">
   13.38 +        <div id="main">
   13.39 +          <p>Here is an unfiltered, undocumented, user-unfriendly random stack of little hacks, that I've produced for recreational reasons. I put them online in spirit of the liberation of useless machines.</p>
   13.40 +
   13.41 +<h2><a name="tim">Tim</a></h2>
   13.42 +<ul>
   13.43 +<li>
   13.44 +<h4>Description</h4>
   13.45 +A console-based head-on time recording tool, because time is money.</li>
   13.46 +<li>
   13.47 +<h4>Version</h4>
   13.48 +A stable prototype, no output generation yet.
   13.49 +<div class="download"><a href="downloads/tim.zip">
   13.50 +                    Download Tim (Python and SQLite3 required)</a></div></li>
   13.51 +</ul>
   13.52 +
   13.53 +<h2><a name="cau">Cau</a></h2>
   13.54 +<img src="images/cau.png" alt="cau screenshot" class="float-right" height="150" width="200" />
   13.55 +<ul>
   13.56 +<li>
   13.57 +<h4>Description</h4>
   13.58 +Is bad PI-approximation good enough? A cellular automaton-based PI-approximation machine with Tkinter-based visualisation.</li>
   13.59 +<li>
   13.60 +<h4>Version</h4>
   13.61 +Working, approximating, slowly visualising.
   13.62 +<div class="download"><a href="downloads/cau.zip">
   13.63 +                    Download Cau (Python and Tkinter required)</a></div></li>
   13.64 +</ul>
   13.65 +
   13.66 +<h2><a name="sml">SML</a></h2>
   13.67 +<ul>
   13.68 +<li>
   13.69 +<h4>Description</h4>
   13.70 +A simple Simple Modal Logic library doing all kinds of reductions including Modal Conjunctive Normal Form. It also features DIMACS output and a satisfiability test via MiniSat2.</li>
   13.71 +<li>
   13.72 +<h4>Version</h4>
   13.73 +Reliable version except for features noted as alpha. Parser has too much personality.
   13.74 +<div class="download"><a href="downloads/sml.zip">
   13.75 +                    Download SML (Python and MiniSat2 required)</a></div></li>
   13.76 +</ul>
   13.77 +
   13.78 +<h2><a name="netchannel">NetChannel</a></h2>
   13.79 +<ul>
   13.80 +<li>
   13.81 +<h4>Description</h4>
   13.82 +NetChannel is a simple Python object for message-based network communication
   13.83 +                    on the TCP/IP stack. NetChannel is based on stateful sessions for improved performance.</li>
   13.84 +<li>
   13.85 +<h4>Version</h4>
   13.86 +A stable prototype.
   13.87 +<div class="download"><a href="downloads/netchannel.zip">
   13.88 +                    Download NetChannel (Python required)</a></div></li>
   13.89 +</ul>
   13.90 +
   13.91 +<h2><a name="eden">Eden Plotter</a></h2>
   13.92 +<img src="images/edenplotters1.png" alt="eden plotter" class="float-right" height="150" width="200" />
   13.93 +<ul>
   13.94 +<li>
   13.95 +<h4>Description</h4>
   13.96 +Eden Plotter or Eden One is a quick prototype for my genetic programming routines.
   13.97 +It approximates a given function by the methods of GP.</li>
   13.98 +<li>
   13.99 +<h4>Version</h4>
  13.100 +An unendurable slow prototype.
  13.101 +<div class="download"><a href="downloads/eden.zip">
  13.102 +                    Download Eden Plotter (Python required)</a></div></li>
  13.103 +</ul>
  13.104 +
  13.105 +<h2><a name="anq">ANQ</a></h2>
  13.106 +<ul>
  13.107 +<li>
  13.108 +<h4>Description</h4>                    
  13.109 +ANQ is a testing environment for distributed algorithms. It provides a
  13.110 +centralised and convenient way of organising runtime dynamic
  13.111 +topologies, gives full control over the initialisation and flow of the
  13.112 +algorithm and helps in tracking the current node states by visualising
  13.113 +the node reports on the OpenGL graph.</br>
  13.114 +ANQ builds on the ANQ Protocol which can be optionally extended on
  13.115 +special needs for the algorithm to be tested. The ANQ Master is written
  13.116 +in C# using Windows Forms and OpenGL. Observer, Hotbed and the example
  13.117 +Node were developed in Python.
  13.118 +</li>
  13.119 +</ul>
  13.120 +<img src="images/anqs3.png" alt="anq" class="float-right" height="130" width="200" />
  13.121 +<img src="images/anqs2.png" alt="anq" class="float-right" height="130" width="200" />
  13.122 +<ul>
  13.123 +<li>
  13.124 +<h4>Version Antquarium Prototype</h4>
  13.125 +Antquarium is the predecessor of ANQ. It was an extended course assignment and serves as a prototype for ANQ.
  13.126 +<div class="download"><a href="downloads/antquarium.zip">
  13.127 +                    Download Antquarium for Windows (Python and .Net 2.0 required)</a></div>
  13.128 +</li>
  13.129 +<li>
  13.130 +<h4>Version</h4>
  13.131 +Stable version missing features like flow and runtime topology control.
  13.132 +</li>
  13.133 +</ul>
  13.134 +
  13.135 +<h2><a name="theme_blocks">Theme Blocks</a></h2>
  13.136 +<img src="images/themeblockss1.png" alt="theme blocks" class="float-right" height="150" width="200" />
  13.137 +<ul>
  13.138 +<li>
  13.139 +<h4>Gameplay</h4>
  13.140 +A traditional gameplay most people will be familiar with.
  13.141 +You have blocks falling down, you have a highscore.
  13.142 +</li>
  13.143 +<li>
  13.144 +<h4>Features</h4>
  13.145 +<ul><li>Online highscore list</li><li>Hardware accelerated graphics</li><li>Fullscreen and windowed mode</li><li>Two colour themes: black and white</li><li>Anti-aliasing support</li></ul>
  13.146 +</li>
  13.147 +<li>
  13.148 +<h4>Requirements</h4>		        
  13.149 +<ul><li>Microsoft Windows XP or Vista</li><li>Graphics card supporting OpenGL 1.3 or higher</li><li>One keyboard with at least the arrow keys working</li></ul>	                		    
  13.150 +<div class="download"><a href="downloads/ThemeBlocksSetup.exe">Download Theme Blocks (1.4MB)</a></div>           
  13.151 +</li>
  13.152 +</ul>
  13.153 +
  13.154 +<h2><a name="pyng_pong">Pyng Pong</a></h2>
  13.155 +<img src="images/pyngpongs1.png" alt="pyng pong screenshot" class="float-right" height="149" width="200" />
  13.156 +<ul>
  13.157 +<li>
  13.158 +<h4>Gameplay</h4>
  13.159 +Two bats, one ball...
  13.160 +</li>
  13.161 +<li>
  13.162 +<h4>Features</h4>
  13.163 +<ul><li>Three AI difficulty levels</li><li>Endless gameplay, play till you're bored!</li></ul>
  13.164 +<div class="download"><a href="downloads/PyngPongSetup.exe">
  13.165 +                    Download Pyng Pong for Windows (2.4MB)</a></div>
  13.166 +<div class="download"><a href="downloads/pyngpong.zip">
  13.167 +                    Download Pyng Pong Source (Python + PyGame needed) (0.4MB)</a></div>	
  13.168 +</li>
  13.169 +</ul>
  13.170 +
  13.171 +<h2><a name="klangbild">Klangbild</a></h2>
  13.172 +<img src="images/klangbilds1.png" alt="klangbild" class="float-right" height="150" width="200" />
  13.173 +<ul>
  13.174 +<li>
  13.175 +<h4>Gameplay</h4>
  13.176 +There is no gameplay yet, it's a prototype for an audio-visual puzzle game.
  13.177 +</li>
  13.178 +<li>
  13.179 +<h4>Features</h4>
  13.180 +<ul><li>Drag, create and remove sound sources</li><li>Height of placement sets the sound pitch</li></ul>
  13.181 +<div class="download"><a href="downloads/klangbild.zip">
  13.182 +                    Download Klangbild (Python and PyGlet required)</a></div>		            
  13.183 +</li></ul>            
  13.184 +            		
  13.185 +
  13.186 +        </div>
  13.187 +        <div id="sidebar">
  13.188 +          <p>
  13.189 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
  13.190 +            <br />I'm a programmer,<br />
  13.191 +            a student of computer science,<br />
  13.192 +            a music enthusiast.<br />
  13.193 +            This is my site.
  13.194 +          </p>
  13.195 +          <div id="random_quote"></div>
  13.196 +        </div>
  13.197 +      </div>
  13.198 +      <div id="footer">
  13.199 +        <div id="footer-left">
  13.200 +          <p>
  13.201 +            <a href="mailto:sawine@me73.com">
  13.202 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
  13.203 +          </p>
  13.204 +        </div>
  13.205 +        <div id="footer-right">
  13.206 +          <p class="align-right">
  13.207 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
  13.208 +          </p>
  13.209 +        </div>
  13.210 +      </div>
  13.211 +    </div>
  13.212 +    <script type="application/javascript">
  13.213 +      javascript:load_random_quote();
  13.214 +    </script>
  13.215 +  </body>
  13.216 +</html>
  13.217 +
    14.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    14.2 +++ b/resume.html	Sun Dec 18 03:44:26 2011 +0100
    14.3 @@ -0,0 +1,118 @@
    14.4 +<!DOCTYPE html>
    14.5 +<html lang="en">
    14.6 +  <head>
    14.7 +    <title>ME73</title>
    14.8 +    <meta name="author" content="Eugen Sawin <sawine@me73.com>" />
    14.9 +    <meta name="description" content="A Digital Playground" />
   14.10 +    <meta name="robots" content="index, follow, noarchive" />
   14.11 +    <meta name="googlebot" content="noarchive" />
   14.12 +    <script src="jquery.js"></script>
   14.13 +    <script src="script.js"></script>
   14.14 +    <link rel="stylesheet" href="dark.css" type="text/css" />
   14.15 +    <script type="application/javascript">
   14.16 +      var _gaq = _gaq || [];
   14.17 +      _gaq.push(['_setAccount', 'UA-2137333-1']);
   14.18 +      _gaq.push(['_trackPageview']);
   14.19 +      (function() {
   14.20 +      var ga = document.createElement('script'); ga.type = 'text/javascript';
   14.21 +      ga.async = true;
   14.22 +      ga.src = ('https:' == document.location.protocol ? 'https://ssl' :'http://www') 
   14.23 +      + '.google-analytics.com/ga.js';
   14.24 +      var s = document.getElementsByTagName('script')[0];
   14.25 +      s.parentNode.insertBefore(ga, s);
   14.26 +      })();
   14.27 +    </script>
   14.28 +  </head>
   14.29 +  <body>
   14.30 +    <div id="wrap">
   14.31 +      <div id="header">
   14.32 +        <canvas id="logo">
   14.33 +          FIND A BETTER BROWSER
   14.34 +        </canvas>    
   14.35 +        
   14.36 +      </div>
   14.37 +      <div id="content-wrap">
   14.38 +        <div id="main">
   14.39 +          <p>All locations below are located in Germany, unless otherwise noted.</p>
   14.40 +<h2>Employment</h2>
   14.41 +<ul>
   14.42 +<li>
   14.43 +<h4>Software Engineer, Comsoft GmbH, 03/2010-09/2010</h4>
   14.44 +<ul>
   14.45 +<li>
   14.46 +Development of safety-critical back end systems for the ATC domain.
   14.47 +</li>
   14.48 +<li>
   14.49 +On-site system integration and training.
   14.50 +</li>
   14.51 +</ul>
   14.52 +</li>
   14.53 +<li><h4>Working Student &amp; Internship, Comsoft GmbH, 10/2008-02/2010</h4>
   14.54 +Development for safety-critical embedded systems.
   14.55 +</li>
   14.56 +<li>
   14.57 +<h4>Student Assistant, University of Applied Sciences Offenburg, 10/2008-03/2009</h4>
   14.58 +Assistance at a university course for object-oriented software development.
   14.59 +</li>
   14.60 +</ul>
   14.61 +<h2>Education</h2>
   14.62 +<ul>
   14.63 +<li>
   14.64 +<h4>University of Freiburg, since 10/2010</h4>
   14.65 +M.Sc. in Applied Computer Science.<br />
   14.66 +Emphasis in Artificial Intelligence and Algorithm Theory.
   14.67 +</li>
   14.68 +<li>
   14.69 +<h4>University of Applied Sciences Offenburg, 03/2007-02/2010</h4>
   14.70 +B.Sc. in Applied Computer Science.<br />
   14.71 +Emphasis in Distributed Systems.
   14.72 +</li>
   14.73 +</ul>
   14.74 +<h2>Accompanying the Studies</h2>
   14.75 +<ul>
   14.76 +<li><h4>Bachelor Thesis, Comsoft GmbH, 10/2009-04/2010</h4>
   14.77 +"Flexible Modeling of Dynamic Air Space Constraints and its Application in Departure Flow Optimisation"  
   14.78 +<div class="download"><a href="http://me73.com/downloads/campus_magazin_29.pdf">
   14.79 +Campus Mag (P. 36 / German)</a></div>
   14.80 +<div class="download"><a href="http://me73.com/downloads/discover_me_24.pdf">
   14.81 +Discover ME (P. 22 / German)</a></div>
   14.82 +</li>
   14.83 +<li><h4>University Project, University of Applied Sciences Offenburg &amp; Karlsruhe Institute of Technology, 2008</h4>
   14.84 +Development of a client for 3D data streaming and visualisation. 
   14.85 +</li>
   14.86 +</ul>
   14.87 +
   14.88 +
   14.89 +
   14.90 +        </div>
   14.91 +        <div id="sidebar">
   14.92 +          <p>
   14.93 +	    <img src="images/me2.png" alt="me" class="float-left" height="70" width="70" />
   14.94 +            <br />I'm a programmer,<br />
   14.95 +            a student of computer science,<br />
   14.96 +            a music enthusiast.<br />
   14.97 +            This is my site.
   14.98 +          </p>
   14.99 +          <div id="random_quote"></div>
  14.100 +        </div>
  14.101 +      </div>
  14.102 +      <div id="footer">
  14.103 +        <div id="footer-left">
  14.104 +          <p>
  14.105 +            <a href="mailto:sawine@me73.com">
  14.106 +	      Eugen Sawin<br/>Software Enginnering &amp; Research</a>
  14.107 +          </p>
  14.108 +        </div>
  14.109 +        <div id="footer-right">
  14.110 +          <p class="align-right">
  14.111 +            <a href="index.html">Home</a> | <a href="#top">Top</a>
  14.112 +          </p>
  14.113 +        </div>
  14.114 +      </div>
  14.115 +    </div>
  14.116 +    <script type="application/javascript">
  14.117 +      javascript:load_random_quote();
  14.118 +    </script>
  14.119 +  </body>
  14.120 +</html>
  14.121 +
    15.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
    15.2 +++ b/style.css	Sun Dec 18 03:44:26 2011 +0100
    15.3 @@ -0,0 +1,290 @@
    15.4 +* {
    15.5 +    margin: 0;
    15.6 +    padding: 0;
    15.7 +    border: 0;
    15.8 +}
    15.9 +
   15.10 +ul, ol {
   15.11 +    list-style-type: none;
   15.12 +}
   15.13 +
   15.14 +body {
   15.15 +    background:	#fafafa;
   15.16 +    font: sans-serif;
   15.17 +    margin: 30px 80px;
   15.18 +    color: #333;
   15.19 +    text-align: center;
   15.20 +}
   15.21 +
   15.22 +#container {
   15.23 +    margin-left: auto;
   15.24 +    margin-right: auto;
   15.25 +    width: 1000px;
   15.26 +    text-align: left;
   15.27 +}
   15.28 +
   15.29 +.red {
   15.30 +    /*color: #b22;*/
   15.31 +    color: #aaa;
   15.32 +}
   15.33 +
   15.34 +.permred {
   15.35 +    color: #d22;
   15.36 +}
   15.37 +
   15.38 +a {
   15.39 +    text-decoration: none;
   15.40 +    color: #777;
   15.41 +}
   15.42 +
   15.43 +p {
   15.44 +    padding-bottom: 10px;
   15.45 +}
   15.46 +
   15.47 +a:hover {
   15.48 +    color: #333;
   15.49 +}
   15.50 +
   15.51 +span.link {
   15.52 +    border-bottom: dashed 1px #aaa; 
   15.53 +    position: relative; 
   15.54 +    color: #777;
   15.55 +}
   15.56 +
   15.57 +.menu > span.link {
   15.58 +    border-bottom: 0;
   15.59 +    font-size: 60px;
   15.60 +    font-weight: bold;
   15.61 +    letter-spacing: 0.2px;
   15.62 +    line-height: 80%;
   15.63 +    text-transform: uppercase;
   15.64 +    color: #333;	
   15.65 +}
   15.66 +
   15.67 +span.missinglink {
   15.68 +    border-bottom: dashed 1px #aaa;
   15.69 +    position: relative:
   15.70 +    color: #aaa;
   15.71 +    text-decoration: line-through;
   15.72 +}
   15.73 +
   15.74 +h3 {
   15.75 +
   15.76 +    padding-bottom: 5px;
   15.77 +    font-weight: bold;
   15.78 +    text-transform: uppercase;
   15.79 +}
   15.80 +
   15.81 +.menu > a {
   15.82 +    font-size: 60px;
   15.83 +    font-weight: bold;
   15.84 +    letter-spacing: 0.2px;
   15.85 +    line-height: 80%;
   15.86 +    text-transform: uppercase;
   15.87 +    color: #bbb;	
   15.88 +}
   15.89 +
   15.90 +.menu > a:hover {
   15.91 +    color: #333;
   15.92 +}
   15.93 +
   15.94 +a > span {
   15.95 +    display: none;
   15.96 +}
   15.97 +
   15.98 +a:hover > span {
   15.99 +    display: inline;
  15.100 +    color: red;
  15.101 +    font-weight: bold;
  15.102 +}
  15.103 +
  15.104 +.container2 {
  15.105 +    position: fixed;
  15.106 +    top: 30px;
  15.107 +    height: 100px;
  15.108 +    width: 400px;
  15.109 +    left: 50%;
  15.110 +}
  15.111 +
  15.112 +.menu > a .container2 .content {
  15.113 +    display: none;
  15.114 +    font: 12px/15px sans-serif;	
  15.115 +    color: #555;
  15.116 +    position: absolute;
  15.117 +    height: 400px;
  15.118 +    width: 400px;
  15.119 +    text-transform: none;	
  15.120 +    z-index: 100;
  15.121 +    background: #fafafa;
  15.122 +    
  15.123 +}
  15.124 +
  15.125 +.menu > a:hover .container2 .content {
  15.126 +    display: block;	
  15.127 +}
  15.128 +
  15.129 +body > #container > .content {
  15.130 +    font: 12px/15px sans-serif;	
  15.131 +    width: 400px;
  15.132 +    height: 400px;
  15.133 +    color: #555;
  15.134 +    position: absolute;
  15.135 +    margin-left: auto;
  15.136 +    margin-right: auto;
  15.137 +    text-transform: none;
  15.138 +    z-index: 1;
  15.139 +}
  15.140 +
  15.141 +.content a { 
  15.142 +    border-bottom: dashed 1px red; 
  15.143 +    position: relative; 
  15.144 +}
  15.145 +
  15.146 +.content a:hover { 
  15.147 +    border-bottom: 0; 
  15.148 +}
  15.149 +
  15.150 +.content .entry {
  15.151 +    padding-bottom: 20px;
  15.152 +    width: 400px;
  15.153 +}
  15.154 +
  15.155 +.content .entry .details {
  15.156 +    display: none;
  15.157 +    font: 12px/15px sans-serif;	
  15.158 +    width: 400px;
  15.159 +    height: 400px;
  15.160 +    color: #333;
  15.161 +    position: absolute;
  15.162 +    margin-left: 500px;
  15.163 +    margin-right: auto;
  15.164 +    top: 0;
  15.165 +    text-transform: none;
  15.166 +    background: #fafafa;
  15.167 +}
  15.168 +
  15.169 +.content .entry:hover .details {
  15.170 +    display: block;
  15.171 +}
  15.172 +
  15.173 +.content .entry:hover .red {
  15.174 +    color: #d22;
  15.175 +}
  15.176 +
  15.177 +
  15.178 +div.universe1 {
  15.179 +    background: #fafafa;
  15.180 +    position: absolute;
  15.181 +    width: 50%;
  15.182 +    height: 50%;
  15.183 +    left: 0;
  15.184 +    top: 0;
  15.185 +    color: #fff;
  15.186 +}
  15.187 +
  15.188 +div.universe1:hover {
  15.189 +}
  15.190 +
  15.191 +div.universe2 {
  15.192 +    background: #fafafa;
  15.193 +    position: fixed;
  15.194 +    margin: 30px 80px;
  15.195 +    left: 50%;
  15.196 +    width: 50%;
  15.197 +    height: 50%;
  15.198 +    top: 0;
  15.199 +    font-size: 60px;
  15.200 +    font-weight: bold;
  15.201 +    letter-spacing: 0.2px;
  15.202 +    line-height: 80%;
  15.203 +    text-align: left;
  15.204 +    color: #fff;
  15.205 +}
  15.206 +
  15.207 +div.universe2:hover {
  15.208 +}
  15.209 +
  15.210 +
  15.211 +div.universe3 {
  15.212 +    background: #fafafa;
  15.213 +    position: absolute;
  15.214 +    width: 50%;
  15.215 +    height: 50%;
  15.216 +    left: 0;
  15.217 +    top: 50%;
  15.218 +    text-transform: uppercase;
  15.219 +    text-align: center;
  15.220 +    color: #fafafa;
  15.221 +}
  15.222 +
  15.223 +  /*div.universe3:hover
  15.224 +    {
  15.225 +    background: #eee;
  15.226 +    color: #aaa;
  15.227 +    }*/
  15.228 +
  15.229 +
  15.230 +div.universe4 {
  15.231 +    background: #fafafa;
  15.232 +    position: absolute;
  15.233 +    width: 50%;
  15.234 +    height: 50%;
  15.235 +    left: 50%;
  15.236 +    top: 50%;
  15.237 +    text-transform: uppercase;
  15.238 +    text-align: center;
  15.239 +    color: #fafafa;
  15.240 +}
  15.241 +
  15.242 +  /*div.universe4:hover
  15.243 +    {
  15.244 +    background: #eee;
  15.245 +    color: #aaa;
  15.246 +    }*/
  15.247 +
  15.248 +div.menu {
  15.249 +    position: absolute;
  15.250 +    bottom: 150px;
  15.251 +    
  15.252 +}
  15.253 +
  15.254 +#menu1 {	
  15.255 +    width: 400px;
  15.256 +}
  15.257 +
  15.258 +#menu2 {
  15.259 +    margin-left: 500px;
  15.260 +    margin-right: auto;
  15.261 +    width: 400px;
  15.262 +}
  15.263 +
  15.264 +#info {
  15.265 +    position: absolute;
  15.266 +    bottom: 30px;
  15.267 +    width: 400px;
  15.268 +    color: #aaa;
  15.269 +}
  15.270 +
  15.271 +#info:hover {
  15.272 +    color: #333;
  15.273 +}
  15.274 +
  15.275 +#info li.name {
  15.276 +    font-weight: bold;
  15.277 +}
  15.278 +
  15.279 +#info li.misc {
  15.280 +    font-weight: normal;
  15.281 +}
  15.282 +
  15.283 +#container #copy {
  15.284 +    position: absolute;
  15.285 +    width: 1000px;
  15.286 +    bottom: 30px;
  15.287 +    color: #aaa;
  15.288 +    text-align: right;
  15.289 +}
  15.290 +
  15.291 +#copy:hover {
  15.292 +    color: #333;
  15.293 +}