html {
min-height: 101%;
}
body {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    color: #454545;
    text-align: center;
    background-color: white;
}
body, a {
    /* http://www.alistapart.com/articles/sizematters/ */
    font: xx-small/1.5em Arial, sans-serif;
    voice-family: "\"}\"";
    voice-family: inherit;
    font-size: x-small;
} html>body, html>body a {
    font-size: x-small;
}

a,
a:link,
a:visited,
a:active {
    color: #000;
    text-decoration: none;
    background-color: #e2e2e2;
    font: 12px/20px Arial, sans-serif;
}

a:hover {
    background-color: #467492;
}

img             {margin: 0; border: 0; vertical-align: bottom;}
form            {margin: 0;}
input           {margin: 0;}

.icon           {cursor: pointer;}
.nowrap         {white-space: nowrap;}
.error          {color: red;}

p, h1, h2, h3, h4, h5, h6 {
    padding: 0;
    margin: 0;
}

/* Clear Floats Without Structural Markup
http://www.positioniseverything.net/easyclearing.html
----------------------------------------------------------*/
/* put period after content and clear it to expand div */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;} /* ONLY seen by IE-win */
/* End hide from IE-mac *//* lay out
---------------------------------------------- */
#center {
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;
    text-align: left;
    width: 800px;
}

#top {
    height: 64px;
}

#top h1 {
    display: none;
}

.content {
    padding: 0px 0px 0px 0px;
    margin: 5px 0px 0px 0px;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
/*    background-color: #ddd;/**/
}

.visual {
    width: 799px; /*t800px*/
    height: 220px; /*t220px*/
    background-color: #f2f2f2;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #222;
}

.visual.error {
    width: 800px; /*t800px*/
    border-right: 0px;
    border-bottom: 1px solid #222;
}

.visual img {
    float: left;
    border-right: 1px solid #ddd;
}

.visual p {
    color: #000;
    padding: 8px 0px 0px 608px;
    font: 11px/20px Arial, sans-serif;
}

.visual span {
    font-weight: normal;
    color: #454545;
}

.visual a,
.visual a:active,
.visual a:visited {
    font-weight: bold;
    background-color: transparent;
}

.projectname {
    padding: 14px 0px 0px 0px;
}

.centercontent {
    padding: 0px 0px 0px 10px;
/*    background-color: yellow;/**/
}

.centercontent.home {
    padding: 0px 0px 30px 10px;
}

.centercontent.errortxt {
    padding: 20px 0px 30px 10px;
}

.centercontent.home a,
.centercontent.home a:active,
.centercontent.home a:visited {
    width: 100%;
    display: block;
    color: #454545;
    background-color: #fff;
}

.centercontent.home a:hover {
    color: #000;
    background-color: #fff;
}

.column {
    float: left;
    width: 370px;
    padding: 0px 20px 0px 0px;
}

.content_item {
    margin: 20px 100px 20px 30px;
}

.contact_address {
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    background-color: #f2f2f2;
    border: 1px solid #ddd;
}

.contact_address p {
    font: 11px/20px Arial, sans-serif;
    color: #000;
}/* nav
---------------------------------------------- */

.nav,
.nav ul {
    padding: 0;
    margin: 0;
    width: 800px;
    background-color: #222;
}

.nav li {
    display: inline;
    list-style: none;
}

.nav li a,
.nav li a:active,
.nav li a:visited,
.nav li a.sel,
.nav li a.sel:active,
.nav li a.sel:visited,
.nav li a:hover {
    color: #fff;
    float: left;
    display: block;
    width: 90px; /*t99px*/
    height: 36px; /*t45px*/
    padding: 9px 0px 0px 9px;
    text-decoration: none;
    border-right: 1px solid #c2c2c2;
    background-color: #222;
    font: bold 10px/10px Arial, sans-serif;
}

.nav li a.sel,
.nav li a.sel:active,
.nav li a.sel:visited,
.nav li a:hover {
    background-color: #467492;
}

/* portfolio_nav
---------------------------------------------- */

.nav_left {
    float: left;
    width: 100px;
}

.nav_right {
    text-align: right;
    width: 180px;
    float: right;
    padding: 0px 10px 0px 0px;
}

.portfolio_nav {
    width: 800px;
    background-color: #f2f2f2;
}

.portfolio_nav_bottom {
    padding: 4px 0px 20px 400px;
}

.multipagenav {
    float: left;
    color: #8d8c91;
    width: 291px; /*t300px*/
    padding: 3px 0px 0px 109px;
/*    background-color: #f00; /**/
    font: bold 11px/12px Arial, sans-serif;
}

.multipagenav .counter {
    float: left;
    width: 130px; /*t140px*/
/*    background-color: #f00; /**/
}

.multipagenav .prevnext {
    float: right;
    text-align: right;
    width: 150px; /*t140px*/
    padding: 0px 9px 0px 0px;
/*    background-color: #6c3; /**/
}

.multipagenav a,
.multipagenav a:active,
.multipagenav a:visited,
.multipagenav a:hover {
    color: #000;
    text-decoration: none;
    background-color: transparent;
    font: bold 11px/12px Arial, sans-serif;
}

.multipagenav a:hover,
.multipagenav a.sel,
.multipagenav a.sel:active,
.multipagenav a.sel:visited {
    color: #8d8c91;
}

.portfolio_nav ul {
    padding: 0px 0px 0px 200px;
    margin: 0;
}

.portfolio_nav li {
    display: inline;
    list-style: none;
}

.portfolio_nav li a,
.portfolio_nav li a:active,
.portfolio_nav li a:visited,
.portfolio_nav li a.sel,
.portfolio_nav li a.sel:active,
.portfolio_nav li a.sel:visited,
.portfolio_nav li a:hover {
    color: #000;
    float: left;
    display: block;
    width: 90px; /*t99px*/
    height: 27px; /*t30px*/
    padding: 3px 0px 0px 9px;
    text-decoration: none;
    border-right: 1px solid #fff;
    background-color: #f2f2f2;
    font: bold 11px/12px Arial, sans-serif;
}

.portfolio_nav li a.sel,
.portfolio_nav li a.sel:active,
.portfolio_nav li a.sel:visited,
.portfolio_nav li a:hover {
    color: #fff;
    background-color: #b9b9b9;
}/* content
---------------------------------------------- */
h1 {
    color: #000;
    padding: 0px 0px 10px 0px;
    font: bold 15px/20px Arial, sans-serif;
}

h2 {
    color: #000;
    padding: 0px 0px 0px 14px;
    margin: 20px 0px 0px 0px;
    font: bold 11px/30px Arial, sans-serif;
    background: url('../img/css/icons/h2_icon.gif') no-repeat 0px 12px; /* x-pos y-pos*/
}

h3 {
    color: #000;
    padding: 0px 0px 0px 5px;
    margin: 20px 0px 0px 0px;
    font: bold 12px/20px Arial, sans-serif;
}

p, ul, li {
    color: #454545;
    font: 12px/20px Arial, sans-serif;
}

span {
    font-weight: bold;
    color: #467492;
}

a.pdf,
a.pdf:active,
a.pdf:visited {
    display: block;
    margin: 16px 0px 0px 0px;
    padding: 4px 20px 4px 40px;
    border: 0px solid #222;
    background: url(../img/css/icons/icon_pdf.gif) no-repeat 0px 0px; /* x-pos y-pos */
}/* portfolio
---------------------------------------------- */

.portfolio {
    margin: 10px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
/*    background-color: #6c3; /**/
    border-bottom: 1px solid #ddd;
}

.portfolio .listblock {
    margin: 0;
    padding: 0;
    padding: 0px 0px 15px 0px;
    border-top: 1px solid #ddd;
}

/* make normal links in listview */
.portfolio .listblock a,
.portfolio .listblock a:active,
.portfolio .listblock a:visited {
    display: block;
    color: #454545;
    background-color: #fff;
}

.portfolio .detailblock {
    margin: 0;
    padding: 0px 0px 15px 0px;
/*    background-color: #6c3; /**/
}

.portfolio .detailleft {
    float: left;
    width: 388px; /*t400px*/
    padding: 0px 10px 0px 0px;
/*    background-color: #6c3; /**/
}

.portfolio .detailright {
    float: right;
    width: 400px; /*t400px*/
    padding: 0px 0px 0px 0px;
/*    background-color: #6c3; /**/
}

.portfolio .detailimage {
    float: right;
    width: 400px; /*t400px*/
    padding: 0px 0px 0px 0px;
    overflow: hidden;
/*    background-color: yellow; /**/
}

.portfolio .detailimage .letterpress {
    height: auto;
/*    background-color: yellow; /**/
}

.portfolio .detailthumbs {
    float: right;
    width: 400px; /*t400px*/
/*    background-color: pink; /**/
}

.portfolio .leftblock {
    float: left;
    width: 190px; /*t200px*/
    padding: 0px 10px 0px 0px;
}

.portfolio .centerblock {
    float: left;
    width: 390px;
}

.portfolio .centerblock a,
.portfolio .centerblock a:active,
.portfolio .centerblock a:visited {
    width: 100%;
    text-decoration: none;
    background-color: #fff;/**/
    display: block;
}

.portfolio .centerblock a:hover {
    display: block;
    color: #000;
    text-decoration: none;
}

.portfolio .thumbnail {
    float: right;
    width: 200px;
}

.portfolio h1 {
    color: #000;
    margin: 10px 0px 0px 4px;
/*    background-color: #6c3; /**/
}

.portfolio p {
    margin: 0px 0px 0px 4px;
}

.portfolio h2 {
    margin: 4px 0px 0px 0px;
/*    background-color: #6c3; /**/
}

.portfolio .thumbnail img {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
}

.portfolio .detailimage img {
    border: 1px solid #ddd;
}

.portfolio .detailimage p {
    color: #000;
    margin: 0px 0px 0px 0px;
    font: 11px/15px Arial, sans-serif;
}

/* portfolio detaillist
---------------------------------------------- */

.detaillist ul {
    padding: 10px 0px 20px 0px;
    margin: 0;
}

.detaillist li {
    list-style: none;
    color: #454545;
    border-bottom: 1px solid #ddd;
    padding: 0px 10px 0px 10px;
    font: 11px/18px Arial, sans-serif;
}

.detaillist li strong {
    color: #000;
}/* detailthumbss
---------------------------------------------- */

/**
 * changing image borders on hover in IE is pretty difficult
 * as IE doesn't change image borders on hover
 * next part is inspired from
 * http://www.ericmeyeroncss.com/projects/04/
*/

.detailthumb {
    width: 122px;
    padding: 16px 16px 0px 0px;
    float: left;
}

.detailthumb.third {
    float: left;
    padding: 16px 0px 0px 0px;
}

.detailthumb a {
    display: block;
    margin: 0;
}

.detailthumb img {
    display: block;
    height: 90px;
    width: 120px;
    border: 1px solid #ddd;
    border-width: 1px 1px;
    background: transparent;
}

.detailthumb img.sel {
    background: #000;
    border-color: #000;
}

/* this one does the trick for IE */
/*
.detailthumb a:hover {
    background-color: #000;
}/**/
.detailthumb a:hover img {
    border-color: #000;
}

.detailthumb a:active img {
    border-color: #000;
    border-style: inset;
}/* textpage
---------------------------------------------- */

.textpage {
    padding: 20px 0px 0px 0px;
}

.textpage .menu {
    float: left;
    width: 180px; /*t200px*/
    padding: 0px 20px 0px 0px;
/*    background-color: yellow; /**/
}

.textpage .tekst {
    float: left;
    width: 380px; /*t400px*/
    padding: 0px 0px 40px 0px;
/*    background-color: yellow; /**/
}

.textpage .rightcolumn {
    float: right;
    width: 200px; /*t200px*/
    padding: 0px 0px 0px 0px;
}

.textpage h2 {
    margin: 4px 0px 0px 0px;
}

.rightcolumn img {
    border: 1px solid #ddd;
}

.rightcolumn .letterpress {
    padding: 0px 0px 24px 0px;
}

.rightcolumn .letterpress p {
    color: #000;
    font: 11px/18px Arial, sans-serif;
}

.crosslinkdetails {
    background-color: #f2f2f2;
    padding: 4px 0px 0px 0px;
    margin: 0px 0px 15px 0px;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #fff;
}

.crosslinkdetails ul {
    margin: 0px 0px 0px 0px;
    padding: 0;

}
.crosslinkdetails li {
    list-style: none;
    color: #454545;
    border-bottom: 1px solid #ddd;
    padding: 0px 10px 0px 10px;
    font: 11px/18px Arial, sans-serif;
}

.crosslinkdetails li strong {
    color: #000;
}/* leftmenu chapters
-----------------------------------------------*/
.menu h1 {
    padding: 0px 0px 0px 10px;
    margin: 0;
}

.menu ul {
/*    background-color: pink; /**/
    padding: 10px 0px 20px 0px;
    margin: 0;
}

.menu li {
    list-style: none;
    color: #454545;
    border-bottom: 1px solid #ddd;
    padding: 0px 0px 0px 20px;
}

.menu li a,
.menu li a:active,
.menu li a:visited {
    color: #000;
    background-color: #fff;
    text-decoration: none;
    font: bold 11px/19px Arial, sans-serif;
}

.menu li a:hover {
    color: #fff;
    background-color: #000;
}

.menu li a.sel,
.menu li a.sel:hover,
.menu li a.sel:active,
.menu li a.sel:visited {
    color: #fff;
    background-color: #000;
}

/* submenu
-----------------------------------------------*/

.menu li ul {
/*    background-color: yellow; /**/
    padding: 5px 0px 20px 0px;
    margin: 0;
}

.menu li ul li {
    list-style: none;
    color: #454545;
    border-bottom: 1px solid #ddd;
    padding: 0px 0px 0px 10px;
}

.menu li ul li a,
.menu li ul li a:active,
.menu li ul li a:visited {
    color: #000;
    background-color: #fff;
    text-decoration: none;
    font: normal 11px/19px Arial, sans-serif;
}

.menu li ul li a:hover {
    color: #fff;
    background-color: #666;
}

.menu li ul li a.sel,
.menu li ul li a.sel:active,
.menu li ul li a.sel:visited {
    color: #fff;
    background-color: #666;
}.formulier .fieldcontainer {
    border-top: 1px solid #ccc;
}

.formulier input.text {
    width: 200px;
    margin: 5px 0px 0px 0px;
}

.formulier textarea {
    width: 280px;
    height: 131px;
    margin: 5px 0px 0px 0px;
    font: 13px/15px Arial, sans-serif;
}

.formulier label {
    float: left;
    display: block;
    width: 90px;
    padding: 0px 0px 0px 0px;
    font: 12px/30px Arial, sans-serif;
/*    background-color: green; /* */
}

.formulier label.error {
    display: block;
    height: 15px;
    width: 100%;
    margin: 0px 0px 0px 0px;
    padding: 15px 0px 0px 0px;
    text-align: left;
    font: 12px/15px Arial, sans-serif;
/*    background-color: yellow; /* */
}
.formulier .submit input {
    margin: 20px 0px 0px 0px;
}

/* spam-wall */
.spam-wall {
    display: none;
}/* footer
---------------------------------------------- */

.footer {
    width: 800px;
/*    background-color: yellow;/**/
}

.footer ul {
    margin: 0;
    padding: 0;
}

.footer li {
    display: inline;
    list-style: none;
    color: #000;
    padding: 0px 25px 0px 10px;
    font: normal 11px/23px Arial, sans-serif;
}

.footer li a,
.footer li a:active,
.footer li a:visited,
.footer li a:hover {
    background-color: #fff;
    font: normal 11px/23px Arial, sans-serif;
}
