/*  Reset */

html, body, h1, h2, h3, h4, h5, h6, p, form, fieldset { padding: 0; margin: 0; }
img, fieldset, form { border: 0; }

    /*  Global */
html { margin-bottom: 1px; }
body { background-color: #373737; font-family: verdana; font-size: 11px; line-height: 18px; }
div#container { width: 940px; margin: 20px auto; overflow: auto;}
div.clearer { clear: both; }
.right { float: right; }
.left { float: left; }
.clearfix { display: block; clear: both; height: 1px; }

    /*  Top */

div#top { height: 40px; margin: 6px 22px 0 22px; color: #ffffff; }
div#top ul { float: right; padding: 0; margin: 0; list-style: none; }
div#top ul li { float: left; padding: 0 6px; margin: 0; border-left: 1px solid white; }
div#top ul li:first-child { border: 0; }
div#top ul li a { color: #ffffff; font-family: arial; font-size: 12px; text-decoration: none; }
div#top ul li a:hover { text-decoration: underline; }
div#top ul li.selected a { font-weight: bold; text-decoration: underline; }
div#top ul ul { display: none; }

  /*  Breadcrumbs */
ul.breadcrumbs { padding:0; list-style: none !important; margin: 0 !important; overflow: auto; float: left; }
ul.breadcrumbs li { float: left; font-size: 11px; font-family: Arial; padding-right: 4px; text-shadow:1px 1px 0 #FFFFFF; }
ul.breadcrumbs li:before { content: '» '; }
ul.breadcrumbs li:first-child:before { content: ''; }
ul.breadcrumbs { color: #999; }
ul.breadcrumbs li a { color: #999 !important; text-decoration: underline; }
ul.breadcrumbs li a:hover { color: #0698D6 !important; }
div#breadcrumbs { overflow: auto; }

  /*  Tree */
#tree h3 { }
#tree { display: block; overflow: auto; clear: both; background: #E6E6E6; border-top: 1px solid #DCDADA; }
#tree ul { padding: 0; list-style: none; line-height: 18px; margin: 0; }
#tree ul li { padding-bottom: 3px; }


  /*  Showcase */
#showcase { width: 100% !important; }
#showcase .showcase-content { background: white; }
#showcase .showcase-thumbnail-container { background: transparent; position: absolute; margin-top: -120px; }
#showcase .showcase-arrow-previous { left: 20px; z-index: 1000; }
#showcase .showcase-arrow-next { right: 20px; z-index: 1000; }
#showcase .showcase-thumbnail { width: 166px; height: 90px; padding: 0;}
#showcase .showcase-thumbnail img { height: 90px; }
#showcase .showcase-caption { color: white; background: none; font-family: Arial; opacity: 0.8; }
#showcase .showcase-caption h3 { font-size: 22px; text-align: left; background: black; font-weight: bold; padding: 10px 20px; position: absolute; bottom: 362px; left: 24px; }
#showcase .showcase-caption h3 a { text-decoration: none; color: white; }
#showcase .showcase-caption h4 { color: white; font-size: 12px; letter-spacing: 1px; line-height: 24px; text-align: left; position: absolute; background: #212121; padding: 5px 20px; bottom: 324px; left: 24px; }
 #showcase .showcase-caption h4 a { text-decoration: none;  color: white; }
#showcase:hover h3 { background: #FF6700 !important; }

    /*  Header */
div#header { position: relative; height: 141px; }    
div#branding { position: absolute; left: 30px; width: 100%; width: 260px;  background: white; padding: 10px 20px;  }
#home #branding { left: 7px; }
div#branding img { width: 100%; }
div#followers a.external { padding: 0; background: none; }
div#followers img { margin: 0 !important; padding: 0; display: block; float: left; width: 47px; height: 47px; }

    /*  Navigation */

div#navigation { height: 34px; padding: 0 0 0 0; margin-top: 20px; }
#home #navigation { float: right; padding-right: 30px; padding-top: 30px; }
div#navigation ul { padding: 4px 0 0 0; margin: 0; list-style: none; }
div#navigation ul li { padding: 0; margin: 0; float: left; }
div#navigation ul li a { display: inline-block; height: 22px; line-height: 22px; padding: 2px 10px 2px 10px; font-family: arial; font-size: 13px; text-decoration: none; color: black; border: 1px solid #999; margin-right: 4px; }
div#navigation ul li a:hover { background: #e9e9e9; }
div#navigation ul li.selected a, div#navigation ul li.active a { background: #a1a1a1; font-weight: bold; color: white; }
div#navigation ul li.selected a:hover, div#navigation ul li.active a:hover { text-decoration: none; }

div#subnavigation { padding: 0 0 10px 0; margin-top: 20px;  }
div#subnavigation ul { padding: 4px 0 0 0; margin: 0; list-style: none; overflow: auto;}
div#subnavigation ul li { padding: 0; margin: 0; float: left; }
div#subnavigation ul li a { display: inline-block; height: 22px; line-height: 22px; padding: 2px 10px 2px 10px; font-family: arial; font-size: 13px; text-decoration: none; color: black; border: 1px solid #FF6700; margin: 0 4px 4px 0;  }
div#subnavigation ul li a:hover { background: #e9e9e9; border-color: #999; }
div#subnavigation ul li.selected a, div#subnavigation ul li.active a { background: #FF6700; font-weight: bold; color: white; }
div#subnavigation ul li.selected a:hover, div#subnavigation ul li.active a:hover { text-decoration: none; }


    /*  Subnavigation */
div#navigation ul ul { display: none; position: absolute; z-index: 2000; float: none; width: 160px; }
div#navigation ul li:hover ul { display: none; }
div#navigation ul li ul li { float: none; display: inline; }
div#navigation ul li ul li a { color: white !important; text-decoration: none; width: 100%; font-size: 12px !important; border-bottom: 1px solid black; padding: 5px 5px 5px 10px; background-color: black; font-weight: bold; }
div#navigation ul li ul li a:hover { text-decoration: underline !important; }
div#navigation ul li.active ul li.selected a { background-color: #FF6700; font-style: italic; }
    /*  Subsubnavigation */
div#navigation li:hover ul li ul { display: none; padding: 30px 30px 30px 0; margin: -50px 0 0 160px; background: transparent; }
div#navigation li ul li ul { display: none; }
div#navigation li:hover ul li:hover ul { display: block; }

    /*  Hyperlinks */

a { color: #ff6700; }
a:hover { color: #ff6700; text-decoration: none; }
a.external { padding-right: 15px; background: url('/images/links/bg_external.gif') no-repeat right center; }
a.external:hover { background-image: url('/images/links/bg_external-hover.gif'); }

h1 a, h2 a, h3 a { color: inherit; text-decoration: none; }
h1 a:hover, h2 a:hover, h3 a:hover { color: inherit; text-decoration: underline; }

.one-half { width: 49%; padding: 0; margin-right: 2%; }

#news { background: #e9e9e9; padding: 20px; margin-top: 20px; }

    /*  Twitterfeed */
#twitterfeed { position: relative; z-index: 100; background: url('../images/bg_trans-black2.png'); padding: 20px; color: white; margin-top: -130px; }    
#home #twitterfeed { margin-top: 0; }
#twitterfeed .date { font-size: 80%; font-weight: bold; }    
#twitterfeed a:first-child { font-weight: bold; text-decoration: none; }    
#twitterfeed a.external { background: none; padding: 0; }
.bttn, #followus { background: #FF6700; display: block; color: white; text-align: center; font-size: 18px; padding: 10px 5px; text-decoration: none; font-family: arial; }
.bttn:hover, #followus:hover { background: black; }

    /*  Content */

div#container-content { clear: both; overflow: auto; background: white; }
div#content { clear: both; overflow: auto; }
div#content img { margin: 0 4px 4px 0; }
div#content-lft { float:left; width: 400px; padding: 22px 11px 22px 22px; margin-top: -50px; }
div#content-rgt { float:right; width: 400px; padding: 22px 22px 22px 11px; }

h1, .h1 { clear: both; padding: 10px 0; margin: 10px 0 5px 0; color: #ff6700; font-family: arial; font-size: 18px; font-weight: normal; line-height: 28px; }
h2, .h2 { clear: both; padding: 5px 0; margin: 10px 0 5px 0; color: #000000; font-family: arial; font-size: 14px; line-height: 24px; }
h3, .h3 { clear: both; padding: 5px 0 1px 0; font-family: arial; font-size: 12px; line-height: 20px; font-weight: bold; }
p { padding: 2px 0 10px 0; }
h3 + p { padding-top: 0; }
h1 + ul, h2 + ul, h3 + ul { clear: both; }

#content p img { width: 100%; height: auto; }
#article p { text-align: justify; }

    /*  Footer block */
div#bottomblock { overflow: visible; margin: 20px; clear: both; background-color: #F7F7F7; border: 1px solid #D7D7D7 }
div#bottomblock img { max-width: 100%; }
div#bottomblock ul, div#bottomblock ul li { padding-left: 0; margin-left: 0; list-style: none; }
div#bottomblock a.external { padding: 0; margin: 0; background: none; }

    /*  Footer */

div#footer { clear: both; overflow: visible; height: 33px; line-height: 33px; padding: 0 11px 0 11px; background-color: #000000; color: #ffffff; }
div#footer div#copyright { float:left;}
div#footer div#extra { float:right;  }
div#footer div#extra ul { padding: 0; margin: 0; float: right; list-style: none; }
div#footer div#extra ul li { padding: 0; margin: 0; float: left; }
div#footer div#extra ul li a { display: block; height: 33px; line-height: 33px; padding-left: 10px; color: #ffffff; text-decoration: none; }
div#footer div#extra ul li a:hover { text-decoration: underline; }
div#footer div#extra ul li.active a { text-decoration: underline; }

    /*  Credits */

div#credits { padding: 0 0 50px 0; }
div#credits p#label { padding: 0; margin: 0; display: block; float: right; width: 220px; height: 28px; line-height: 28px; background-color: #4b4b4b; color: #ffffff; font-size: 10px; text-align: center;}
div#credits p#label a { color: #ffffff; text-decoration: underline; padding-right: 0; background: none;}
div#credits p#label a:hover { color: #ff6700; text-decoration: none; background: none;}

/*  Forms */
form { margin: 10px 0; overflow: visible; }
fieldset { margin-bottom: 10px; }
form label { cursor: pointer; clear: both; color: #888; display: block; font-size: 11px; line-height: 1.5em; width: 100%; }
form input[type="text"], form input[type="password"], textarea  { width: 350px; padding: 4px 3px; background-color: #FAFAFA; border: 1px solid #dedede; font-size: 12px; line-height: 14px; height: auto; margin: 2px 0px; font-family: Helvetica,Arial,Verdana,sans-serif; }
form fieldset#subscription label { float: left; width: auto; padding-right: 4px; }
form fieldset#subscription input[type="checkbox"] { position: relative; z-index: 100; margin-top: 2px; width: auto; display: block; float: left; }
form input[type="submit"] { clear: both; float: none; display: block; }
form .one-half { margin-bottom: 0; }
input, fieldset { max-width: 85%; }

.horizontal label { width: 150px; float: left; line-height: 28px; margin: 2px; }
.horizontal input[type="text"],
.horizontal input[type="password"] { width: 270px; float: left; }

 /* Forms - error */
.errorlist { width: 0; height: 0; padding: 0 !important; display: inline; overflow: visible; position: relative; z-index: 10000; }
.errorlist li { width: 349px; height: 48px; line-height: 19px; padding: 10px 10px 10px 20px; border: 0; display: block !important; position: absolute; background: url('http://www.hetcms.nl/beheer/images/notifications/balloon-error.png') no-repeat center center; color: #333333; left: -130px; top: -10px; }