/*
 * The Pinguine "Learn to Program" Project
 *
 * (o_   Project.........: Pinguine
 * //\   Filename........: style.css
 * V_/_  Notes...........: Style definitions for bellcom.dk
 *
 * LICENSE
 *
 * You are granted the right to use and/or redistribute this
 * code only if this licence and the copyright notice are included
 * and you accept that no warranty of any kind is made or implied
 * by the author(s) of The Pinguine "Learn to Program" Project.
 *
 * Copyright (c) 2007 Bellcom Open Source ApS
 * http://www.bellcom.dk
 *
 * TODO: Fix focus on active links!
 */
	
/* Top elements */
* {
  padding: 0;
  margin: 0;
}

body {
  margin: 0;
  padding: 0;
  font: normal .72em/1.5em 'Trebuchet MS', sans-serif;
  color: #333;
  background: #FFF url('../images/bg.jpg') repeat-x;
  text-align: center;	
}


/* Links */
a {
  background: inherit;
  color: #74A8F5;
  outline: none;
}

a:visited {
  background: inherit;
  color: #74A8F5;
  outline: none;
}

a:hover {
  background: inherit;
  color: #FB9622;
  outline: none;
}


/* Headers */
h1, h2, h3 {
  font: bold 1em 'Trebuchet MS', Tahoma, Sans-serif;
  color: #85C329;
}

  h1 { font-size: 1.4em; }
  h2 { font-size: 1.2em; text-transform: uppercase;}
  h3 { font-size: 1.2em; }
  
  p, h1, h2, h3 {
    margin: 10px 15px;
  }
  
ul, ol {
  margin: 10px 30px;
  padding: 0 15px;	
/*  color: #85C329; */
 /* color: #74A8F5; */
 color: #000000;	
}

  ul span, ol span {
    color: #85C329;
  }


/* Images */
img {
  /*border: 2px solid #CCC;*/
}

  img.float-right {
    margin: 5px 0px 5px 15px;
	border: none;
  }
  
  img.float-left {
    margin: 5px 10px 5px 5px;
    padding: 5px;
  }
  
  a img {  
	border: none;
  }
  
code {
  margin: 5px 0;
  padding: 10px;
  text-align: left;
  display: block;
  overflow: auto;  
  font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace;
  /* white-space: pre; */
  background: #FFF;
  border: 1px solid #f2f2f2;  
  border-left: 3px solid #74A8F5;
}

acronym {
  cursor: help;
  border-bottom: 1px solid #777;
}

blockquote {
/*  margin: 15px;
  padding: 0 0 0 20px;  	
  background-color: #fff; 
  background-position: 8px 10px;
  border: 1px solid #f2f2f2; 
  border-left: 3px solid #006699;  
  font: oblique 12px "Trebuchet MS", Tahoma, sans-serif; 
  color: #666666;*/	
  margin: 15px;
  padding: 0 5px 0 20px;
  text-align: left;
  display: block;
  overflow: auto;
  font: oblique 11px "Trebuchet MS", Tahoma, sans-serif;
  /* white-space: pre; */
  background: #FFF;
  border: 1px solid #f2f2f2;  
  border-left: 3px solid #74A8F5;
}


/* Form elements */
form {
  margin:10px;
  padding: 0;
  /*border: 1px solid #f2f2f2;*/
}

  label {
    display: block;
    font-weight: bold;
    margin: 5px 0;
  }
  
  input {
    padding: 2px;
    border: 1px solid #eee;
    font: normal 1em "Trebuchet MS", Tahoma, sans-serif;
    color: #777;
  }
  
  textarea {
    width: 400px;
    padding: 2px;
    font: normal 1em "Trebuchet MS", Tahoma, sans-serif;
    border: 1px solid #eee;
    height: 100px;
    display: block;
    color: #777;
  }
 
  .input.button {
    background: #FFFFFF none repeat scroll 0%;
    border: 1px solid #CCCCCC;
    color: #333333;
    font-family: Arial,Sans-serif;
    font-size: 1em;
    line-height: normal;
    margin: 0;
    padding: 2px 3px;
  }


/* Search form */
.searchform {
  background-color: transparent;
  border: medium none;
  margin: 0;
  padding: 0;
}
  .searchform p {
    margin: 10px;
    padding: 0;
  }

  .searchform input.textbox {
    color: #333333;
    height: 20px;
    padding: 2px;
    vertical-align: top;
    width: 130px;
  }

  .searchform input.button {
    border: medium none;
    color: #333333;
    font-family: Arial,Sans-serif;
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: bold;
    height: 26px;
    line-height: normal;
    padding: 3px 5px;
    vertical-align: top;
    width: 60px;
    outline: none;
  } 


/**
 * Layout
 */

#header-content, #content, #footer-content {
	width: 760px;
}

/* Header */
#header {
  height: 100px;
  text-align: left;	
}

  #header-content {
    position: relative;
    margin: 0 auto;
    padding: 0;
  }
  
  #header-content #logo {
    position: absolute;	
    font: bold 4em 'Trebuchet Ms', Sans-serif;
    letter-spacing: -2px; 
    color: #FFF;
    margin: 0;
    padding: 0;
	top: 15px;
    left: 0px;
  }
  
  #header-content #slogan {
    position: absolute;	
    font: bold 1.0em 'Trebuchet Ms', Sans-serif;
    text-transform: none;
    color: #FFF;	
    margin: 0;
    padding: 0;
	top: 60px;
    left: 5px;
  }
  
  /* Header menu */
  #header-content ul {
    position: absolute;
    right: -16px;
    .top: 68px; /* internet explorer needs this */
    top: 71px;
    font: bolder 1.2em 'Trebuchet Ms', Sans-serif;
    color: #FFF;
    list-style: none;
    margin: 0;
    padding: 0;
  }

  #header-content li {
    display: inline;
  }
  
  #header-content li a {
    float: left;
    display: block;
    padding: 3px 12px;
    color: #FFF;
    background-color: #333;
    text-decoration: none;
    border-right: 1px solid #272727;
  }
  
  #header-content li a:hover {
    /*background: #74A8F5;*/
    background: #FB9622;
    color: #FFF;
  }
  
  #header-content li a#current  {
    background: #85C329;
    color: #FFF;
  }
  
  /* Header image */
  .headerimage {
    margin: 0 auto;
    width: 770px;
    height: 230px;
   _height: 250px;
    padding: 15px 10px 10px 10px; 
    background: #FFF url('../images/forest.jpg-bak') no-repeat center;	
  }
  

/* Content */
#content-wrap {
  clear: both;
  float: left;
  width: 100%;
}

  #content {
    text-align: left;
    padding: 0;
    margin: 0 auto;	
  }


/* Sidebar */
#sidebar {
  float: right;
  width: 30%;
  margin: 0 0 10px 0;
  padding: 0;
}

  #sidebar h1 {
    padding: 10px 0px 5px 10px;
    margin: 0;
    color: #fff;
  }
  
  #sidebar p {
    color: #fff;
  }
 
#sidebar a, #sidebar a:visited {
  color: #fff;
}

.sidebox {
  /*background: #F2F2F2;*/
  background: #85C329;
  /*border: 1px solid #EFEDED;*/
  margin-bottom: 10px;
}


/* Sidebar menu */
#sidebar ul.sidemenu {
  list-style: none;
  margin: 10px 0;
  padding: 0;
  background: #74A8F5;
}
  
  #sidebar ul.sidemenu li {
    padding: 0px 10px;
  }
    
  #sidebar ul.sidemenu a {
    display: block;
    font-weight: normal;
    color: #fff;
    height: 1.5em;
    padding: .3em 0 .3em 15px;
    line-height: 1.5em;
    text-decoration: none;
  }
    

/* Main */
#main {
  float: left;
  width: 68%;	
  margin: 0 0 10px 0;
  padding: 0;
}

#main h1 {
  padding: 10px 0 5px 5px;
  margin: 0 0 0 10px;
}

.post {
  margin: 0;
  padding: 0;
  background: #fff repeat-x;
}

  .post .post-footer {
    background-color: #FFF;
    padding: 0 0 10px 0;
    font-size: 95%;
  }
    .post .post-footer .date {
      background: url('../images/clock.gif') no-repeat 0 center;
      padding-left: 20px;
      margin: 0 10px 0 5px;
    }
   
    .post .post-footer .write {
      background: url('../images/comment.gif') no-repeat 0 center;
      padding-left: 20px;
      margin: 0 10px 0 5px;
    }
    
    .post .post-footer .read {
      background: url('../images/page.gif') no-repeat 0 center;
      padding-left: 20px;
      margin: 0 10px 0 5px;
    }


/* Footer */
#footer {
  clear: both;
  margin: 0; padding: 0;
  font: normal .95em/1.5em 'Trebuchet MS', Tahoma, Arial, sans-serif;
  text-align: left;	
}

  #footer h3, #footer p {
    margin-left: 0;
    color: #777777;
  }
  
#footer-content {
  border-top: 1px solid #EAEAEA;
  margin: 0 auto;
  padding-left: 15px;
}
 
  #footer-content ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  #footer-content .col {
    width: 65%;
    padding: 0 0 30px 0;	
  }
  
  #footer-content .col2 {
    width: 30%;
    padding: 0 5px 30px 0;
  }

/* Alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right {	text-align: right; }

/* Additional classes */
.clear { clear: both; }
.gray  { color: #BFBFBF; }
.hidden { display: none; }
.border { border-bottom: 1px solid #C1C1C1; }
.no-border { border: 0 none; }


/* Round corners */
.rtop, .rbottom {
  display:block;
}

.rtop *, .rbottom * {
  display: block;
  height: 1px;
  overflow: hidden;
}

.r1 { margin: 0 5px; }
.r2 { margin: 0 3px; }
.r3 { margin: 0 2px; }
.r4 {
  margin: 0 1px;
  height: 2px;
}

.rs1 { margin: 0 2px; }
.rs2 { margin: 0 1px; }

div#sidebar_references {
  margin-top: 20px;
}

/* try to avoid comment spam */
.trick {
  display:none;
}