/* -----------------------------------------------------------------
   default.css
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

   geleend van www.nrc.nl

   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

/* -----------------------------------------------------------------

/* -----------------------------------------------------------------
   fonts - dit moet later anders, beter:
   - http://www.fontsquirrel.com/fontface/generator
   - http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/
   - http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/   ---------------------------------------------------------------*/
@font-face {
	/* This declaration targets Internet Explorer */
	font-family: 'LexiconNo1romanbTxtRegular';
	src: url('../fonts/lexiconno1romanb-txt-webfont.eot') }

@font-face {
	/* This declaration targets everything else */
	font-family: 'LexiconNo1romanbTxtRegular';
	src: url(//:) format('no404'), url('/fonts/lexiconno1romanb-txt-webfont.woff') format('woff'), url('../fonts/lexiconno1romanb-txt-webfont.ttf') format('truetype'), url('../fonts/lexiconno1romanb-txt-webfont.svg#webfontdsR19xfj') format('svg');
	font-weight: normal;
	font-style: normal }

@font-face {
	/* This declaration targets Internet Explorer */
	font-family: 'LexiconNo1RomanETxtRegular';
	src: url('../fonts/lexiconno1romane-txt-webfont.eot') }

@font-face {
	/* This declaration targets everything else */
	font-family: 'LexiconNo1RomanETxtRegular';
	src: url(//:) format('no404'), url('/fonts/lexiconno1romane-txt-webfont.woff') format('woff'), url('../fonts/lexiconno1romane-txt-webfont.ttf') format('truetype'), url('../fonts/lexiconno1romane-txt-webfont.svg#webfont8UOMm38Z') format('svg');
	font-weight: normal;
	font-style: normal }

/* -----------------------------------------------------------------
   resets en basismateriaal
   ---------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0 }

body,
#header,
.header,
#footer,
.footer,
.aside,
.aside nav,
.nav,
article, .article,
h1, h2, h3, h4, h5, h6,
p,
ul, ol, li,
dl, dt, dd {
	margin: 0;
	padding: 0 }

h1, h2, h3, h4, h5, h6 {
	font-weight: normal }

a {
	text-decoration: none }
a:link,
a:visited {
	color: #039 }
a:hover {
	color: #008 }
a:active {
	color: #d30910 }

header,
footer,
aside,
nav,
article, .article {
	display: block }

img {
	display: block;
	border: none }



/* -----------------------------------------------------------------
   papierformaat (pft) en andere eigenschappen
   ---------------------------------------------------------------*/

#header,
.uitstekendekeus,      /* artikelpagina */
.vroeger,              /* archiefpagina*/
.ookleuk,
.commercieband {
	clear: both;
	position: relative;
	display: block;
	width: 980px;
	margin: 0 auto }

body.watskeburt,
body.watisnjouw,
body.boutitbout,
body.watmetjou {
	float: none;
	width: 100%;
	margin: 0 auto }



/* -----------------------------------------------------------------
   HTML-elementen
   ---------------------------------------------------------------*/

html {
	background: #efefef
}

body {
	margin: 0;
	font-family: georgia, serif;
	font-size: 14px;
	line-height: 21px;
	background: url(../images/bg.body.png) repeat-y center 0 }

h2 {
	clear: both }

h3 {
	font-size: 16px;
	line-height: 19px }

q {
	font-style: italic }



/* -----------------------------------------------------------------
   Fixing a hole where the rain gets in
   ---------------------------------------------------------------*/

.clear {
	clear: both }

.hidden {
	display: none }

.nobr {
	white-space: nowrap }



/* -----------------------------------------------------------------
   Footer
   ---------------------------------------------------------------*/

#footer {
	clear: both;
	position: relative;
	display: block;
	height: 600px;
	margin: 0 auto;
	overflow: hidden;
	color: #fff;
	background: #1c1c1c;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	width: 100% }
#footer-inner {
	margin: 0 auto;
	padding: 72px 0 0 115px;
	width: 885px }
#footer h4 {
	clear: left;
	padding: 40px 0 10px 0;
	font-family: georgia, serif;
	color: #ccc }
#footer a {
	color: #fff }
#footer a:hover {
	background-color: #666 }
#footer h2 {
	margin-bottom: 0;
	margin-left: -2px;
	font-family: georgia, serif;
	font-size: 18px;
	line-height: 24px;
	color: white }
ul#structure,
ul#structure ul {
	list-style-type: none;
	color: #fff }

#structure li {
	float: left;
	width: 220px;
	font-family: georgia, serif;
	color: #ccc;
	font-size: 14px;
	line-height: 24px }

.overnrc {
	display: block }

.volgnrc,
.nrcsites {
	clear: both;
	padding-top: 20px }

#footer em {
	color: #999 }

#footer .indent {
	margin: 0 0 0 36px }



/* -----------------------------------------------------------------
   standaardkleuren, vormen en fonts
   ---------------------------------------------------------------*/

.wikkel {
	position: relative;
	width: 980px;
	margin: 0 auto;
	padding: 0;
	padding-bottom: 24px;
	background: #fff }
/* op een beetje redelijk scherm ruimte om de pagina zekerstellen */
@media screen and (min-width: 1024px) {
	.wikkel {
		xborder-right: 22px solid #fff;
		xborder-left: 22px solid #fff }
}


/* time  - er is ook nog een tijd, die time langzaam maar zeker moet gaan vervangen */
.time {
	display: inline-table;
	float: left;
	margin: 4px 0 0 0;
	padding: 1px 3px 0 3px;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 15px;
	color: #fff;
	background: #d30910;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px }
a.time {
	color: #fff }

.eerste .time {
	margin: 8px 0 0 0 }

.blog .time {
	background: #399 }
.debat .time {
	background: #c69 }


/* secties en posttypes - de aanduiding in welke rubriek een pots staat, dus */
.sectie,
.posttype {
	display: block;
	margin: 5px 0 0 0;
	padding: 0 4px 0 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 13px;
	text-transform: uppercase;
	color: #999;
	background: transparent }

a.sectie:link,
a.sectie:visited {
	color: #999 }
a.sectie:hover,
a.sectie:active {
	color: #666 }

/* secties floaten in standaard/selectie */
.standaard .sectie,
.selectie .sectie,
.standaard .posttype,
.selectie .posttype {
	float: left }

/* ...en in het artikel op artikelpagina's */
#broodtekst .sectie,
#broodtekst .posttype {
	display: inline }

/* in en over watisnjouw zijn de kleuren anders, want namelijk een soort groen */
.watisnjouw a.sectie:link,
.watisnjouw a.sectie:visited {
	color: #993 }
.watisnjouw a.sectie:hover,
.watisnjouw a.sectie:active {
	color: #660 }

/* grijs herstellen in koppenrij onder watskeburt */
.watisnjouw .watskeburt a.sectie:link,
.watisnjouw .watskeburt a.sectie:visited {
	color: #999 }
.watisnjouw .watskeburt a.sectie:hover,
.watisnjouw .watskeburt a.sectie:active {
	color: #666 }

/* en ook op archiefpagina's doen we het iets anders */
body.archief .sectie,
body.archief .posttype {
	display: inline;
	float: none }

.archief a.posttype:link,
.archief a.posttype:visited {
	color: #660 }
.archief a.posttype:hover,
.archief a.posttype:active {
	color: #993 }



/* -----------------------------------------------------------------
   article
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       basislayout en -typografie, verbijzondert per section
   ---------------------------------------------------------------*/

.article {
	position: relative }

.article h1 {
	margin: 0 0 9px 0;
	font-size: 22px;
	line-height: 24px;
	color: #000 }

.artikel .article h1 {
	margin: 0 0 9px 0;
	font-size: 24px;
	line-height: 26px;
	color: #000 }


/* het bovenste artikel heeft een grotere kop */
.eerste.article h1 {
	font-size: 26px;
	line-height: 28px }

.watskeburt .selectie h1,
.watskeburt .selectie h2 {
	margin-left: 42px }

.watskeburt h1 a {
	color: #000 }

.article h2 {
	margin: 0;
	font-size: 22px;
	line-height: 26px }
.article h2 a {
	color: #000 }

.article p {
	margin: 18px 0 }

.article ul {
	margin: 0 0 0 15px;
	color: #333 }

.artikel .article #broodtekst h2 {
    display: block;
    position: relative;
    top: 12px;
    left: 0;
    margin: 0;
    padding: 9px 0 0 0;
    font-size: 19px;
    line-height: 23px }



/* -----------------------------------------------------------------
   section: watskeburt
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       ook bekend als snelle duiding bij het belangrijkste nieuws
   ---------------------------------------------------------------*/

.watskeburt {
	position: relative;
	float: left;
	display: block;
	width: 496px }

.watskeburt.brekend {
	float: none;
	width: 980px }

.watskeburt .article {
	width: 468px;
	margin: 6px 0 6px 0;
	padding: 12px;
	background: transparent }

.watskeburt .article:hover,
.watisnjouw .watskeburt .article:hover {
	background: #eee;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px }
/* overheersen */
body.watskeburt .uitstekendekeus .article:hover,
body.watisnjouw .uitstekendekeus .article:hover,
body.boutitbout .uitstekendekeus .article:hover,
body.watsmetjou .uitstekendekeus .article:hover {
	background: #fff }

.watskeburt .article img {
	margin: 6px 0 }

.artikel .uitstekendekeus {
	position: relative;
	float: left;
	margin: 16px 18px 0 0;
	width: 598px }

.artikel.watskeburt p {
	display: block;
	margin: 18px 0 }
.artikel.groot.nieuws p.eerste,
.artikel.nieuws p.eerste,
.artikel.watisnjouw p.eerste,
.artikel.watskeburt p.eerste {
	display: inline;
	margin: 18px 0 }

.artikel p.bijschrift,
.artikel.watskeburt .wp-caption-text,
.artikel .wp-caption-text {
	margin: 3px 0 24px 1px;
	padding: 0 0 2px 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 11.5px;
	line-height: 15px;
	color: #000 }
.artikel p.bijschrift {
	margin: 3px 0 24px 1px }


.artikel .author {
	top: 24px;
	position: relative;
	vertical-align: bottom }
.artikel .author img {
	float: left }
.artikel .author span {
	color: #666;
	bottom: 10px;
	margin-left: 5px;
	position: absolute }
.artikel .author span a {
	color: #000 }

.artikel .uitstekendekeus .article {
	position: relative;
	display: block;
	float: left;
	width: 586px;
	min-height: 240px;
	margin: 8px 0 0 0;
	padding: 12px 0 12px 12px }

.artikel .uitstekendekeus .article .aside {
	position: absolute;
	display: block;
	bottom: 0;
	width: 586px;
	background: #ccc }

.artikel .uitstekendekeus .aside {
	position: relative;
	display: block;
	width: 354px }

.artikel .ookleuk .watskeburt {
	position: relative;
	display: block;
	float: left;
	width: 490px }

.artikel .ookleuk .watisnjouw {
	position: relative;
	display: block;
	float: right;
	width: 490px }

.artikel .meta {
	float: right;
	display: block;
	width: 260px;
	margin: 0 0 0 24px;
	padding: 12px 20px;
	font-size: 13px;
	background: #eee;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px }

.artikel .meta.top {
	position: relative;
	right: 0px;
	height: 8px;
	margin: 14px 0 12px 24px;
	padding: 20px;
	font-size: 13px;
	font-family: georgia, sans-serif;
	text-transform: none }

.artikel .meta ul {
	list-style-type: none }

.artikel .watskeburt {
	float: left;
	width: 490px;
	margin: 0;
	padding: 20px 0 20px 0 }

.artikel section.watisnjouw {
	float: left;
	width: 444px;
	margin: 0 0 0 20px }

/* -----------------------------------------------------------------
   section: watisnjouw
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       voorheen ook wel bekend als: het beste van het web
   ---------------------------------------------------------------*/

.watisnjouw {
	float: right;
	margin: 0;
	position: relative;
	width: 468px;
	display: block }
.artikel .watisnjouw {
	background: #f4f4e2;
	margin-top: 20px;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px }

.watisnjouw_articles {
	background: #f4f4e2;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px }
.watisnjouw .article {
	width: 444px;
	margin: 0;
	padding: 26px 12px 12px 12px;
	background: transparent }
.watisnjouw .article:hover {
	background: #e5e5c5 }
.watisnjouw .weblogs .article:hover {
	background: #e1fafa }

.watisnjouw .koppen .volgnummer,
.watisnjouw .article .volgnummer {
	display: inline-table;
	position: relative;
	top: -15px;
	left: -2px;
	width: 34px;
	height: 34px;
	text-align: center;
	font-size: 13px;
	line-height: 32px;
	background: #993;
	border-radius: 48px;
	-moz-border-radius: 48px;
	-webkit-border-radius: 48px }
.watisnjouw .koppen a.volgnummer,
.watisnjouw .article a.volgnummer,
.watisnjouw .koppen a.volgnummer:visited,
.watisnjouw .article a.volgnummer:visited {
	color: #fff }

.watisnjouw h2 {
	margin: 0 0 6px 0 }

.watisnjouw a.posttype {
	padding: 0 3px 0 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	color: #993;
	text-transform: uppercase }
.watisnjouw a.posttype:link,
.watisnjouw a.posttype:visted {
	color: #993 }
.watisnjouw a.posttype:hover,
.watisnjouw a.posttype:active {
	color: #660 }

.watisnjouw .post {
	width: 390px;
	margin: -48px 0 0 50px;
	padding-bottom: 12px }

.watisnjouw .post img {
	margin: 0 0 6px 0 }

/* inbeeld-potsjes in watisnjouw zien er anders uit */
.watisnjouw .article.inbeeld {
	position: relative;
	width: 468px;
    margin: 0 0 12px 0;
    padding: 0 }
.watisnjouw .article.inbeeld:hover {
	background: transparent }

.inbeeld h2 {
	font-size: 22px;
	line-height: 26px;
	color: #fff;
	background: rgba(0, 0, 0, 0.6) }
.inbeeld h2 a {
	position: absolute;
	z-index: 666;
	display: block;
	width: 444px;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 7px 12px 8px 12px;
	color: #fff;
	background: rgba(0, 0, 0, 0.6) }
.inbeeld h2 a:hover {
	background: rgba(0, 0, 0, 0.7) }
.inbeeld h2 a .blogtitel {
	color: #cc6 }
.inbeeld h2 a .aantal {
	color: #666 }
.inbeeld h2 a .ganzenvoetje {
	font-size: 24px;
	color: #cc6 }

.inbeeld p {
	position: absolute;
	bottom: 0;
	margin: 0;
	padding: 6px 6px 8px 12px;
	font-size: 13px;
	line-height: 19px;
	color: #fff;
	background: rgba(0, 0, 0, 0.65); }

/* in de koppenrij... */
.inbeeld a h3 .blogtitel {
	color: #660 }

.watisnjouw .koppen .article.inbeeld {
    padding: 9px 12px 9px 10px }
.watisnjouw .koppen .article.inbeeld:hover {
	background: #e5e5c5 }

/* trefwoorden */

.kast h2 {
	color: #aaa }
.kast h2 .greep {
	color: #090 }

.kast {
	position: relative;
	clear: both;
	overflow: hidden;
	width: 765px;
	margin: 0 107px 0 0;
	padding: 0 0 0 96px }

.lade {
	display: block;
	float: left;
	height: 112px;
	width: 150px;
	margin: 0 3px 3px 0 }

.fotoblog .lade .datumstempel {
	position: absolute;
	z-index: 666;
	top: 21px;
	left: 12px;
	display: none;
	margin: 0;
	width: 60px }

.fotoblog .fotoarchief .lade h3 {
	display: none;
	position: absolute;
	width: 765px;
	height: 26px;
	top: 20px;
	left: 96px;
	padding: 10px 0 4px 0;
	font-size: 20px;
	line-height: 24px;
	color: #aaa;
	background: #fff }

.lade h3 .greep {
	color: #090 }

.archief .lade a:hover h3 {
	border-bottom: none }

.fotoblog .fotoarchief .lade a:hover h3,
.fotoblog .fotoarchief .lade a:hover .datumstempel {
	display: block }



.pijltjes {
	position: absolute;
	z-index: 666;
	top: 6px;
	left: 15px;
	width: 53px }
.pijltjes a {
	position: absolute;
	display: block;
	width: 25px;
	height: 25px }

.pijltjes a.op {
	left: 0 }
.pijltjes a.top,
.pijltjes a.neer {
	right: 0 }

.pijltjes a:link,
.pijltjes a:visited {
	background: transparent url(../images/rondje.25px.cccccc.png) no-repeat 0 0 }
.pijltjes a:hover,
.pijltjes a:active {
	background: transparent url(../images/rondje.25px.999999.png) no-repeat 0 0 }

/* -----------------------------------------------------------------
   archieven (lijstje)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       er is een weelde aan archieven beschikbraak
   ---------------------------------------------------------------*/

.lijstje {
	position: relative;
	float: left;
	margin: 12px 24px 36px 12px;
	width: 580px;
	min-height: 360px }

.lijstje h1 {
	margin: 12px 0 14px 0;
	font-size: 26px;
	line-height: 28px }

.lijstje h2 {
	margin: 0 0 4px 84px;
	font-family: arial, helvetica, sans-serif;
	font-size: 14px;
	line-height: 28px;
	text-transform: uppercase }

.lijstje h3 {
	font-size: 14px;
	display: inline }

.lijstje h3 .volgnummer {
	color: #660 }

.lijstje dl {
	display: block;
	float: left;
	margin: -6px 0 24px 0 }

.lijstje dt {
	display: block;
	clear: left;
	width: 60px;
	margin: 4px 24px 0 12px }

.lijstje dd {
	display: block;
	float: left;
	width: 480px;
	margin: -22px 0 4px 84px }



/* -----------------------------------------------------------------
   archieven (linkjes)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       archieflinkjes ogen en kleuren overal ongeveer hetzelfde
   ---------------------------------------------------------------*/

.archief h3 {
	display: inline;
	font-size: 14px }

.archief a:link h3,
.archief a:visited h3 {
	color: #000 }
.archief a:hover h3 {
	color: #008;
	border-bottom: 1px dotted #ccf  }
.archief a:active h3 {
	color: #d30910 }

.archief a .ganzenvoetje {
	margin: 0 0 0 2px;
	font-size: 18px;
	line-height: 19px; /* even groot als de h3 om de titel */
	color: #d30910 }

/* beste-van-het-web-potsjes een beetje anders laten ogen */
.beste-van-het-web a:link .ganzenvoetje,
.beste-van-het-web a:visited .ganzenvoetje {
	color: #993 }
.beste-van-het-web a:hover .ganzenvoetje,
.beste-van-het-web a:active .ganzenvoetje {
	color: #660 }

/* volgnummers op archiefpagina's een beetje anders laten ogen */
.archief .lijstje a:hover h3 .volgnummer,
.archief .lijstje a:active h3 .volgnummer {
	border-bottom: 1px solid #fff }



/* -----------------------------------------------------------------
   elementen
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
       vormvaste elementen die steeds hergebruikt worden
   ---------------------------------------------------------------*/

/* dressing bij een still uit een filmpje */
.still {
	display: block;
	position: relative }

.still p.caption {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0px }
.watskeburt .still p.caption {
	height: 263px;
	width: 468px }
.watisnjouw .still p.caption {
	height: 114px;
	width: 404px }

.still .speelduur {
	display: none }
.still:hover .speelduur {
	display: block;
	position: absolute;
	left: 4px;
	bottom: 4px;
	height: 20px;
	padding: 1px 6px;
	font-family: arial, helvetica, sans-serif;
	font-size: 11px;
	line-height: 22px;
	color: rgba(255, 255, 255, 0.9);
	text-transform: uppercase;
	text-align: center;
	background: rgba(0, 0, 0, 0.6);
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px }

/* knop voor een filmpje */
.filmpje .still p.caption {
	background: transparent url(../images/overlay.speelfilmpje.png) no-repeat 50% 50% }
.filmpje .still:hover p.caption {
	background: transparent url(../images/overlay.speelfilmpje.mo.png) no-repeat 50% 50% }

/* knop voor plaatjes */
.beeld .still p.caption {
	background: transparent url(../images/overlay.toonbeeld.png) no-repeat 50% 50% }
.beeld .still:hover p.caption {
	background: transparent url(../images/overlay.toonbeeld.mo.png) no-repeat 50% 50% }
.beeld img {
	max-width: 580px }


/* leesverder-tekstlink, is soms ook alleen een ganzenvoetje */
.leesverder {
	padding: 2px 2px 1px 3px;
	text-transform: uppercase;
	color: #d30910;
	background: #fcc;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px }
.koppen .leesverder,
.column .leesverder,
.weblogs .leesverder,
.blog .leesverder {
	display: inline;
	background: none }
a.leesverder {
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 12px;
	color: #d30910 }

a.leesverder:hover {
	color: #fff;
	background: #d30910 }
.watisnjouw a.leesverder {
	color: #fff;
	background: #bb6 }
.watisnjouw a.leesverder:hover {
	background: #993 }

.date-archive {
	margin-top: 1px }
.koppen .date-archive {
	display: block;
	margin-top: 1px }

a.leesverder .ganzenvoetje {
	font-family: Georgia, serif;
	font-size: 15px;
	line-height: 11px }

.weblog a.leesverder {
	color: #cc0000;
	background: none }


/* tijd (in bijv. (archief)lijstjes) */
.tijd {
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	text-transform: uppercase;
	background: transparent }
.tijd a:link,
.tijd a:visited {
	color: #666 }
.tijd a:hover {
	color: #333 }
.tijd a:active {
	color: #d30910 }


/* labels */
.label {
	position: relative;
	display: table;
	z-index: 1000;
	height: 16px;
	margin: 0 0 12px 0;
	padding: 4px 10px 4px 20px;
	font-size: 14px;
	line-height: 16px;
	font-family: arial, helvetica, sans-serif;
	color: #fff;
	background: #d30910 url(../images/label_red.png) no-repeat;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	-moz-border-radius-topright: 4px;
	-moz-border-radius-bottomright: 4px;
	-webkit-border-top-right-radius: 4px;
	-webkit-border-bottom-right-radius: 4px }

.artikel.watisnjouw .label {
	background: #993 url(../images/label_green.png) no-repeat }
.artikel .watskeburt .label {
	background: #d30910 url(../images/label_red.png) no-repeat }

.label span {
	font-weight: normal }
.label.green {
	position: relative;
	left: -12px;
	background: #999933 url(../images/label_green.png) no-repeat }
.label.grey {
	background: #ccc url(../images/label_grey.png) no-repeat }
.label.black {
	background: #000 url(../images/label_black.png) no-repeat }
.label a {
	color: #fff }

.koppen .artikel .label { /* meer ruimte voor labels op .artikel-pagina's */
	margin: 0 0 12px 0 }

  /* -----------------------------------------------------------------
     Liefde is... samen de krant lezen
     ---------------------------------------------------------------*/

  /* tags  */
  .tags {
  	margin: 18px 0;
  	padding: 6px 6px 4px 0;
  	font-family: arial, helvetica, sans-serif;
  	text-transform: uppercase;
  	text-align: right;
  	font-size: 11px;
  	line-height: 15px;
  	color: #666 }
  .tags dt,
  .tags dd {
  	display: inline;
  	list-style-type: none;
  	margin: 0;
  	padding: 0 3px 0 0 }
  .tags dd:after {
  	content: ", " }
  .tags dd:last-child:after {
  	content: "" }

/* nieuwe media verhoudt zich tot papier als sociale media tot ... */
ul.socialemedia { /* 'ul' is hier echt nodig om de marge te definieren */
	margin: 0 0 12px 0;
	padding: 0 }
.socialemedia li {
	position: relative;
	display: inline-block;
	list-style-type: none;
	margin: 0;
	padding: 0 }

.socialemedia li.twitter,
.socialemedia li.facebook {
	border: none;
	background: transparent }
.socialemedia li.twitter {
	padding: 0 0 1px 0 }
.socialemedia li.facebook {
	top: 1px }

blockquote {
	margin: 18px 0 24px 18px;
	padding: 0 0 0 16px;
	background: url(../images/bq-left.png) no-repeat }
blockquote p {
	background: #f1f1f1;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;

   padding: 18px 24px 12px }
blockquote h2 {
	background: #f1f1f1;
	padding: 10px 20px;
	border-radius: 10px 10px 0 0;
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0}
blockquote p:last-child	 {
	padding-bottom: 18px }
.article blockquote p {
	display: block }
.watskeburt.artikel blockquote p,
.article blockquote p,
.entrytekst blockquote p {
	margin: -12px 0 -12px 0 }



/* bij de premiums van vanderkwast is het soms wat apart */
#vanderkwast h1 a:link,
#vanderkwast h1 a:visited {
	color: #111 }
#vanderkwast h1 a:hover {
	color: #033 }
#vanderkwast h1 a:active {
	color: #033 }



/* gebeurtenis */
.gebeurtenis {
	display: block;
	position: relative;
	z-index: 20;
	height: 230px;
	margin-bottom: 1px;
	background: #eee;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px }

.gebeurtenis .beeldmerk {
	position: absolute;
	display: inline;
	top: -30px;
	left: -24px }

.gebeurtenis .article {
	padding: 0;
	margin: 0 }
.watisnjouw .gebeurtenis .article:hover {
	background: transparent }

.gebeurtenis .content {
	float: left;
	width: 360px;
	margin-top: 10px;
	margin-left: 96px }
.gebeurtenis .content p {
	display: block;
	margin: -4px 4px -1px 0;
	line-height: 18px }
.gebeurtenis .content a:link,
.gebeurtenis .content a:visited {
	color: #333 }
.gebeurtenis .content a:hover {
	color: #039 }
.gebeurtenis .content a:active {
	color: #d30910 }

.gebeurtenis .article h2 {
	display: block;
	width: 360px;
	margin: 2px 0 6px 0;
	padding: 0;
	font-family: arial, helvetica, sans-serif;
	font-weight: normal;
	font-size: 15px;
	text-transform: uppercase;
	color: #d30910 }

.gebeurtenis .article h2 a {
	color: #d30910 }

.gebeurtenis .tagline {
	display: block;
	margin: 6px 0 12px 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 14px;
	color: #d30910;
	text-transform: uppercase }
.gebeurtenis .content .leesverder {
	display: inline;
	margin: 0 0 0 3px;
	color: #d30910;
	background: transparent }
.gebeurtenis .content a.leesverder:hover,
.gebeurtenis .content a.leesverder:active {
	background: #d8d4be }


.home .fotoserie .bijschrift {
	margin: 0 0 18px 0;
	padding: 8px 8px 6px 8px;
	font-family: arial, helvetica, sans-serif;
	background: #000 }
.home .fotoserie .bijschrift h3,
.home .fotoserie .bijschrift p {
	margin: 0;
	padding: 0;
	font-size: 12px;
	line-height: 16px;
	color: #fff }
.home .fotoserie .bijschrift h3 {
	font-weight: bold }
.home .fotoserie .bijschrift .fotocredit {
	color: #ccc }



/* --------------------------------------------------------------
	de 'pagina'
---------------------------------------------------------------*/

body.pagina .article {
	margin: 60px 12px 0 12px;
	padding-bottom: 24px;
  width: 568px }

body.pagina .article ul,
body.pagina .article ol {
	margin: 0 0 0 24px }

body.pagina .article h1 {
	clear: both;
	margin-bottom: 18px }

body.pagina .article h2 {
	margin: 18px 0 6px 0;
	font-size: 18px }

body.pagina .article p {
	margin: 18px 0;
	display: block }



/* voor de lists in weblogs.nrc.nl */
#content ul,
#content ol {
    color: #333;
    margin: 0 0 0 34px }

#content li {
    margin: 0 0 18px 0 }


/* youp */
.youp h1 {
	position: relative;
	width: 450px;
	z-index: 1;
	margin: -2px -12px 6px;
	padding: 2px 10px;
	font-size: 28px;
	line-height: 32px;
	color: #c36 }

.youp a:hover h1 {
    color: #c36 }

.youp h2 {
    color: #999;
    display: inline;
    font-family: arial, helvetica, sans-serif;
    font-size: 12px;
    line-height: 18px;
    text-transform: uppercase }

/* TBD: OPRUIMEN! */
.youp .reacties {
	display: none }

.watskeburt .youp:hover {
	background: #ffe6f2; /* lichtpaarsig */
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px }

.youp .leesverder,
.youp a:hover .leesverder {
    color: #c36 }


/* thuiskok en ik */
.watskeburt .thuiskok a:hover h1,
.watskeburt .ik a:hover h1  {
	color: #033 }
.blog.ik h1 {
	z-index: 1;
	width: 450px;
	margin: -2px -12px 6px -12px;
	padding: 2px 10px;
	font-size: 28px;
	line-height: 32px }
.blog.ik a:hover h1 {
	color: #033 }



.more-best-link {
	background: #e5e5c5;
	-moz-border-radius: 8px 8px 8px 8px;
	color: #000000;
    font: 13px arial, helvetica, sans-serif;
    height: 25px;
    margin: 24px 12px 12px 12px;
    text-indent: 0;
	float: right;
	text-align: right;
	width: 424px }
.watisnjouw .more-best-link.koppen {
	padding: 10px 10px 0px 10px }
.watisnjouw .more-best-link.koppen a {
	color: #000 }



/* -----------------------------------------------------------------
   Vormgeving voor de weblogs
   ---------------------------------------------------------------*/

#midden {
	position: relative;
	padding: 0 0 96px 0 }

.boutitbout  {
	float: left;
	width: 584px;
	margin: 16px 32px 0 12px }

.column .article,
.weblog .article {
	position: relative;
	width: 484px;
	margin: 0 0 32px 0;
	padding: 9px 12px 9px 96px }

.column a.leesverder {
	color: #d30910;
	background: transparent }
.column a.leesverder .ganzenvoetje {
	color: #d30910 }
.column a.leesverder:hover,
.column a.leesverder:active {
	background: #f6e0e0 }

.column a.sectie,
.column a.posttype,
.weblog a.sectie,
.weblog a.posttype  {
	position: relative;
	display: inline;
	bottom: 1px;
	line-height: 18px }

.column .datumstempel,
.weblog .datumstempel {
	position: relative;
	float: left;
	width: 60px;
	margin: -10px 0 0 -84px }
.column .datumstempel a,
.weblog .datumstempel a {
	display: inline-table;
	padding: 4px 3px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px }
.column .datumstempel a:hover,
.column .datumstempel a:active {
	background: #ccd6d6 }

.column h1 a,
.column h1 a:link,
.column h1 a:active,
.weblog h1 a,
.weblog h1 a:link,
.weblog h1 a:active {
	color: #000 }

/* op de homepage van een blog of column iets anders */
.column.home .datumstempel,
.weblog.home .datumstempel {
	margin: -21px 0 0 -84px }

/* tweaks voor potspagina's */
.artikel.column .uitstekendekeus .article,
.artikel.weblog .uitstekendekeus .article {
	width: 484px;
	left: 0;
	margin: 10px 0 0 36px;
	padding: 0 }

.column .uitstekendekeus .datumstempel,
.weblog .uitstekendekeus .datumstempel {
	width: 48px;
	margin: 3px 0 0 12px }


/* -----------------------------------------------------------------
   Aside - sidebar bij blogs en columns
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

	de jeugd van tegenwoordig:
    - voorjekijkendorlopen: about this blog
    - metcrown: about this author

   ---------------------------------------------------------------*/

.aside {
/*	position: absolute; */
	overflow: hidden;
	width: 352px;
	padding-top: 32px;
	right: 12px;
	font-size: 13px;
	line-height: 21px }
.home .aside {
	padding-top: 12px }
.artikel.nieuws .aside {
	padding-top: 4px }

.aside h2 {
	float: none }

.aside dl {
	display: block }
.aside dt {
	display: block;
	clear: left;
	width: 56px;
	margin: 4px 0 0 0;
	line-height: 20px }
.aside dd {
	display: block;
	float: left;
	width: 278px;
	margin: -21px 0 4px 58px;
	padding: 0;
	line-height: 19px }

/* krantenbak-artikelen highlighten met groen streepje */
.retentie dd.paid a {
	display: inline-block;
	width: 100%;
	padding-left: 3px;
	border-left: 3px solid #62A441;
	margin-left: -6px; }

.aside ul {
	margin: 4px 0 0 0 }
.aside ul ul {
	margin: 0 }

/* op archiefpagina's */
.archief .aside {
	padding: 14px 0 0 0 }


/* over dit blog, deze auteur */
.aside .voorjekijkendoorlopen,
.aside .auteursinfo {
	width: 316px;
	margin: 0 12px 0 0;
	padding: 15px 18px;
	background: #ddd;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px }

.aside .archief {
	clear: both;
	width: 336px;
	margin: 0 12px 0 6px;
	padding: 15px 8px }

.aside h2 {
	float: none;
	margin-left: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 14px;
	line-height: 24px;
	text-transform: uppercase;
	letter-spacing: .03em;
	color: #000 }

.aside .voorjekijkendoorlopen h2,
.aside .auteursinfo h2 {
	/* om twitter- en rss-icoontjes vloeiend te positioneren */
	float: left }

.aside .archief h3 {
	display: inline;
	font-size: 14px;
	line-height: 19px }
.aside .archief a:link h3,
.aside .archief a:visited h3 {
	color: #000 }
.aside .archief a:hover h3 {
	color: #008 }
.aside .archief a:active h3 {
	color: #d30910 }

.aside .voorjekijkendoorlopen p,
.aside .auteursinfo p {
	clear: both }

.aside .rss,
.aside .twitter {
	display: inline;
	float: left;
	margin: 3px 0 0 6px }


/* specifiek over deze auteur...
	(constructie met fotootje achter tekstpaneel) */
.aside .metcrown {
	position: relative;
	margin: 0 0 12px 0 }
.aside .metcrown .auteursfoto {
	position: absolute;
	bottom: 0;
	right: 0 }
.aside .metcrown .auteursinfo {
	position: absolute;
	z-index: 1000;
	bottom: 0;
	margin: 0;
	background: rgba(204, 204, 204, .8);
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px }


/*.aside .time {
	width: 50px;
	margin: 2px 0 0 0;
	padding: 2px 3px 1px 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	text-transform: uppercase;
	background: transparent }

.aside .archief a .ganzenvoetje {
	margin: 0 0 0 2px;
	font-size: 18px;
	line-height: 19px;
	color: #d30910 }
*/



/* uitzonder- en verbijzonderingen in sidebars - - - - - - - - - - - - - -*/

/* weblogpaneeltjes zijn groenig */
.weblog .aside .metcrown .auteursinfo {
	background: rgba(220, 216, 192, .8) }
.weblog .aside .voorjekijkendoorlopen {
	background: #d1cdb7 }
.home.weblog .aside .voorjekijkendoorlopen {
	background: #e6e5d3 }

/* paneeltjes bij columns zijn rose */
.column .aside .metcrown .auteursinfo {
	background: #f7e4e4 }
.column .aside .voorjekijkendoorlopen {
	background: #faefef }

/* op naar compact staan er hoge foto's met een vaste hoogte achter dit paneeltje */
#naarcompact .aside .metcrown {
	height: 430px }



/* -----------------------------------------------------------------
   de bladeraar helpt je naar het vorige of volgende potsje of
   archief te bladeren,
   ---------------------------------------------------------------*/

ul.bladeren {
	position: relative;
	display: block;
	width: 580px }
.bladeren li {
	list-style-type: none;
	width: 288px }
.bladeren .prev {
	text-align: left;
	float: left; }
.bladeren .next {
	float: right;
	text-align: right }

.bladeren a {
	display: block;
	min-height: 60px;
	padding: 9px 15px;
	border: none;
	background: #eee }
.bladeren a:hover {
	background: #ddd }
.bladeren .prev a {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px }
.bladeren .next a {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px }

/* placeholder als er geen link is */
.bladeren .empty {
	display: block;
	float: left;
	width: 259px;
	min-height: 60px;
	margin: 0 3px 0 0;
	padding: 9px 15px;
	border: none;
	background: #eee;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px }

/* afwijkingen voor columns en weblogs */
body.column .bladeren .next a,
body.weblog .bladeren .next a {
	margin-top: -78px }

/* kleurafwijkingen voor weblogs */
body.weblog .bladeren a {
	background: #edede0 }
body.weblog .bladeren a:hover {
	background: #e6e5d3 }

/* kleurafwijkingen voor columns */
body.column .bladeren a {
	background: #faefef }
body.column .bladeren a:hover {
	background: #f7e4e4 }

/* positioneringsuitzonderingen voor artikelpagina's */
body.artikel .bladeren {
	margin: 32px 0 32px -84px }

/* positioneringsuitzonderingen voor archiefpagina's */
body.archief .bladeren {
	float: left;
	margin: 32px 0 }

/* -----------------------------------------------------------------
   kalender in sidebar
   ---------------------------------------------------------------*/

#calendar {
	margin-left: 18px }

#calendar li ul li {
	list-style: none;
	margin-left: 18px;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	color: #999 }

#calendar li ul li a:link,
#calendar li ul li a:visited {
	color: #000 }
#calendar li ul li a:hover {
	color: #008;
	border-bottom: 1px dotted #ccf }
#calendar li ul li a:active {
	color: #d30910 }



/* -----------------------------------------------------------------
   structuurwijzigingen weblogs en columns
   ---------------------------------------------------------------*/

.weblog .boutitbout,
.column .boutitbout {
	margin-left: 0 }

.article ol {
	margin-left: 20px }

/* -----------------------------------------------------------------
   speciaal voor vorige
   ---------------------------------------------------------------*/

.pag {
  clear: left;
}

/* --
	more like this
	--*/


.uitsmijter a {
    color: #666666;
    cursor: pointer;
}

.aside .uitsmijter {
    text-align: right;
}
.uitsmijter {
    color: #666666;
    font-family: arial,helvetica,sans-serif;
    font-size: 10px;
    text-transform: uppercase;
}