/*  
Theme Name: Pieels
Theme URI: http://wordpress.org/
Description: Pieels theme
Author: Pieter Bekaert
Author URI: http://www.pieels.Be

   Pieels v1.0
    http://www.pieels.be

   This theme was designed and built by Pieter Bekaert
   whose blog you will find at http://www.pieels.be

   The CSS, XHTML and design is released under GPL:
   http://www.opensource.org/licenses/gpl-license.php

*/


/*
----------------------------------------------------------------
 Main structure
 --------------
 - page size
 - heading/content/sidebar size and organization
 - paddings and margins for these
 - background
 - border
----------------------------------------------------------------
*/

body { 
   text-align: center;
   margin: 0 0 20px 0; 
   padding: 0; 
   background: white;
   }

#page {
   width:700px;
   margin: 0 auto;
   padding: 0px;

   background-color: white;

   border: 1px solid #000000;
   }

#header {
   height: 230px;
   margin: 0 0 0 0px; 
   padding: 0; 
   background-color: #73a0c5;
   }

/*
-----------------------------------------------------------------
 Navigation
-----------------------------------------------------------------
*/

#header { position:relative; }
#mainmenurow { position:absolute; bottom:0px; width:100%} 
#mainmenurow ul { margin: 0; padding: 0; z-index:3;position:relative; top:1px;
   list-style-type: none; list-style-image: none; text-align: center; font-size: 9pt}
#mainmenurow li { display: inline; }
#mainmenurow a {text-decoration:none;
   background-color:#2f81b1;
   color:#ffffff;
   padding-top:0px;
   padding-bottom:0px;
   padding-left: 10px;
   padding-right: 10px;
   border-top-width:1px;
   border-left-width:1px;
   border-right-width:1px;
   border-bottom-width:0px;
   border-style:solid;
   border-color:#FED1A7;
   white-space: nowrap;
}
#mainmenurow li.current_page_item a, #mainmenurow li.current_page_parent a { color: #FED1A7; background-color: #1F4C8F;}
#mainmenurow a:hover {   background-color:#1F4C8F;
   color:#FED1A7; }
#horizontalmenuruler { position:relative; z-index:2;
   height:10px; 
   font-size:10px;
   background-color: #1F4C8F; 
   border-top-width:1px;
   border-left-width:0px;
   border-right-width:0px;
   border-bottom-width:2px;
   border-style:solid;
   border-top-color:#FED1A7;
   border-bottom-color:#2f81b1;
}


#submenurow ul {margin: 5px; padding: 0; 
   list-style-type: none; list-style-image: none; text-align: center; font-size: 9pt}
#submenurow li {display: inline; }
#submenurow a {text-decoration:none;
   background-color: #FFFFFF;
   color:#000000;
   padding-top:0px;
   padding-bottom:0px;
   padding-left: 10px;
   padding-right: 10px;
   border-top-width:1px;
   border-left-width:1px;
   border-right-width:1px;
   border-bottom-width:1px;
   border-style:solid;
   border-top-color:#2f81b1;
   border-bottom-color:#2f81b1;
   border-left-color:#2f81b1;
   border-right-color:#2f81b1;
   white-space: nowrap;
}
#submenurow li.current_page_item a, #submenurow li.current_page_parent a { 
color: #FED1A7; background-color: #2f81b1;}
#submenurow a:hover {   background-color:#1F4C8F;
   color:#FED1A7; }

#sub2menurow ul {margin: 15px; padding: 0; 
   list-style-type: none; list-style-image: none; text-align: center; font-size: 9pt; line-height:20pt}
#sub2menurow li {display: inline; }
#sub2menurow a {text-decoration:none;
   background-color: #FFFFFF;
   color:#000000;
   padding-top:0px;
   padding-bottom:0px;
   padding-left: 10px;
   padding-right: 10px;
   border-top-width:1px;
   border-left-width:0px;
   border-right-width:0px;
   border-bottom-width:1px;
   border-style:dashed;
   border-top-color:#2f81b1;
   border-bottom-color:#2f81b1;
   border-left-color:#2f81b1;
   border-right-color:#2f81b1;
   white-space: nowrap;
}
#sub2menurow li.current_page_item a, #sub2menurow li.current_page_parent a, #sub2menurow a:hover { 
   border-style:solid;
   border-top-width:2px;
   border-bottom-width:2px;
   }

#sub3menurow ul {margin: 15px; padding: 0; 
   list-style-type: none; list-style-image: none; text-align: left; font-size: 9pt}
#sub3menurow li {display: inline; }
#sub3menurow a {text-decoration:none;
   background-color: #FFFFFF;
   color:#000000;
   padding-top:0px;
   padding-bottom:0px;
   padding-left: 10px;
   padding-right: 10px;
   border-top-width:1px;
   border-left-width:0px;
   border-right-width:0px;
   border-bottom-width:1px;
   border-style:dashed;
   border-top-color:#2f81b1;
   border-bottom-color:#2f81b1;
   border-left-color:#2f81b1;
   border-right-color:#2f81b1;
   white-space: nowrap;
}
#sub3menurow li.current_page_item a, #sub3menurow li.current_page_parent a, #sub3menurow a:hover { 
   border-style:solid;
   border-top-width:2px;
   border-bottom-width:2px;
   }

/*
-----------------------------------------------------------------
 Content layout
-----------------------------------------------------------------
*/

body {
   font-family: "Trebuchet MS",'Lucida Grande', Verdana, Arial, Sans-Serif;
   }

#page {
   text-align: left;
   }

#content {
   font-size: 12pt;
   line-height = 1.3em;
   }

.narrowcolumn, .widecolumn {
   padding: 20px 0 20px 0px;
   margin: 0px 40px 0px; 30px;
   width: 600px;
   }

small {
   font-size: 0.9em;
   line-height: 1.5em;
   color: #777;
   }

/*
-----------------------------------------------------------------
 Headings
-----------------------------------------------------------------
*/

h1, h2, h3 {
   font-weight: bold;
   }

div#content h1 {
   font-size: 30pt;
   line-height: 1.2em;
   text-align: center;
   padding-top: 0px;
   padding-bottom: 5px;
   margin: 0;
   }

div#content h1.smaller {
   font-size: 22pt;
   }

div#content h2 {
   font-size: 18pt;
   margin: 30px 0 10px;
   }

div#content h3 {
   font-size: 14pt;
   padding: 0;
   margin: 30px 0 0;
   }

div#content h1, 
div#content h1 a, 
div#content h1 a:hover, 
div#content h1 a:visited,
div#content h2, 
div#content h2 a, 
div#content h2 a:hover, 
div#content h2 a:visited,
div#content h3, 
div#content h3 a, 
div#content h3 a:hover, 
div#content h3 a:visited {
   text-decoration: none;
   color: #2f81b1;
   }


/*
-----------------------------------------------------------------
 Sidebar i.e. bottombar
-----------------------------------------------------------------
*/

#sidebar {
   font-size: 9pt; 'Lucida Grande', Verdana, Arial, Sans-Serif;
   color: #ffffff;
   background-color: #9999bb;
   border-top-width:2px;
   border-left-width:0px;
   border-right-width:0px;
   border-bottom-width:2px;
   border-style:solid;
   border-top-color:#2f81b1;
   border-bottom-color:#2f81b1;
   float:left;
   width:698px;
   padding:0; margin:0
   }
   

div#sidebar h2 {
   font-family: 'Lucida Grande', Verdana, Sans-Serif;
   font-size: 10pt;
   margin: 0,0,2px;
   padding: 0;
   }
div#sidebar a, #sidebar a:visited, #sidebar a:hover {
   text-decoration: underline;
   color: #fff;
}

div#sidebar .column {
   width: 165px;
   float: left;
   padding:0,10px,0;
}

div#sidebar input, #sidebar select {
   font-size: 8pt;
   color: black;
   width:150px;
   }


div#sidebar ul {
   margin: 0;
   padding: 0;
   }

div#sidebar ul li {
   list-style-type: none;
   }


/*
-----------------------------------------------------------------
 Footer
-----------------------------------------------------------------
*/

#footer {
   background-color:#1F4C8F;
   }

div#footer p, #footer p a {
   color:#FED1A7;
   font-size:8pt;
   text-align:center;
   }


/* -------------------------------------------------------------------------------------------*/

/* Begin Typography & Colors */

p.eerstealinea {
   font-weight: bold;
   color: #2f81b1;
   }

.postmetadata {
   text-align: right;
   }
   
.postmetadata.alt{
   text-align: justify;
}

.alt {

   background-color: #f8f8f8;
   border-top: 1px solid #ddd;
   border-bottom: 1px solid #ddd;
   }


cite {
   text-decoration: none;
   }

.entry p a:visited {
   color: #b85b5a;
   }

.commentlist li, #commentform input, #commentform textarea {
   font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
   }

.commentlist li {
   font-weight: bold;
   }

.commentlist cite, .commentlist cite a {
   font-weight: bold;
   font-style: normal;
   font-size: 1.1em;
   }

.commentlist p {
   font-weight: normal;
   line-height: 1.5em;
   text-transform: none;
   }

div#commentform p {
   font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
   }

.commentmetadata {
   font-weight: normal;
   }

.nocomments, .postmetadata, blockquote, strike {
   color: #777;
   }

code {
   font: 1.1em 'Courier New', Courier, Fixed;
   }

acronym, abbr, span.caps
{
   font-size: 0.9em;
   letter-spacing: .07em;
   }

/* End Typography & Colors */



/* Begin Structure */



/*   .narrowcolumn { float: left;*/ /* we have the sidebar below the contents; therefore the narrow column is actually wide */


.post {
   margin: 0 0 40px;
   text-align: justify;
   }

.post hr {
   display: block;
   }

.widecolumn .post {
   margin: 0;
   }

.narrowcolumn .postmetadata {
   padding-top: 5px;
   }

.widecolumn .postmetadata {
   margin: 30px 0;
   }

.widecolumn .smallattachment {
   text-align: center;
   float: left;
   width: 128px;
   margin: 5px 5px 5px 0px;
}

.widecolumn .attachment {
   text-align: center;
   margin: 5px 0px;
}

.postmetadata {
   clear: left;
}

#footer {
   padding: 2px;
   margin: 0 auto;
   clear: both;
   }

div#footer p {
   margin: 0;
   padding: 2px 0;
   text-align: center;
   }
/* End Structure */



/* Begin Headers */


h3.comments {
   padding: 0;
   margin: 40px auto 20px ;
   }
/* End Headers */



/* Begin Images */
p img {
   padding: 0;
   max-width: 100%;
   }
   
div#content img {
   border-top-width:1px;
   border-left-width:1px;
   border-right-width:1px;
   border-bottom-width:1px;
   border-style:solid;
   border-color:#0;
   }

div#content .noborderaroundimages img {
   border-top-width:0px;
   border-left-width:0px;
   border-right-width:0px;
   border-bottom-width:0px;
   }

/* Using 'class="alignright"' on an image will (who would've
   thought?!) align the image to the right. And using 'class="centered',
   will of course center the image. This is much better than using
   align="center", being much more futureproof (and valid) */

img.centered {
   display: block;
   margin-left: auto;
   margin-right: auto;
   }

img.alignright {
   padding: 4px;
   margin: 7px 0 2px 7px;
   display: inline;
   }

img.alignleft {
   padding: 4px;
   margin: 7px 7px 2px 0;
   display: inline;
   }
   
p.zijschrift {
   font-size: 0.8 em;
   font-style:italic;
   color: #2f81b1;
   padding-top:20px;
   }

.alignright {
   float: right;
   }

.alignleft {
   float: left;
   }
/* End Images */



/* Begin Lists

   Special stylized non-IE bullets
   Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
   margin-left: 0px;
   padding: 0 0 0 30px;
   list-style: none;
   padding-left: 10px;
   text-indent: -10px;
   } 

html>body .entry li {
   margin: 7px 0 8px 10px;
   }

.entry ul li:before, #sidebar ul ul li:before {
   content: "\00BB \0020";
   }

.entry ol {
   padding: 0 0 0 35px;
   margin: 0;
   }

.entry ol li {
   margin: 0;
   padding: 0;
   }

.postmetadata ul, .postmetadata li {
   display: inline;
   list-style-type: none;
   list-style-image: none;
   }


/* End Entry Lists */



/* Begin Form Elements */
#searchform {
   margin: 10px auto;
   padding: 5px 3px; 
   text-align: center;
   }

#sidebar #searchform #s {
   width: 108px;
   padding: 2px;
   }

#sidebar #searchsubmit {
   padding: 1px;
   }

.entry form { /* This is mainly for password protected posts, makes them look better. */
   text-align:center;
   }

select {
   width: 130px;
   }

#commentform input {
   width: 170px;
   padding: 2px;
   margin: 5px 5px 1px 0;
   }

#commentform textarea {
   width: 100%;
   padding: 2px;
   }

#commentform #submit {
   margin: 0;
   float: right;
   }
/* End Form Elements */



/* Begin Comments*/
.alt {
   margin: 0;
   padding: 10px;
   }

.commentlist {
   padding: 0;
   text-align: justify;
   }

.commentlist li {
   margin: 15px 0 3px;
   padding: 5px 10px 3px;
   list-style: none;
   }

.commentlist p {
   margin: 10px 5px 10px 0;
   }

#commentform p {
   margin: 5px 0;
   }

.nocomments {
   text-align: center;
   margin: 0;
   padding: 0;
   }

.commentmetadata {
   margin: 0;
   display: block;
   }
/* End Comments */



/* Begin Sidebar */
#sidebar
{
   padding: 10px 10px 10px 10px;
   margin: 0px 0px 0px;
   }

#sidebar form {
   margin: 0;
   }
/* End Sidebar */






/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
   cursor: help;
   }

acronym, abbr {
   border-bottom: 1px dashed #999;
   }

blockquote {
   margin: 15px 30px 0 10px;
   padding-left: 20px;
   border-left: 5px solid #ddd;
   }

blockquote cite {
   margin: 5px 0 0;
   display: block;
   }

.center {
   text-align: center;
   }

hr {
   display: none;
   }

a img {
   border: none;
   }

.navigation {
   display: block;
   text-align: center;
   margin-top: 0px;
   margin-bottom: 0px;height:20px;
   font-size:0.9 em;
   }
/* End Various Tags & Classes*/





a,a:visited {
   color:#0000ff;
   text-decoration:underline;
}

p.postmetadata { font-size:9pt; }


/* Captions & aligment */
.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}

.wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}

.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}

.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}
/* End captions & aligment */


/*
----------------------------------------------------------------
Opacity
Notice that opacity is not used, because on Internet Explorer 7 
this messes up Cleartype font anti-aliasing!
----------------------------------------------------------------
*/

/* ALL OPACITY COMMENTED OUT
#page {
   filter:alpha(opacity=85);
   }
#header {
   filter:alpha(opacity=100);
   zoom: 1;
   }
#content {
   filter:alpha(opacity=100);
   position:relative;
   zoom: 1;
   }
#content img {
   filter:alpha(opacity=100);
   position: relative;
   zoom: 1;
}
#footer {
   filter:alpha(opacity=100);
   position:relative;
   }
#sidebar {
   filter:alpha(opacity=85);
   zoom: 1;
   }
#sidebar * {
   filter:alpha(opacity=100);
   position:relative;
}
*/

/*
-----------------------------------------------------------------
 wp-calendar related
-----------------------------------------------------------------
*/

#wp-calendar #prev a, #wp-calendar #next a {
   font-size: 9pt;
   }

#wp-calendar a {
   text-decoration: none;
   }

#wp-calendar caption {
   font: bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
   text-align: center;
   }

#wp-calendar th {
   font-style: normal;
   text-transform: capitalize;
   }

#wp-calendar caption {
   text-decoration: none;
   }

#wp-calendar {
   empty-cells: show;
   margin: 10px auto 0;
   width: 155px;
   }

#wp-calendar #next a {
   padding-right: 10px;
   text-align: right;
   }

#wp-calendar #prev a {
   padding-left: 10px;
   text-align: left;
   }

#wp-calendar a {
   display: block;
   }

#wp-calendar caption {
   text-align: center;
   width: 100%;
   }

#wp-calendar td {
   padding: 3px 0;
   text-align: center;
   }

#wp-calendar td.pad:hover { /* Doesn't work in IE */
   background-color: #fff; }