/**
 * 2009 (c) Jacek Jedrzejwski
 * All rights reserved 
 */  

/* CSS RESET */
body { color: black; background: white; }
a {color: black; text-decoration: none;}
body, div, dl, dt, dd, li, pre,
form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, td { margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
address, caption, cite, code, dfn, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; } 
caption, th { text-align: left; font-weight: normal; font-style: normal; }
acronym, abbr, fieldset, img { border: 0;}
:focus { outline: 0; }

body {background:#2b2b2b url(bg.gif); font-family: 'Lucida Sans Unicode', 'Lucida Grande', Arial, Tahoma, sans-serif; font-size: 1em; line-height: 1.1em; color: #000000;}

div#wrap {width: 500px; margin: 150px auto 0 auto; position: relative;}
div#wrap h1 {width: 409px; height: 49px; background-repeat: no-repeat; background-image: url(name.png); }
div#wrap h1 a {width: 409px; height: 49px;display: block;}
div#wrap h1 span {display: none;}
div#wrap ul.navi {float: left; display: none; width: 100px;margin-left: -100px;margin-top: -4px;}
div#wrap ul.navi li {width: 97px; margin: 1px 0 3px 0; background: #dddddd;  font-size: 0.9em; line-height: 2em; }
div#wrap ul.navi li.active {width: 100px; margin-right: 0; background: #eeeeee;}
div#wrap ul.navi li.active a {color: #333333}
div#wrap ul.navi li a {width: 90px; display: block; text-align: right; color: #777777; }
div#wrap ul.navi li a:hover { color: #000000; }
div#container {width: 500px;float: right; position: relative; margin-top: -5px; border-top: 2px solid #2b2b2b; background: #eeeeee; height: 250px; }
div#footer {}
div#footer p{text-align: center; font-size: 0.8em; color: #555555}

#contact {width: 500px; position: relative; height: 250px;}
#contact img.photo {display: block; position: absolute; right: 10px; top: 10px; border: 4px solid #cccccc;}
#contact ul {display: block; position: absolute; font-size: 0.9em; }
#contact ul.base {right: 130px; top: 20px;  }
#contact ul li {text-align: right;}
#contact ul li img {vertical-align: middle;}
#contact ul.base li strong {font-size: 1.1em;color: #b50000;}
#contact ul li small {font-size: 0.8em; color: #777777;}
#contact ul.im, #contact ul.im2 {bottom: 20px; font-size: 0.8em;}
#contact ul.im {left: 30px;}
#contact ul.im li {text-align: left;}
#contact ul.im2 {right: 30px;}
#contact p  {position: absolute; top: 140px; text-align: center; left: 0; width: 500px;}
#contact p small {color: #888888; font-weight: bold;}

#contact hr {position: absolute; top: 120px; left: 10px; width: 480px; height: 2px; color: #b50000; background: #b50000; border: none;}

#web {display: none}
#stuff {display: none}
#lastfm {display: none}
#twitter {display: none}
#blog {display: none}

#blog ul {margin: 5px;}
#blog ul li {margin: 3px 0; background: #e5e5e5; white-space: nowrap; overflow: hidden;}
#blog ul li a {color: #555555; font-size: 0.8em; display: block; padding: 0 110px 0 5px; white-space: nowrap; position: relative; line-height: 1.4em;}
#blog ul li a:hover {color: #000000;}
#blog ul li a small {font-size: 0.6em; color: #888888; position: absolute; right: 4px; top: 0; padding-left: 6px;background: #e5e5e5}

#twitter div {height: 205px; overflow: hidden; position: relative;}
#twitter div span.shadow {display: block; position: absolute; bottom: 0; left: 0; right: 0; height: 10px; z-index: 10; background: url(hideshadow.png) repeat-x 0 0;}
#twitter ul {margin: 5px; font-size: 0.8em; }
#twitter ul li {margin: 5px 0; padding-left: 5px; color: #555555; border-left: 3px solid #666666}
#twitter ul li:hover {background: #e5e5e5}
#twitter a {color: #b50000;}
#twitter a:hover {color: #ff3636;}
#twitter h3 {margin: 20px; text-align: center; color: #b50000; font-weight: bold;}

#web {height: 250px; }
#web div.left {width: 225px;float: left;}
#web div.right {width: 225px; float: left;}
#web div div{width: 200px;margin: 10px;}
#web div div h3 {font-weight: bold; display: -moz-inline-block; display: inline-block; padding: 1px; border-bottom: 1px solid #bbbbbb; font-size: 0.9em;}
#web div div ul {font-size: 0.8em; margin-top: 3px;}
#web div div ul li {}
#web div div ul li a {color: #666666}
#web div div ul li a:hover {color: #999999}
#web div div.websites {}
#web div div.profiles {}
#web div div.projects {}
#web div div.links {}

#stuff ul.whatpulse li {font-size: 0.8em; line-height: 1.4em;}
#stuff ul.whatpulse li small {font-size: 0.8em;height: 1.4em; text-align: right; color: #777777; display: -moz-inline-block; display: inline-block; width: 60px; white-space: nowrap; overflow: hidden; }

#lastfm ul {margin: 5px;}
#lastfm ul li {margin: 3px 0; background: #e5e5e5; white-space: nowrap; overflow: hidden;}
#lastfm ul li a {color: #555555; font-size: 0.8em; display: block; padding: 0 110px 0 5px; white-space: nowrap; position: relative; line-height: 1.4em;}
#lastfm ul li a:hover {color: #000000;}
#lastfm ul li a small {font-size: 0.6em; color: #888888; position: absolute; right: 4px; top: 0; padding-left: 6px;background: #e5e5e5}
div#container div.updates p {margin: 5px; height: 25px; overflow: hidden;}
div#container div.updates p a {color: #b50000; float: right;  background: #ffffff;padding: 3px 5px;}
div#container div.updates p strong {float: left;padding: 3px;}
div#container div.updates p a:hover {color: #ff3636;}
div#container div.updates h3 {margin: 20px; text-align: center; color: #b50000; font-weight: bold;}