tool
/*
    Document   : article.css
    Created on : 28-nov-2012, 10:19:02
    Author     : yuna
    Description:
        Styling of the article page. This extends on main.css
*/

/* BASIC STRUCTURE */
section.heading{ 
	position: fixed; 
}

section.heading .wrap{
	width: 770px;
}

section.content{
	/*overflow: visible;*/
	min-height: 400px;
	right: auto;
	width: 100%;
	min-width: 768px;
}

section.content:after{
	content: "";
	display: block;
	clear: both;
}

#slide_container{
	width: 768px;
	left: 50%;
	margin-left: -384px;
	position: absolute;
}

section.content .wrap{
	width: 768px;
	position: absolute;
	left: 0;
}


/* HEADER */
section.heading a.to_playlist{ /* link back to playlist slides */
	display: block;
	float: left;
}
section.heading a.to_playlist img{
	border: 0;
}

/* title of the current playlist */
section.heading header.playlist a{
	text-decoration: none;
	padding: 9px 10px;
	display: block;
	width: 550px;
	float: left;
}

section.heading header.playlist img{
	border: 1px solid #ddd;
	float: left;
	width: 25px;
	height: 25px;
}

section.heading header h2{
	font-size: 14px;
	color: #bbb;
	font-weight: normal;
	margin: 0;
	padding: 3px 9px;
	float: left;
}
section.heading header h2 span.playlist_author{
	font-style: italic;
}


/* SLIDE NAVIGATION (previous/next article) */
.slide_nav_prev, .slide_nav_next{
	margin-top: -25px;
	left: 50%;
}
.slide_nav_prev { margin-left: -420px; }
.slide_nav_next { margin-left: 390px; }


/* ARTICLE CONTENT */
section.content{
	padding-bottom: 60px;
}

section.content article{
	background-color: white;
	margin-top: 40px;
	padding-top: 80px;
	padding-bottom: 10px;
	position: relative;
	font-size: 14px;
}

section.content article:after{
	content: '';
	display: block;
	clear: both;
}

/*	different font-sizes for article. Headers are defined relative to these 
	values, so they will scale too. */
section.content article.fontsize-small{
	font-size: 12px;
}
section.content article.fontsize-normal{
	font-size: 14px;
}
section.content article.fontsize-big{
	font-size: 16px;
}
section.content article.fontsize-huge{
	font-size: 18px;
}



/* TOOLBOX: bookmartk, rate, share, etc */
section.content article .tools{
	position: fixed;
	margin-left: 728px;
	margin-top: -80px;
	background: white;
	z-index: 5;
}
section.content article .tools a{
	display: block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	margin-bottom: 1px;
	overflow: hidden;
	background-color: #6e7f8d;
	text-decoration: none;
}

section.content article .tools .tool {
	text-indent: 100px;
}

section.content article .tools a.plus{
	background: #6e7f8d url('../img/btn_plus.png') center center no-repeat;
}
section.content article .tools a.bookmark{
	background: #6e7f8d url('../img/btn_bookmark.png') center center no-repeat;
}
section.content article .tools a.share{
	background: #6e7f8d url('../img/btn_share.png') center center no-repeat;
}
section.content article .tools a.font_size{
	background: #6e7f8d url('../img/btn_font_size.png') center center no-repeat;
}

section.content article .tools a.channel{
	background: #6e7f8d url('../img/btn_channel.png') center center no-repeat;
}

section.content article .tools .tools_sub_layer.channel a {
	text-indent: 15px;	
}

section.content article .tools .tools_sub_layer.channel a:hover {
	background-color: #586671;
}

section.content article .tools .tools_sub_layer.channel a.active{
	background: #cc0000;
}

section.content article .tools a.inactive{
	background-color: #63707b;
}



section.content article .tools a.active{
	background-color: #cc0000;
}
section.content article .tools a:hover{
	background-color: #63707b;
}
section.content article .tools a.active:hover{
	background-color: #bb0000;
}

section.content article .tools_main_layer{
	position: relative;
}
section.content article .tools_sub_layer{
	display: none;
	position: absolute;
	right: 48px;
	top: -5px;
	width: 200px;
	z-index: 10;
}
section.content article .tools_sub_layer a{
	color: white;
	background-color: #cc0000;
	width: 220px;
	margin-bottom: 0px;
	/* todo: get these borders right */
	border-top: 1px solid #d53233;
	border-bottom: 1px solid #a40003;
	float: right;
	text-decoration: none;
}

section.content article .tools_sub_layer.channel a{
	background-color: #6e7f8d;
	border-top: 1px solid #8b99a4;
	border-bottom: 1px solid #586671;
}

section.content article .tools_sub_layer a.probeer_gratis{
	background: #cc0000 url("../img/btn_create.png") 15px center no-repeat;
}

section.content article .tools_sub_layer a:hover{
	background-color: #d53233;
}

.tools_sub_layer .arrow_side {
	position: absolute;
	width: 7px;
	height: 14px;

	right: -7px;
	top: 15px;
	background: url(../img/bg_arrow_red_right.png) top right no-repeat;
}

	.tools_sub_layer.channel .arrow_side {
	background: url(../img/bg_arrow_gray_right.png) top right no-repeat;
}


/*share icons*/
.tools_sub_layer a span.icon{
	height: 100%;
	display: inline-block;
	float: left;
	width: 50px;
}

.tools_sub_layer a span.icon{
	background-position: center center;
	background-repeat: no-repeat;
}

.tools_sub_layer a.facebook span.icon		{ background-image: url(../img/icon_share_facebook.png); }
.tools_sub_layer a.twitter span.icon		{ background-image: url(../img/icon_share_twitter.png); }
.tools_sub_layer a.googleplus span.icon	{ background-image: url(../img/icon_share_googleplus.png); }
.tools_sub_layer a.linkedin span.icon		{ background-image: url(../img/icon_share_linkedin.png); }
.tools_sub_layer a.tellafriend span.icon	{ background-image: url(../img/icon_share_tellafriend.png); }

.tooltip{
	display: block;
	position: absolute;
	z-index: 9;
	width: 200px;
	background-color: #6e7f8d; 
	color: #fff;
	text-align: left;
}
.tooltip_right{
	left: -208px;
	text-indent: 0;
	padding: 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	line-height: 150%;
}

.tooltip_right .arrow_side{
	position: absolute;
	width: 7px;
	height: 14px;
	background: blue;
	right: -7px;
	top: 17px;
	background: url(../img/bg_arrow_right_6e7f8d.png) top left no-repeat;
}




/* ARTICLE MARKUP */

article header h1{
	color: #313131;
	font-family: "Open Sans Condensed", Sans-Serif;
	font-style: normal;
	font-weight: bold;
	font-size: 240%;
	padding: 0;
	margin: 0 95px;
}
article header h2{
	color: #313131;
	font-family: "Open Sans Condensed", Sans-Serif;
	font-style: normal;
	font-weight: bold;
	font-size: 160%;
	padding: 0;
	margin: 0 95px;
}

/* sub titles of the article */
article section.sub_headers{
	margin-top: 30px;
}
article section.sub_headers h2{
	font-size: 130%;
}
article section.sub_headers h3{
	font-size: 130%;
	color: #999;
	margin: 5px 0;
}

/*	This footer is displayed underneith the header having information about 
	publisher and author */
article footer{
	margin: 10px 95px 0;
	border-top: 1px solid #D6D6D6;
	border-bottom: 1px solid #D6D6D6;
	position: relative;
	padding: 10px 10px 10px 140px
}
article footer .publisher_logo{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
}

article footer .publisher_logo a {
	display: inline-block;
	float: left;
	position: relative;
	top: 0;
	left: 0;
	padding: 0px;
	line-height: 1px;
	width: 130px;
	height: 100%;
	text-align: center;
}

article footer .publisher_logo img {
	border: 0;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	max-height: 50px;
	ax-width: 110px;
	max-width: 113px; /* 113px ipv 110px omdat sommige logo's lelijk werden verschaald. hopelijk lost deze maat dat probleem op*/
}

/* containing text of footer (publisher, author)*/
article footer .article_info {} 

article footer .article_info p{	
	color: #7E7E7E;
	margin: 0;
	line-height: 20px;
}

article footer .article_info a{
	color: #7E7E7E;
	text-decoration: none;
}

div.share_buttons{
	padding: 0px 95px;
	text-align: left;
	background-color: white;
}

/* markup of the body of the article */
article section{
	margin: 15px 95px;
	/* clear: both;  /* edited by jurjen - volgens mij onnodig */
	display: block;
}

article h2 {
    font-family: "Open Sans Condensed",Sans-Serif;
    font-size: 140%;
    font-weight: bold;
    margin: 5px 0;
}

article h3{
	font-family: "Open Sans Condensed", Sans-Serif;
	font-weight: bold;
	font-size: 140%;
	margin: 5px 0;
}

article h4{
	font-family: "Open Sans Condensed", Sans-Serif;
	font-weight: bold;
	font-size: 120%;
	margin: 3px 0;
}

article p{
	margin: 1em 0;
}

article section.body  a {
	display: inline-block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: bottom; /* Alignment fix for firefox and IE */
}

article section.abstract{
	font-weight: 600;
	font-style: italic;
}

article section.intro p{
	font-weight: 600;
}

article blockquote{
	padding-left: 40px;
	background: transparent url('../img/bg_quote.png') 0px 10px no-repeat;
	color: #999;
	margin: 15px 0;
	display: inline-block;
	min-height: 35px;
}

article blockquote h2,
article blockquote h3{
	margin: 0;
}

article aside{
	margin: 15px 0px;
	background-color: #dfdfdf;
	padding: 20px;
	display: block; /*	ipv inline-block, om ervoor te zorgen dat kaderteksten 
						artikelbreed worden. als dit voor andere asides niet 
						wenselijk is moet er een uitzondering komen */
	clear: left;
}

article aside:after{
	display: block;
	content: '';
	clear: both;
}

article aside h1{
	margin: 0px;
	font-size: 24px;
}

/* markers */
/* todo: how solid is this method? */
article span[style="background-color: #1a3346;"],
article span[style="background-color: #c40000;"],
article span[style="background-color: rgb(26, 51, 70);"],
article span[style="background-color: rgb(196, 0, 0);"]
{
	color: white;
}




/* IMAGES */

article figure{
	margin: 20px 0;
	/*PL: clear: both eruit gehaald, anders ging de animatie in de caroufredsel niet goed. Om toch te laten clearen, de :after hieronder toegevoegd. Niet goed kunnen testen omdat niet zeker is waarom de clear: both erin zat.*/
}
/*	JV: De clear in figure stond er waarschijnlijk in om dat bij een smalle afbeelding, gevolgd door een brede de box
	van deze brede box al boven de kleine afbeelding begint (omdat deze ernaast float, alleen past de afbeelding er
	niet naast). Clear weer toegevoegd op image_large, met uitzondering van de carousel (slider). De :after weg 
	gehaald omdat die volgens mij niet nodig is. */

article figure.image_large{
	clear: both;
}
article div.slider figure.image_large{
	clear: none;
}

/*article figure:after{
	display: block;
	clear: both;
	content: "";
}*/

article figure a,
article figure a:focus,
article figure a:hover,
article figure a:active,
article figure a:visited
{
	text-decoration: none;
	border: none;
	border-color: fuchsia;
}

article figure a img
{
	text-decoration: none;
	border: 0;
}


article figure.image_large div{ /* full column image */
	margin: 0;
	position: relative;
	line-height: 0;
	border: 1px solid #888;
	width: 100%

}

article figure.image_large div img{
	order: 1px solid #888;
	max-width: 100%;
	
}

article aside figure.image_large div{ /* full column image */
	idth: 100%
}

article aside figure.image_large figcaption{ /* full column image */
	idth: 100%
}


article aside figure.image_large div img{ /* full column image */
	width: 100%;

}

/* half column image */
article figure.image_small{ 
	margin: 10px 20px 10px 0;
	float: left;
	clear: right;
}

article figure.image_small.left{ 
	margin: 10px 20px 10px 0;
	float: left;
	clear: right;
}
article figure.image_small.right{
	margin: 10px 0px 10px 20px;
	float: right;
	clear: left;
}
article figure.image_small div{
	position: relative;
	border: 1px solid #888;
	line-height: 0;
	width: 270px;
}
/* link to open large image (lightbox) */
article figure a.zoom_image span{
	position: absolute;
	bottom: 0;
	right: 0;
	width: 27px;
	height: 28px;
	line-height: 26px;
	text-indent: 30px;
	overflow: hidden;
	background: black url('../img/btn_zoom.gif') center center no-repeat;
}

/* caption under image */
article figure figcaption{
	color: #cc0000;
	font-size: 13px;
}
article figure.image_large figcaption{
	idth: 580px;
}
article figure.image_single figcaption .caption{
	border: 0;
	line-height: 3ex;
}
article figure.image_single figcaption .data{
	display: none;
}
article figure.image_small figcaption{
	width: 270px;
}

article figure.left{
	float: left;
}
article figure.right{
	float: right;
}


article section.image_preview {
	background-color: #DFDFDF;

	text-align: center;
	position: relative;
}

article section.image_preview img {
	margin-top: 15px;
	margin-bottom: 12px;
}


article section.image_preview .label_preview {
position: absolute;
	display: block;
	background-color: #454545;
	background-color: rgba(69,69,69,0.83);
	width: 100%;
	color: #fff;
	font-size: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	top: 94px;

}



/* CAROUSEL */
article section.carousel{
	position: relative;
	overflow: hidden;
	background-color: #dfdfdf;
	margin-bottom: 5px;
}
article section.carousel figure{
	float: left;
	display: block;
	width: 580px;
	height: 100%;
	margin: 0;
	position: relative;
	text-align: center;
}
/*	this div will have an inline height in pixels that is equal to the largest
	image height of images in the carousel. This way the carousel keeps a 
	constant height and we can center align the image in this box */
article section.carousel figure div{
	border: 0;
	position: absolute;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
article section.carousel figure div a{
	display: inline-block;
	position: relative;
}

article section.carousel .carousel_navigation{
	position: absolute;
	top: 50%;
	margin-top: -20px;
	width: 100%;
}

article section.carousel .carousel_navigation a{
	float: left;
	width: 16px;
	height: 62px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	color: white;
	opacity: 0.4;
	background-color: #6f6f6f;
	background-position: 8px 15px;
	background-repeat: no-repeat;
	padding: 0px 15px 0px 0px;
}

article section.carousel figcaption {
	background: #C22A29;	
	display: inline-block;
	position: absolute;
	left: 0;
	top: 0;
	width: auto;
	height: auto;	
	
}

article section.carousel figcaption .data {
	position: relative;
	color: #fff;
	left: 0;
	top: 0;
	text-align: left;
	padding: 10px 15px 10px 19px;
	background: #C22A29;
	width: 100%; /* full width carousel */
	line-height: 140%;
	display: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
article section.carousel figcaption .data span{
	display: block;
}

article section.carousel a.info {
	position: absolute;
	top: 0;
	left: 0;
	background: #C22A29;
	color: #fff;
	width: 17px;
	height: 17px;
	line-height: 17px;
	text-align: center;
	font-family: georgia;
	font-style: italic;
	font-weight: bold;
	font-size: 11px;
}

article section.carousel .carousel_navigation{
	display: none;
}
article section.carousel:hover .carousel_navigation{
	display: block;
}

article section.carousel a.carousel_navigation_next{
	float: right;
	background-image: url(../img/next-page.png);
}

article section.carousel a.carousel_navigation_prev{
	background-image: url(../img/previous-page.png);
}

article section.carousel a.inactive,
article section.carousel a.disabled {
	display: none!important;
}

article section.carousel .carousel_navigation a:hover{
	opacity: 0.9;
}

#carousel_pagination {
	text-align: center;
}

#carousel_pagination a{
	background: #6E7F8D;
	border-radius: 10px 10px 10px 10px;
	verflow: hidden;
	text-decoration: none;
	display: inline-block;
	height: 9px;
	width: 9px;
	margin: 5px;
}

#carousel_pagination a span{
	display: none;	
}

#carousel_pagination a.selected{
	background: #cc0000;
}




/* FULL SCREEN CAROUSEL */
div.carousel_fullscreen{
	position: fixed;
	z-index: 12;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: #0C1921;
}
div.carousel_fullscreen a.button_close{
	position: absolute;
	right: 0;
	top: 0;
	/*width: 23px;*/
	padding-right: 23px;
	height: 23px;
	overflow: hidden;
	text-indent: 7px;
	line-height: 22px;
	background: #CB0003 url('../img/btn_close.png') top right no-repeat;
	z-index: 13;
	color: white;
	text-decoration: none;
}
div.carousel_fullscreen figure{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 140px; /* height of the footer bar and some extra space*/
	margin: 0;
	text-align: center;
	padding-top: 2%;
}
div.carousel_fullscreen.single_image figure{
	bottom: 40px;
}
div.carousel_fullscreen figure img{ 
	max-width: 90%;
	max-height: 90%;
}
div.carousel_fullscreen figure figcaption{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 23px;
	height: 23px;
	background-color: #CB0003;
}
div.carousel_fullscreen figure figcaption a{
	color: white;
	text-decoration: none;
	font-weight: bold;
	font-style: italic;
	font-family: Times New Roman, Serif;
	font-size: 18px;
	display: block;
	width: 23px;
	height: 23px;
}
div.carousel_fullscreen figure figcaption div{
	display: none;
	width: 300px;
	position: absolute;
	color: white;
	padding: 10px;
	background-color: #CB0003;
	text-align: left;
}
div.carousel_fullscreen figure figcaption div span{
	display: block;
}
div.carousel_fullscreen div.footer{
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 130px;
	overflow: hidden;
	text-align: center;
}
div.carousel_fullscreen.single_image div.footer{
	height: 30px;
}
div.carousel_fullscreen div.footer ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
div.carousel_fullscreen.single_image ul{
	display: none;
}
div.carousel_fullscreen div.footer ul li{
	display: block;
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 10px;
}
div.carousel_fullscreen div.footer ul li a{
	display: block;
	width: 100px;
	height: 100px;
}
div.carousel_fullscreen div.footer ul li a{
	border: 1px solid transparent;
}
div.carousel_fullscreen div.footer ul li a.selected{
	border: 1px solid #CB0003;
}
div.carousel_fullscreen .carouselScroller{
	margin: 0 10px;
	position: relative;
	overflow: hidden;
	height: 105px;
}
div.carousel_fullscreen .carouselScroller ul{
	position: absolute;
	left: 0;
}
div.carousel_fullscreen .carouselScroller .fullscreenCarouselPrev{
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	height: 102px;
	background: rgba(7,14,20,0.2) url('../img/scrollprevious.png') center center no-repeat;
}
div.carousel_fullscreen .carouselScroller .fullscreenCarouselNext{
	position: absolute;
	right: 0;
	top: 0;
	width: 30px;
	height: 102px;
	background: rgba(7,14,20,0.2) url('../img/scrollnext.png') center center no-repeat;
}

div.carousel_fullscreen div.footer .controls{
	clear: both;
}
div.carousel_fullscreen div.footer .controls a{
	background-color: #CB0003;
	line-height: 14px;
	margin-left: 1px;
	display: inline-block;
	color: white;
	text-decoration: none;
	padding: 2px 15px 4px 30px;
	background-position: 5px center;
	background-repeat: no-repeat; 
	

}
div.carousel_fullscreen.single_image .controls a.play_pause{
	display: none;
}

div.carousel_fullscreen div.footer .controls a.close{ background-image: url(../img/icon_close.png); }
div.carousel_fullscreen div.footer .controls a.scale{ background-image: url(../img/icon_scale.png); }
div.carousel_fullscreen div.footer .controls a.play{ background-image: url(../img/icon_play.png); }
div.carousel_fullscreen div.footer .controls a.pause{ background-image: url(../img/icon_pause.png); }





/* SECTION ACCESS: Login etc */
section.article_access{
	background: white;
	padding: 40px 95px;
	padding-top: 0px; /* jk */
}
section.article_access .info{
	float: right;
}
section.article_access .item_info div{
	height: auto;
	z-index: 6;
}
/* more styling of .item_info in main.css */

section.article_access .account{
	border: 1px solid #ddd;
	clear: both;
	padding: 15px;
}
section.article_access .account h2{
	border-bottom: 1px solid #ddd;
}
section.article_access .account .login{
	border-right: 1px solid #ddd;
	margin-left: -1px;
}
a.link_recover_pass{
	font-size: 12px;
	margin-left: 10px;
}

div.continueReading{
	background-color: #6E808E;
	padding: 20px;
	position: relative;
}
div.continueReading:after{
	content: '';
	display: block;
	position: absolute;
	top: 0px;
	left: 50%;
	border: 16px solid white;
	border-color: white transparent transparent transparent;
	margin-left: -16px;
}

div.continueReading h2{
	margin: 0px;
	color: white;
	text-align: center;
	font-size: 34px;	
	font-weight: 500;
}

div.continueReading p{
	color: white;
	font-style: italic;
	text-align: center;
}

div.continueReading .btn_green{
	width: 130px;	/* plus 45px padding makes 175px total width */
	margin-left: -88px;
	position: relative;
	left: 50%;
	text-align: center;
	box-shadow: 2px 2px 9px #555;
	padding-left: 30px;
}
div.continueReading .btn_green:before{
	content: '';
	height: 100%;
	width: 20px;
	background: transparent url('../img/btn_create.png') left center no-repeat;
	display: inline-block;
	position: absolute;
	left: 10px;
}

div.account h3{
	font-size: 20px;
	font-weight: 600;
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;
}

div.logos{
	margin-top: 10px;
}

/* COMMENTS */
section.comments{
	padding: 40px 95px;
	background-color: white;
}
/*reacties*/
.reply_head {
	border-bottom: 1px solid #D6D6D6;
	border-top: 1px solid #D6D6D6;
	padding: 7px 0px;
	font-size: 13px;
}

.reply_head .reply_toggle {
	float: right;
	color: #cb0003;
	cursor: pointer;
}

.reply_head .reply_toggle span {
	background: url(../img/bg_reply_toggle.gif) center right no-repeat;
	width: 7px;
	height: 10px;
	display: inline-block;
	margin-left: 5px;
	
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s;
}

.reply_head .reply_toggle.active span {
	-webkit-transform: rotate(-180deg);
	-moz-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-ms-transform:rotate(-180deg);
	transform: rotate(-180deg);
}

.reply_box {
	background-color: #dfdfdf;
	padding: 9px;
	display: none;
	font-size: 13px;
}

.reply_box p { margin-top: 0px; }

.reply_box p a { color: #CB0003; }

.reply_box img {
	width: 50px;
	height: 50px;
	float: left;
}

.reply_box .textareaContainer { padding-left: 60px; }

.reply_box textarea {
	float: right;
	width: 100%;
	height: 52px;
	border: 1px solid #d6d6d6;
	padding: 5px;
	font-family: 'Open Sans';
	color: #7a7a7a;
	font-size: 13px;
	margin: -1px;
	margin-bottom: 8px;
	resize: none;	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

a.btn_post {
	color: #fff;
	background: #cb0003;
	padding: 3px 6px;
	font-size: 14px;
	text-decoration: none;
	float: right;
}




/* RELATED */
aside.related{
	padding: 40px 95px;
	background-color: white;
	margin-top: 25px;
}


/* MESSAGES & NOTIFICATIONS */

/* loading message when going next/prev with ajax */
article.message p{
	text-align: center;
	font-size: 170%;
	margin: 0 95px;
}

@media screen and (max-width: 820px){
	.slide_nav_prev { margin-left: -385px; }
	.slide_nav_next { margin-left: 355px; }
}	


a.breakHref{
	top: -100px;
	position: relative;
}


/* Artikel van het jaar */

article img.avhj {
	padding: 0;
	margin: 0 95px;
	border: none;
}

#article-28024  img.avhj
{ display: none;}