/*  
Theme Name: Semantic i76
Theme URI: http://www.i76.nl/weblog/
Description: The i76 theme (Semantic Edition)
Version: 0.1
Author: Tom-Eric Gerritsen
Author URI: http://tom-eric.info/

General comments here!
*/
@import '/wp-content/themes/semantic-i76/css/jquery.lightbox.css';

html { 
  background: #676767;
  font: 11px Verdana, serif;
  padding: 0;  
}

body {
  background: url(images/body-background.jpg) repeat-y;
  margin: 20px auto;
  padding: 0;
  width: 655px;
}

a { color:#001166; }
a:hover { color:#0000FF; }

#header {
  background: url(images/header-top.png) no-repeat;
  margin: 0;
  padding: 0;
  padding-top: 10px;
}

#header a {
  display: block;
  background: url(images/header.png) no-repeat;
  height: 117px;
}

#header a img {
  border: 0;
  display: block;
  text-decoration: none;
  padding: 15px 40px;
}

#aside {
  margin: 0;
  height: 370px;
  margin-left: 5px;
  padding: 0;
  width: 171px;
}

#aside h2 {
  margin: 0;
  background: #646464;
  border-right: 1px solid #444;
  font-weight: normal;
  color: #d2d4ca;
  font-size: 10px;
  line-height: 30px;
  padding: 0 0 0 10px;
}

#aside ul {
  list-style: none;
  margin: 0;
  margin-left: 2px;
  padding: 0;
  border-bottom: 1px solid #d2d4ca;
}

#aside li {
  border-top: 1px solid #d2d4ca;
}

#aside li a {
  display: block;
  background: #b8b8b8;
  color: #444;
  font-weight: bold;
  text-decoration: none;
  padding: 3px 0 3px 10px;
}

#aside li a:hover {
  background: #d2d4ca;
  color: #fff;
}

#content {
  margin-top: -350px;
  margin-bottom: -100px;
  margin-right: 8px;
  width: 452px;
  padding: 10px;
  padding-top: 0;
  float: right;
}

#content h2 {
  font: bold 14pt 'Trebuchet MS', Tahoma, sans-serif;
  letter-spacing: 1pt;
  color: #ff6f05;
  clear: both;
}

#content h3 {
  color: #003d82;
  color: #ff6f05;
  font: normal 14pt 'Trebuchet MS', Tahoma, sans-serif;
  clear: both;
}

#content h4 {
  font-size: 12px;
  margin: 5px 0;
}

#content h2 a, #content h3 a {
  color: #003d82;
  text-decoration: none;
}

#content h2 a:hover, #content h3 a:hover {
  text-decoration: underline;
}

#content h2#subtitle {
  margin: -20px -10px 10px -10px;
  font-weight: normal;
  line-height: 24px;
  background: #646464;
  color: white;
  letter-spacing: 0;
  padding: 0 0 5px 10px; 
  border-bottom: 1px solid #444;
}

#content pre {
  overflow: auto;
  background: #eee;
  border: 1px solid #aaa;
  padding: 3px;
  width: 95%;;
}

#content pre:hover {
  position: relative;
  margin-left: -155px;
  width: auto;
}

#new {
  float: right;
  width: 200px;
  padding: 5px;
  background: #eee;
  margin: 10px 0 0 10px;
}

#new h3 {
  margin: 0;
  margin-bottom: 3px;
  color: #000;
  font-size: 12px;
  line-height: 14px;
}

#new ul {
  list-style: square;
  margin: 0;
  padding: 0;
  padding-left: 5px;
}

#new li {
  margin: 0;
  padding: 0;
  margin-left: 5px;
}

#new li a {
  font-size: 9px;
  line-height: 16px;
}

#address {
  clear: both;
  font-style: normal;
  margin-left: 5px;
  padding: 0 8px;
  width: 150px;
  height: 85px;
  color: #ffea71;
  font-weight: bold;
}

#address a {
  color: #ffea71;
}

#address abbr, #address .abbr {
  background: url(images/bullet.png) no-repeat left center;
  padding-left: 13px;
  font-weight: normal;
  width: 50px;
  clear: left;
  display: block;
  margin-bottom: 5px;
  float: left;
  color: #ffd707;
}

#address strong {
  color: #ffd707;
  display: block;
  margin-bottom: 2px;
}

#address br {
  clear: both;
}

#copyright {
  clear: both;
  background: url(images/bottom.png) bottom left no-repeat;
  height: 25px;
  padding-top: 30px;
  text-align: center;
  color: #999;
}

#copyright a {
  color: #aaa;
}

#copyright a:hover {
  color: #fff;
}

.our-address {
  font-style: normal;
}

* > .our-address {
  line-height: 16px;
  margin: 15px;
  padding: 0;
  padding-left: 40%;
  width: 65%;
}

* > .our-address strong {
  display: block;
  margin-left: -25%;
}

* > .our-address abbr, * > .our-address em {
  display: block;
  float: left;
  clear: both;
  margin-left: -40%;
  font-style: normal;
  color: #ffd707;
  text-align: left;
  width: 40%;
  color: gray;
  letter-spacing: 5px;
}

* > .our-address br {
  display: block;
  margin-bottom: 10px;
  clear: right;
}

.profile-picture, .profile-picture-right {
  float: left;
  clear: left;
  margin: 3px;
}

.profile-picture-right {
  float: right;
  clear: right;
}

.metadata { 
  background: #eee;
  color: #666;
  border: 1px solid #aaa;
  margin: 5px 3px;
  padding: 4px;
}

#comment-list .author {
  font-weight: bold;
  margin: 0;
  margin-bottom: 5px;
}

#comment-list .metadata {
  background: #ddd;
  border: 0;
  font-size: 10px;
  text-align: right;
  margin: 0;
  margin-top: 5px;
}

#comment-list {
  margin: 20px 0;
  padding: 0;
  list-style: none;
}

#comment-list li {
  background: #ddd;
  margin: 5px;
  padding: 5px;
}

.date {
  color: #666;
  font-size: 10px;
  margin-top: 0;
  text-align: right;
}

.portfolio {
  clear: both;
  border-bottom: 1px solid #aaa;
}

.portfolio h3 {
  font-size: 16px;
}

.portfolio h3 img {
  float: right;
  display: block;
  margin-left: 3px;
  margin-bottom: 3px;
  background: #fff;
  padding: 1px;
  border: 1px solid #aaa;
}

.portfolio .link {
  font-weight: bold;
  font-size: 10px;
  color: #666;
}

.portfolio p {
  margin-top: 0;
  margin-bottom: 5px;
}

address.real, address.online {
  background: #eee;
  margin: 5px;
  padding: 5px;
  border: 1px solid #aaa;
  font-style: normal;
}

ins { text-decoration: none; margin: 5px 0; padding: 5px 2px; background: #d3ffd3; display: block; }

dl.images dt { font-weight: bold; text-align: center; padding: 5px; }
dl.images dd { text-align: center; margin-bottom: 10px; padding: 3px; }
dl.images dd.description { text-align: left; font-style: italic; margin-top: -5px; }
dl.images a img { border: 2px solid #aaa; padding: 3px; background: #fff; }
dl.images a:hover img { border-color: #f50; }