/*-----------------------------------------------------------------*/
/* [praktijk het vierkant.nl]
1.	Reset
2.	Body
3.	Grid
4.	Wrapper .wrapper
5.	Content .content
/*-----------------------------------------------------------------*/
/* [1. Reset] */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{/* remember to define focus styles! */ outline:0}
ins{/* remember to highlight inserts somehow! */ text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse}
td{padding-right:10px;vertical-align:top}
/*-----------------------------------------------------------------*/
/* [2. Body] */
body{position:relative;background:#FFF url(../images/layout/bg_body.png) repeat-x;font:62.5% Verdana,Geneva,Arial,Helvetica,sans-serif;text-align:center}
a{color:#FF6600;outline:none;text-decoration:none}
a:hover{color:#FF6600;text-decoration:underline}
/*-----------------------------------------------------------------*/
/* [3. Grid .grid] */
.container{position:relative;width:950px;margin:0 auto;background:transparent;border:10px solid #FFF;border-width:0 10px}
.grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11,.grid12{float:left;margin:0 0 10px 10px;background:transparent;text-align:left}
.grid1{width:70px}
.grid2{width:150px}
.grid3{width:230px}
.grid4{width:310px}
.grid5{width:390px}
.grid6{width:470px}
.grid7{width:550px}
.grid8{width:630px}
.grid9{width:710px}
.grid10{width:790px}
.grid11{width:870px}
.grid12{width:950px}
.first{margin-left:0;clear:left}
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
* html .clearfix{/* IE6 */ zoom:1}
*:first-child+html .clearfix{/* IE7 */ zoom:1}
/*-----------------------------------------------------------------*/
/* [4. Wrapper .wrapper] */
.wrapper{margin-top:560px}
/*-----------------------------------------------------------------*/
/* [5. Content .content] */
.content{background:transparent}
.content h1{margin:30px;font:3em Arial,Helvetica,sans-serif;color:#463F33}
.content h2{margin:0 30px 20px 30px;padding-bottom:20px;font:1.3em Arial,Helvetica,sans-serif;color:#695E4A;background:url(../images/layout/bg_h2.gif) repeat-x bottom}
.content h3{margin:0 30px 20px 30px;font:bold 1.1em/1.9em Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33}
.content p,.content table,.content ul{margin:0 30px 20px 30px;font:1.1em/1.9em Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33}
.content li{padding-left:13px;background:url(../images/layout/bg_li.gif) no-repeat 0em 0.8em}
.content li.sublist{margin-left:13px}
.content input{margin:0px 0px 4px 128px;padding:2px;width:200px;font:10px Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33;border:1px solid #BBB3A5}
.content input.checkbox{margin:4px 20px 4px 0px;width:auto;height:auto;border:none}
.content input.submit{margin:0px 0px 20px 30px;padding:2px 10px 2px 10px;width:auto;font-weight:bold;text-align:center;cursor:pointer;background:White}
.content textarea{margin:-15px 0px 20px 30px;padding:2px;width:410px;height:80px;font:10px Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33;overflow:auto;border:1px solid #BBB3A5}
.content div.hr{margin:0 30px;background:transparent url(../images/layout/bg_h2.gif) repeat-x scroll;height:20px}
.content div.hr hr{display:none}
.content img.statimg{margin:0.5em 2.5em 1em 30px;float:left;width:135px;height:135px;border:1px solid #CFC8BC}
.content img.bookimg{margin:0.5em 2.5em 1em 30px;float:left;border:1px solid #CFC8BC}
/*-----------------------------------------------------------------*/
/* [5. ColumnRight .columnright] */
.columnright{margin-left:0px;background:#EFEDE9 url(../images/layout/bg_columnright.png);border:10px solid #FFF;border-width:0 0 10px 10px}
.columnright a img{border-bottom:10px solid #FFF}
.columnright h1{margin:10px;font:bold 1em/1.6em Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33}
.columnright p,.columnright ul{margin:10px;font:1em/1.6em Verdana,Geneva,Arial,Helvetica,sans-serif;color:#463F33}
.columnright li{padding-left:13px;background:url(../images/layout/bg_li.gif) no-repeat 0em 0.8em}
.columnright .nieuws{margin:0;height:310px;background:#EFEDE9 url(../images/layout/bg_nieuws.png);border-top:10px solid #FFF}
/*-----------------------------------------------------------------*/
/* [5. NavTop .navtop] */
.navtop{position:absolute;top:30px;left:0px;width:100%;height:200px;background:#FD7E20 url(../images/layout/bg_header.png) no-repeat left;z-index:95}
/* remove all the bullets,borders and padding from the default list styling */
.navtop ul{padding:0;margin:0;list-style-type:none}
.navtop ul{display:block;margin:0 auto;padding:160px 0 0 350px;width:600px;height:30px}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.navtop li{float:left;position:relative;padding:0}
/* style the links for the top level */
.navtop ul a{display:block;margin-left:10px;height:28px;width:108px;background:transparent;font:10px/29px Verdana;text-decoration:none;color:White;text-align:center;letter-spacing:1px;border:1px solid White}
.navtop ul a:hover{background:White;color:#463F33;border-bottom:21px solid #FFF}
/* hide the sub levels and give them a positon absolute so that they take up no room */
.navtop ul ul{visibility:hidden;position:absolute;margin:0;padding:0;top:50px;left:10px;width:110px;background:#FFF}
.navtop ul ul.droplarge{left:10px;width:351px;height:auto;background:#FFF;border-bottom:1px solid White;cursor:default}
.navtop ul ul.dropright a{width:109px}
/* style the table so that it takes no part in the layout - required for IE to work */
.navtop table{position:absolute;top:0;left:0}
/* style the second level links */
.navtop ul ul a{margin:-1px 0 0 0;width:108px;height:30px;background:White;color:#463F33;font:10px/30px Verdana;border:1px solid #FFF}
.navtop ul ul.droplarge a{margin:0px -1px -1px 0px;padding-left:10px;width:164px;text-align:left}
/* style the top level hover */
.navtop ul a:hover,{height:49px;background:White;color:#463F33;border-bottom:21px solid #FFF}
.navtop ul :hover > a{height:49px;background:White;color:#463F33;border-bottom:21px solid #FFF}
/* style the second level hover */
.navtop ul ul a:hover{height:30px;background:#FD7E20;color:#FFF;border:1px solid #FFF}
.navtop ul ul :hover > a{height:30px;background:#FD7E20;color:#FFF;border:1px solid #FFF}
/* make the second level visible when hover on first level list OR link */
.navtop ul li:hover ul,.navtop ul a:hover ul{visibility:visible}
/*-----------------------------------------------------------------*/
/* [5. NavLogo .navlogo] */
.navlogo{position:absolute;top:5px;left:-10px;width:200px;height:200px;background:#9BD975  url(../images/layout/bg_logo.png);border:5px solid #FFF;line-height:1000px;overflow:hidden;z-index:98}
.navlogosub{position:absolute;top:40px;left:220px;text-align:left;font:2.2em/1.4em Arial,Helvetica,sans-serif;color:#FFF;z-index:98}
.logofadein{display:none;position:absolute;top:5px;left:-10px;width:200px;height:200px;background:#9BD975 url(../images/layout/bg_logo_fadein.png);border:5px solid #FFF;line-height:1000px;overflow:hidden;z-index:99}
/*-----------------------------------------------------------------*/
/* [5. Header .header] */
.header{position:absolute;top:240px;left:0px;background:#FFF}
.header .slideshow{position:relative;width:630px;height:310px}
.header .slideshow img{position:absolute;top:0px;left:0px;display:none}
/*-----------------------------------------------------------------*/
/* [5. Quote .quote] */
.quote{height:310px;background:#6B4B3F url(../images/layout/bg_quote.png)}
.quote cite{display:table-cell;padding:30px;width:250px;height:250px;vertical-align:middle;margin:0;font:italic 2.2em/1.6em Arial,Helvetica,sans-serif;color:#FFF}
/*-----------------------------------------------------------------*/
/* [5. Footer .footer] */
.footer{clear:both;position:relative;width:100%;height:200px;background:#6B4B3F url(../images/layout/bg_footer.png) no-repeat left;border-bottom:30px solid #FFF}
.footer .container{position:relative;width:950px;height:200px;margin:0 auto;background:transparent url(../images/layout/bg_footer_container.png) no-repeat 30px 151px;border:0}
.footer .navlogo{position:absolute;top:15px;left:740px;width:200px;height:200px;background:#FD7E20  url(../images/layout/bg_logo_footer.png);border:5px solid #FFF;line-height:1000px;overflow:hidden;z-index:98}
.footer p{margin:10px 0 0 30px;font:1em/1.6em Verdana,Geneva,Arial,Helvetica,sans-serif;color:#A97D6D}
.footer a{color:#A97D6D}