@charset "utf-8";
/* CSS Document */

* { margin:0; padding:0;}

body { background:#efefe8; font-family:'Trebuchet MS',Verdana, Arial, Helvetica, sans-serif; color:#333; font-size:14px; position:relative; left:0px; top:0px; z-index:0; }
#topheader { width:1020px; position:absolute; top:0px; background:#666666;  }
#wrap { width:1020px; margin:0px auto; position:relative;} 
#container { width:1020px; background:url(../images_matrix/planet/container_bg.png) repeat-y; } 
#header { width:1020px; height:174px; background: url(../images_matrix/planet/shop_header_bg.png) no-repeat; }
#maincol { width:700px; float:left; margin: 20px 0 0 40px; padding: 0 0 20px 0; display: inline;}
#rightcol { width:210px; float:left; margin: 20px 0 0 30px; padding: 0 0 20px 0; font-size:12px;} /* de rightcol is de rechterkolom en is even breed als een wide IMU */
#magazinefooter { margin:0 1px 0 1px; padding:25px 30px;}
#footer {margin: 0 0 0 5px; padding:10px 10px 5px 10px; font-size:10px; color:#666; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight:bold;}
#footer_greybox{margin: 20px 0 0 40px; width:940px; background:#efefe8 url(../images_matrix/planet/greybox_940.png) top left no-repeat;}
#footer_end{ margin: 0 0 30px 40px; width:940px; height:15px; background: #efefe8 url(../images_matrix/planet/greybox_940_footer.png) bottom left no-repeat;}
#containerfooter { width:1020px; background: #efefe8 url(../images_matrix/planet/footer_bg.png) no-repeat top left; text-align:center; font-size:10px; color:#666; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight:bold; padding:13px 0 40px 0} /*deze footer dient om de container (het witte vlak) te sluiten; copyright info zit hier ook in */

.logo { display:block; width: 260px; height:75px; position:relative; top:40px; left:50px; }
.hidden { position:absolute; left:-999px;} 

.middle_leftcol_370 { width:370px; float:left;}
.middle_rightcol_200 { width:200px; float:left;}


.regbox { width:569px; background:#FFFFFF url(/images_matrix/planet/regbox_red_574.png) top left no-repeat; margin:10px 0 0 0; position:relative; top:0; left:0; padding: 0 0 2px 5px;}
.regbox_footer { width:574px; margin:0px; height:15px; background: #FFFFFF url(/images_matrix/planet/regbox_red_574_footer.png) bottom left no-repeat;}
#reg_succes{ background:#FFFFFF url(/inc_images/1/registration/pages/check.png) top left no-repeat; margin:5px; padding: 2px 0px 0px 25px;}
#reg_succes a {font-weight:bold; color:#009900;}

/* common classes */
a { color:#990000; text-decoration:none;}
a:hover { text-decoration:underline;}
a.underline { text-decoration: underline;}
h1 { font-size:24px; font-weight:bold; color:#c40101; margin:0 0 10px 0;}
h2 { font-size:16px; color:#c40101;}
h2 a { text-decoration:none;}
h2.article_subtitle { font-size:18px; font-weight:normal;}
h2.listingtitle {font-size:18px; font-weight:normal;}
h2.listingtitle a { color: #C40101; text-decoration:none;}

h3 { font-size:14px; color: #666;}
h3 a { color: #666; text-decoration:none;}
h3.cover {background:#ffffff url(../images_matrix/planet/redbox_full_bg.png) no-repeat; color:#ffffff; padding:5px;}

img { border:none;}
.align_left { float:left; margin: 0 20px 10px 0;}
.align_right { float:right; margin: 0 0 10px 20px;}
p { margin: 0 0 10px 0;}
p.right_align { text-align:right;}
.teaser_left { float:left; margin: 0 20px 10px 0;}
.greybox .teaser_left { border:1px solid #e2dfd6;}

/* GREYBOX: een lichtgrijze box met ronde hoeken; afhankelijk van de breedte van de kolom waar hij in zit, krijgt hij een andere breedte */
.greybox { width:700px; background:#efefe8 url(../images_matrix/planet/greybox_700.png) top left no-repeat; margin:0; position:relative; top:0; left:0; padding: 0 0 2px 0px;}
.greybox p.categorie { position:relative; top:6px; left:15px;}
.greybox_footer { width:700px; height:15px; background: url(../images_matrix/planet/greybox_700_footer.png) bottom left no-repeat;}

/* GREYBOX LAST PARA */
.greyboxPara { width:690px; background:#efefe8 url(../images_matrix/planet/greybox_700.png) top left no-repeat; margin:0; position:relative; top:0; left:0; padding: 0 0 2px 10px;}
.greyboxPara_footer { width:700px; height:15px; background: url(../images_matrix/planet/greybox_700_footer.png) bottom left no-repeat;}


#rightcol .greybox { width:210px; background:#efefe8 url(../images_matrix/planet/greybox_210.png) top left no-repeat;} /* greybox in rechterkolom van 210px */
#rightcol .greybox_footer { width:210px;  background:url(../images_matrix/planet/greybox_210_footer.png) bottom left no-repeat;}

.colorbox_padding { padding:15px 15px 0px 15px; } /* padding voor greybox en redbox */
.colorbox_padding_small { padding:8px 15px 0px 15px; position:relative;} /* kleinere padding voor bijvoorbeeld de bookmark-ikoontjes op de articlepage */


.mainshop_left .greybox, .mainshop_right .greybox { width:340px; background:#efefe8 url(../images_matrix/planet/greybox_340.png) top left no-repeat;} /* greybox in rechterkolom van 210px */
.mainshop_left .greybox_footer, .mainshop_right .greybox_footer { width:340px;  background:url(../images_matrix/planet/greybox_340_footer.png) bottom left no-repeat;}

/* ROUNDEDIMAGEBOX: deze dient om ronde hoekjes bovenop de images te zetten  */
.roundedimagebox { width:120px; height:100px; position:relative; float:left; margin:0 10px 0 0;}
.roundedimagebox img { position:absolute; left:0px; top:0px; z-index:20; border:0;}
.roundedimagebox_big { width:260px; height:129px; position:relative; float:left; margin:0 10px 0 0;}
.roundedimagebox_big img { position:absolute; left:0px; top:0px; z-index:20; border:0;}
.roundedimage_overlay { width:120px; height:100px; position:absolute; top:0; left:0; background: url(../images_matrix/planet/roundedimage_overlay_white.png) no-repeat; z-index:30;}
.roundedimage_overlay_grey { width:120px; height:100px; position:absolute; top:0; left:0; background: url(../images_matrix/planet/roundedimage_overlay_grey_border.png) no-repeat; z-index:30;}
.roundedimage_overlay_grey_big { width:260px; height:130px; position:absolute; top:0; left:0; background: url(../images_matrix/planet/roundedimage_overlay_grey_big.png) no-repeat; z-index:30;}
.greybox .roundedimage_overlay { width:120px; height:100px; position:absolute; top:0; left:0; background: url(../images_matrix/planet/roundedimage_overlay_grey.png) no-repeat; z-index:30; cursor:pointer;} /* als de image zich in een greybox bevindt, moet hij grijze hoekjes hebben in plaats van wit */

/* LISTS */
ul { list-style: none; margin:0 0 0 10px;}
ol { margin:0 0 0 10px;}
ul li { padding:0 0 4px 10px; margin: 0px; background: url(../images_matrix/planet/bullet.gif) no-repeat; background-position: 0px 6px;}
ul a { color:#333; text-decoration:none;} /* links in lists are black and not underlined */


.infoblock { width:380px; float:left;}
.infoblock ul { margin:10px 0 0 10px;}
.infoblock ul li { margin: 0 0 5px 5px; padding:0 0 4px 15px}

/* TOPNAVIGATION */
#navigation { width:909px; background:url(../images_matrix/planet/navigation_bg.png) no-repeat; position:absolute; top:138px; left:56px;}
#navigation ul { position:relative; top:0; left:10px;} /* duw navigatie-items naar rechts om het geheel te centreren */
#navigation ul li {margin:0; padding:0 0 0 2px; float:left;display:block; background: url(../images_matrix/planet/navigation_divider.png) top left no-repeat; height:25px;}
#navigation ul li a { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; line-height:25px; font-weight:bold; color:#666; display:block;  padding:0 12px; text-decoration:none; margin:0;} /* gebruik de padding om de navigatie-items uit te vullen, dit wil zeggen: meer spatie tussen de items voorzien */
#navigation ul li a.current { background:#f9dc1e url(../images_matrix/planet/button_highlighted_bg.png) repeat-x; }
#navigation ul li a:hover { background:#f9dc1e url(../images_matrix/planet/button_highlighted_bg.png) repeat-x;}

/* RIGHTNAVIGATION */
#rightnav ul {	list-style-type:none; text-align:left; font-size:11px;	padding:0;	margin:0 0 0 1px;}
#rightnav ul li {	border-top:1px solid #fff;	list-style-image: none;	padding:0;	margin:0; background:none; margin:0; padding:0}
#rightnav ul li a { font-family:Arial, Helvetica, Verdana, sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:2px; font-weight:bold; color:#888; display: block; padding:4px 25px 4px 30px;    text-decoration:none;   }    
#rightnav ul li a:hover { background:#f9dc1e; color:#fff;}
#rightnav ul li a.current { color:#f9dc1e; background:#e1e9ef;}
#rightnav ul li a.current:hover { color:#fff; background:#4e89bd;}
.langselect { padding:10px 10px 0 10px; text-align:right;}

#kalender, #previews, #voorwaarden {display:none;}
#kalender ul li a, #previews ul li a, #voorwaarden ul li a { font-size:10px; letter-spacing:0px; font-weight:normal; color:#888; display: block; padding:4px 20px 4px 45px;    text-decoration:none;   }
#kalender ul li a:hover, #previews ul li a:hover, #voorwaarden ul li a:hover { background:#666666; color:#fff;}
#kalender ul li a.current, #previews ul li a.current, #voorwaarden ul li a.current { color:#f9dc1e; background:#666666;}
#kalender ul li a.hover, #previews ul li a.hover, #voorwaarden ul li a.hover { color:#000000; background:#666666;}

/* CLEARS AND DIVIDERS */
.clear { clear:both;}
.clear5 { clear:both; height:5px;}
.clear10 { clear:both; height:10px;}
.clear15 { clear:both; height:15px;}
.clear20 { clear:both; height:20px;}
.clear30 { clear:both; height:30px;} /* deze clears kan je gebruiken in plaats van breaks */
.dashedline { border-bottom:1px dashed #e8e8dd;} /* stippellijn */
.greybox .dashedline { border-bottom:1px dashed #000;  } /* in een grijze box is de stippellijn zwart */
.redbox .dashedline { border-bottom:1px dashed #fff; } /* in een rode box is de stippellijn wit */
.dottedline { border-bottom:1px dotted #0150a0;} /* stippellijn */

/* FLIPBOOK */
#flipbook { position:relative; width: 700px; height:495px; background:url(../images_matrix/planet/flipbook_bg.png) no-repeat; margin: 0 0 30px 0; background: url(../images_matrix/planet/flipbook_bg.png) no-repeat; }
.flipbook_pagebox { position:absolute; top: 0px; left:75px;  } /* dit is de div waar de pagina's inzitten, je kan hier de positie aanpassen om de pagina's te centreren er moet dan nog wel een correctie gebeuren op de 123-buttons onderaan */
.flipbook_overlay { display:block; width:554px; height:396px; background:url(../images_matrix/planet/flipbook_overlay_554.png) no-repeat; position:absolute; top:50px; left:0px; z-index:200}
.flipbook_overlay_cover { display:block; width:554px; height:396px; background:url(../images_matrix/planet/flipbook_overlay_cover_554.png) no-repeat; position:absolute; top:50px; left:1px; z-index:200}
.flipbook_left { width:256px; height:362px; position:absolute; top: 68px; left:19px;}
.flipbook_right { width:256px; height:362px; position:absolute; top: 68px; left:275px; }
.textblock { padding:15px; color:#333;  position:relative; z-index:300;  }
#flipbook .slideshow_title { font-size:14px; font-weight:bold; text-transform:uppercase; color:#333; padding: 15px; }
/*#flipbook div.loading {position:absolute;top:180px;left:240px;width:100px;text-align:center;color:white;}*/
#flipbook h1 {font-size:22px;font-weight:bold; color:#777; margin:0}
#flipbook #slide1, #flipbook #slide2, #flipbook #slide3, #flipbook #slide4, #flipbook #slide5, #flipbook #slide6, #flipbook #slide7, #flipbook #slide8 {position:absolute;top:0px;left:15px;z-index:50;width: 554px; height:495px;display:block;}
#flipbook a.toarticle { display:none; visibility:hidden; }
#flipbook a {color:#fff;}
#flipbook #slide1 img, #flipbook #slide2 img, #flipbook #slide3 img, #flipbook #slide4 img, #flipbook #slide5 img, #flipbook #slide6 img, #flipbook #slide7 img, #flipbook #slide8 img { z-index:199}
#flipbook #intro1, #flipbook #intro2, #flipbook #intro3, #flipbook #intro4, #flipbook #intro5, #flipbook #intro6, #flipbook #intro7, #flipbook #intro8 {display:none; visibility:hidden;}
#flipbook .navcontrols {position:absolute;top:10px;right:18px;width:275px;z-index:100; height:16px; line-height:16px; }
#flipbook a.slideprevious{float:right;width:22px;height:26px;display:block;background: url(../images_matrix/planet/contentcarrousel_button_previous.png) no-repeat;text-decoration:none; margin:0 0 0 20px;}
#flipbook a.slidenext{float:right;width:22px;height:26px;display:block;background: url(../images_matrix/planet/contentcarrousel_button_next.png) no-repeat;text-decoration:none;}
#flipbook a.slideplay{float:right;width:17px;height:26px;display:block;background: url(../images_matrix/planet/contentcarrousel_button_play.png) no-repeat;text-decoration:none;}
#flipbook a.slidepause{float:right;width:17px;height:26px;display:block;background: url(../images_matrix/planet/contentcarrousel_button_pause.png) no-repeat;text-decoration:none;}


#flipbook a.slideprevious2 { display:block; width:54px;height:66px; text-decoration:none; position:absolute; top:371px; left:21px; z-index:400; } /* ezelsoor links */
#flipbook a.slidenext2 { display:block; width:54px;height:66px; text-decoration:none; position:absolute; top:371px; left:488px; z-index:400; } /* ezelsoor clickable maken */
#flipbook a.slideprevious2:hover { background:url(../images_matrix/planet/flipbook_ezelsoor_left.png) no-repeat top left;  } /* hover op ezelsoor links */
#flipbook a.slidenext2:hover { background:url(../images_matrix/planet/flipbook_ezelsoor.png) no-repeat top left;  } /* hover op ezelsoor rechts */


#flipbook .nav123 {position:absolute; bottom:13px; left:15px;width:400px;z-index:100; height:16px; line-height:16px; }
#flipbook a.slide1, #flipbook a.slide2, #flipbook a.slide3, #flipbook a.slide4, #flipbook a.slide5, #flipbook a.slide6, #flipbook a.slide7, #flipbook a.slide8 {float:left;width:16px;height:16px;display:inline;text-decoration:none; margin: 0 0 0 10px; font-family:"Trebuchet MS", Verdana, Arial, sans-serif; font-size:11px; font-weight:bold; text-align:center; background:url(../images_matrix/planet/contentcarrousel_button.png) top left no-repeat;}
#flipbook a.slide1:hover, #flipbook a.slide2:hover, #flipbook a.slide3:hover, #flipbook a.slide4:hover, #flipbook a.slide5:hover, #flipbook a.slide6:hover, #flipbook a.slide7:hover, #flipbook a.slide8:hover {background-position: bottom;}
#flipbook a.slideprevious:hover, #flipbook a.slidenext:hover, #flipbook a.slideplay:hover, #flipbook a.slidepause:hover{background-position:0 -26px;}

#flipbook #slide1 a.activeslide1 {width:24px; height:24px; position:absolute;left:6px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png); }
#flipbook #slide2 a.activeslide2 {width:24px; height:24px; position:absolute;left:32px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide3 a.activeslide3 {width:24px; height:24px; position:absolute;left:58px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide4 a.activeslide4 {width:24px; height:24px; position:absolute;left:84px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide5 a.activeslide5 {width:24px; height:24px; position:absolute;left:110px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide6 a.activeslide6 {width:24px; height:24px; position:absolute;left:136px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide7 a.activeslide7 {width:24px; height:24px; position:absolute;left:162px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}
#flipbook #slide8 a.activeslide8 {width:24px; height:24px; position:absolute;left:188px;bottom:9px;background: url(../images_matrix/planet/contentcarrousel_button_active.png);}

#flipbook #readmore1, #flipbook #readmore2, #flipbook #readmore3, #flipbook #readmore4, #flipbook #readmore5, #flipbook #readmore6, #flipbook #readmore7, #flipbook #readmore8 {position:absolute;bottom:0px;right:20px;z-index:80; visibility:hidden; display:none }
#flipbook #readmore1 a, #flipbook #readmore2 a, #flipbook #readmore3 a, #flipbook #readmore4 a, #flipbook #readmore5 a, #flipbook #readmore6 a, #flipbook #readmore7 a, #flipbook #readmore8 a { color:#888; margin:10px 0 0 0; visibility:hidden; display:none }
#flipbook #readmore1 a:hover, #flipbook #readmore2 a:hover, #flipbook #readmore3 a:hover, #flipbook #readmore4 a:hover, #flipbook #readmore5 a:hover, #flipbook #readmore6 a:hover, #flipbook #readmore7 a:hover , #flipbook #readmore8 a:hover  { color:#29cf0e; }

/* OK ERROR WARING */
.TopError {color:#c40101; padding:2px; margin:2px auto; border: 1px solid #c40101; text-align:center;}
.TopError A {color:#c40101;}
.TopError A:HOVER {text-decoration:underline;}
.TopErrorB {color:#ffffff; font-weight:bold; padding:2px; margin:2px auto; border: 1px solid #c40101;text-align:center; background:#c40101;}
.TopErrorB A {color:#000000;}

.TopWarning {color:#d76500;padding:2px; margin:2px auto; border: 1px solid #d76500; text-align:center;}
.TopOK {color:#ffffff;font-weight:bold; padding:2px; margin:2px auto; border: 1px solid #c40101; text-align:center; background:#99d700; }

/* TABLE */
.tabel { width:680px; margin:0 0 0 7px;  }
.tabel table { border:1px solid #f9dc1e; font-size:11px; margin:0 }
.tabel table th { background:#f9dc1e; font-size:16px; font-weight:bold; color:#c40101; font-weight:bold; padding:5px 7px;  }
.tabel table td { border-top:1px solid #f9dc1e; padding:5px 7px; }
