/* Html, Css - Timothy van Sas */

@font-face {
    font-family: 'PopStarAutographRegular';
    src: url('fonts/popstarautograph-webfont.eot');
    src: url('fonts/popstarautograph-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/popstarautograph-webfont.woff') format('woff'),
         url('fonts/popstarautograph-webfont.ttf') format('truetype'),
         url('fonts/popstarautograph-webfont.svg#PopStarAutographRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Testtype4Medium';
    src: url('fonts/testtype4-webfont.eot');
    src: url('fonts/testtype4-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/testtype4-webfont.woff') format('woff'),
         url('fonts/testtype4-webfont.ttf') format('truetype'),
         url('fonts/testtype4-webfont.svg#Testtype4Medium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@media all {
* {margin:0;padding:0;} 
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; } ul { list-style:none; } blockquote,q { quotes:none; } :focus { outline:0; }ins { text-decoration:none; }del { text-decoration:line-through; }table { border-collapse:collapse; border-spacing:0; } .inline li,.inline dd,.inline dt { display:inline; }
article, aside, section, nav, header { display: block }
/* Globals */
body { font: normal 14px arial; background: url(img/bg/bg-body.png) 0 0 repeat-x; color: #666 }
a, a:visited { color: #1471ad; text-decoration: underline }
a:hover, a:visited:hover { color: #ff3399 }
.clear:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
*:first-child+html .clear { zoom: 1; } /* IE7 */
.grey-bar ul li, nav ul li, .thumb-list li, .pager li, .breadcrumbs li, .socials-content li, .comments dt, .comments dd { display: inline }
.set-bg { background: url(img/bg/bg-schaar.png) top center no-repeat }
a.cta-pink, a.cta-pink:visited, a.cta-grey, a.cta-grey:visited, a.dark-cta-grey, a.dark-cta-grey:visited { display: inline-block; background: #ff3399; text-decoration: none; color: #fff; padding: 10px 20px }
a.cta-grey, a.cta-grey:visited { background: #ccc; color: #666 }
a.dark-cta-grey, a.dark-cta-grey:visited, .all-messages a.cta-pink, .all-messages a.cta-pink:visited { background: #333; color: #fff }
a.dark-cta-grey:hover, a.dark-cta-grey:visited:hover, .all-messages a.cta-pink:hover, .all-messages a.cta-pink:visited:hover { background: #f39 }
a.cta-pink:hover, a.cta-pink:visited:hover, a.cta-grey:hover, a.cta-grey:visited:hover, .frm-comments button:hover { background: #333; color: #fff }
.highlight-new, nav ul li.home a span, .zo-trouwen .heart, .new-articles article em, #slides a.prev, #slides a.next, .social-line, .zo-trouwen .hopeloos, .boek, .hart-small, .nieuwste-adresjes, .badge, .in-love, a.count-comments, .page-scroller li.next-msg, .page-scroller li.prev-msg, .comments dt a, .grey-bar ul li.home a span, .cupcake-doormat, .copycat, .boekje, .cupcake-list li, .holy, h2.set-header, .worthy, .wow, .camera, .thumb-list li a em, p.wowtxt span.handwr  { background: url(img/globals/sprite-arnhemsmeisje.png) 0 0 no-repeat }
p { line-height: 140%; padding-bottom: 17px }
.set-right { float: right; margin-left: 20px }

/* More Sites */
.grey-bar { background: #333; display: block; clear: both }
	.grey-bar ul { width: 979px; margin: 0 auto; border-left: 1px solid #666 }
	.grey-bar li a { display: block; float: left; color: #ccc; text-decoration: none; border-right: 1px solid #666; padding: 15px }
	.grey-bar li a:hover, .grey-bar li a:visited:hover { background: #fff; color: #ff3399 }
	.grey-bar li.current a, .grey-bar li.current a:visited, .grey-bar li.current a:hover, .grey-bar li.current a:visited:hover { font-weight: bold; color: #fff; background: none }

/* Header */
header { height: 70px }
	header img { float: left; margin-top: 30px }
	header span { display: block; float: right; font-family: 'PopStarAutographRegular', Arial, sans-serif; font-size: 26px; font-weight: normal; margin: 25px 20px 0 0 }
	nav { margin: 0 20px 0 20px; display: block; clear: both; border-top: 20px solid #fff }
		nav ul { background: #ff3399 }
			nav ul li a, nav ul li a:visited { display: block; float: left; font-size: 16px; color: #fff; text-decoration: none; border-right: 1px solid #ff99cc; padding: 20px }
			nav ul li a:hover, nav ul li a:visited:hover { color: #fff; background: #333 }
			nav ul li.home a span, .grey-bar ul li.home a span { display: block; width: 20px; height: 18px; background-position: -94px 0; overflow: hidden; text-indent: -999px }
			.grey-bar ul li.home a:hover span { background-position: -94px -19px }
			nav ul li.current-menu-parent a, nav ul li.current-menu-item a { background: #333 }
	.socials { display: block; height: 40px; background: url(img/bg/bg-krassen.png) top right no-repeat; margin: 0 20px 20px 0; position: relative }
		.socials .twitter { position: absolute; right: 15px; top: 10px; width: 160px; overflow: hidden }
		.facebook { width: 85px; position: absolute; left: 680px; top: 10px; }


/* Content */
.wrapper { width: 980px; margin: 0 auto; background: #fff; }
.new-articles { position: relative; margin-bottom: 45px }
	.highlight-new { position: absolute; left: 55px; top: -45px; overflow: hidden; display: block; width: 93px; height: 37px; text-indent: -999px }
	.new-articles article, .all-messages article, .related article { display: block; overflow: hidden; width: 300px; height: 230px; float: left; margin: 0 0 0 20px; position: relative }
		.new-articles article span, .all-messages article span, .related article span { position: absolute; left: 0; bottom: 0; display: block; width: 280px; background: url(img/bg/bg-article-span.png) 0 0 repeat; padding: 10px; font-size: 16px; color: #fff }
		.new-articles article a, .all-messages article a, .related article a { text-decoration: none }
		.all-messages article { width: 220px; height: 180px; margin: 0 0 20px 20px }
		.related article { width: 180px; height: 180px; margin: 0 0 20px 20px }
		.new-articles article img, .all-messages article img, .related article img { height: auto; min-height: 100%; width: 100%; }
		.all-messages article span { width: 200px }
		.related article span { width: 160px }
		.related h2 { display: block; clear: both; padding-bottom: 10px; color: #666!important }
			.related h2 span { color: #f39 }
		.all-messages article.first-article, .related article.first-article { margin: 0 0 20px 0 }
		.new-articles article.article-hover, .thumb-list li a:hover, .all-messages article.article-hover, .related article.article-hover { -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.6); box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.6) }
	.all-messages article.jij-idee { width: 460px }		

.teasers { position: relative }
	.idea { width: 300px; padding-right: 20px; margin-left: 20px; float: left }
		.idea p, .zo-trouwen article p, .split-left p, .split-right p { padding: 5px 0 10px 0 }
		.wrapper h2, .doormat h3, aside h3 { font-family: 'Testtype4Medium', Arial, sans-serif; font-weight: normal; font-size: 20px }
		.teasers .zo-trouwen h2, .split-left h2, .all-messages h2, .small-split h3 { color: #ff3399 }
		#content .all-messages h2 { color: #666 }
		.zo-trouwen { float: left; width: 620px; position: relative }
			.zo-trouwen .heart { display: block; width: 77px; height: 60px; overflow: hidden; text-indent: -999px; background-position: -119px 0; position: absolute; left: 345px; top: 0; z-index: 1; }
			.zo-trouwen .hopeloos { display: block; width: 136px; height: 52px; overflow: hidden; text-indent: -999px; background-position: -204px 0; position: absolute; left: 425px; top: -25px }
			.zo-trouwen article { width: 180px; padding-right: 10px; float: left }
			.thumb-list { width: 430px; float: left; margin-top: 33px }
			.thumb-list li a { display: block; float: left; width: 100px; height: 90px; overflow: hidden; margin-right: 10px }
				.thumb-list li.last-thumb a { margin-right: 0; }
		.small-split { position: relative }
			/*.boekje { display: block; overflow: hidden; width: 34px; height: 38px; background-position: -340px -134px; text-indent: -999px; position: absolute; left: 160px; top: -100px }*/
				
.split-content { padding: 60px 0 0 0 }
	.split-left, .split-right { width: 460px; display: block; float: left; margin-left: 20px; position: relative }
		h2.set-header { width: 316px; height: 28px; background-position: 0 -72px; overflow: hidden; text-indent: -999px; margin-bottom: 6px }
		aside h2.set-header { width: 300px }
		.split-right img { float: right; margin: 0 0 20px 20px }
		.worthy { position: absolute; width: 113px; height: 56px; display: block; overflow: hidden; text-indent: -999px; position: absolute; left: 150px; top: -55px; background-position: -345px 0 }
	.cupcake-list { padding-top: 10px }
	.cupcake-list li { padding: 0 0 10px 40px; display: block; background-position: -568px 2px }
		.cupcake-list em { display: block; font-style: normal; font-size: 12px; color: #bbb; padding-top: 5px }

.pager { text-align: center; display: block; clear: both }
	.pager li a { text-decoration: none; color: #999 }
	.pager li.current a { font-weight: bold; color: #333 }

.breadcrumbs { padding-left: 20px }
.breadcrumbs li, .breadcrumbs li a { text-decoration: none; color: #bbb }
	.breadcrumbs li a { background: url(img/bg/bullet-kruimel.png) right 5px no-repeat; padding-right: 15px; margin-right: 4px }

#slides { position: relative; margin: 20px 0; height: 630px; width: 940px }

.slides_container { width: 940px; display: none }
	.slides_container div { width: 940px; height: 630px; display: block; overflow: hidden; background: url(img/bg/loader.gif) 50% 50% no-repeat }
	.slides_container div img { height: auto; width: 100%; }
	#slides a.prev { z-index: 30; display: block; overflow: hidden; text-indent: -999px; width: 100px; height: 100px; position: absolute; left: 0; top: 217px; background-position: -311px -388px }
		#slides a.prev:hover { background-position: -412px -388px }	
	#slides a.next { z-index: 30; display: block; overflow: hidden; text-indent: -999px; width: 100px; height: 100px; position: absolute; right: 0; top: 217px; background-position: -311px -489px }
		#slides a.next:hover { background-position: -412px -489px }	
	.caption { display: block; position: absolute; left: 0; bottom: 0; color: #fff; background: #ccc; z-index: 30; width: 900px; font-family: 'PopStarAutographRegular', Arial, sans-serif; font-size: 60px; font-weight: normal; padding: 20px 20px 10px 20px; background: url(img/bg/bg-black.png) 0 0 repeat }
		
.slideshow { display: block; width: 940px; height: 630px; overflow: hidden; margin: 20px 0 }
	.slider-info { padding-bottom: 40px }
	.slider-info ul { float: right; margin-left: 40px }
	.slider-info em { font-style: normal; padding-left: 20px }

.wrap-content { padding: 0 20px; padding-bottom: 40px }

	.content-left { display: block; width: 580px; float: left; margin-right: 60px; padding-bottom: 40px }
		#content h1 { font-family: 'Testtype4Medium', Arial, sans-serif; font-weight: normal; font-size: 42px; color: #ff3399; margin-left: 20px; padding-bottom: 20px }
		.content-left h2 { color: #f39 }
		.img-wide { margin-bottom: 20px; display: block; clear: both }
		.socials-content { width: 114px; float: right; position: relative; margin: 0 0 50px 40px }
			.socials-content ul, .page-actions ul, .slider-info ul { height: 62px }
				.socials-content li, .page-actions li, .slider-info li { width: 49px; height: 62px; float: left; overflow: hidden }
				.socials-content li.tweet, .page-actions li.tweet, .slider-info li.tweet { width: 55px; margin-left: 10px }
		.social-line { display: block; overflow: hidden; text-indent: -999px; width: 165px; height: 15px; position: absolute; left: -15px; bottom: -30px; background-position: -204px -201px }
		.page-actions { display: block; height: 90px; margin-bottom: 40px; background: url(img/bg/bg-page-actions.png) 0 0 no-repeat; position: relative }
			.page-actions ul { padding: 20px 0 0 20px }
			.page-actions .cta-pink { position: absolute; right: 20px; top: 20px }
		.comments { position: absolute; right: 230px; top: 25px }
		.comments dt, .comments dd { display: block; float: left }
			.comments dt a, a.count-comments { width: 26px; height: 20px; font-size: 12px; padding-top: 6px; background-position: -499px -52px; font-weight: bold; text-decoration: none; color: #fff; display: block; text-align: center }
			.comments dd { padding: 5px 0 0 10px; color: #f39 }
		.page-scroller { padding-bottom: 20px }
		.page-scroller li { display: block; float: left; width: 250px }
			.page-scroller li em { display: block; font-style: normal; color: #a0a0a0; padding-bottom: 5px }
			.page-scroller li a { text-decoration: none; color: #f39 }
			.page-scroller li.next-msg { text-align: right; padding: 10px 40px 10px 0; background-position: right -233px }
			.page-scroller li.prev-msg { background-position: -581px -95px; padding: 10px 0 10px 40px }
			.page-scroller li.scroll-hover { cursor: pointer; background-color: #ebebeb }
	
	.reader-comments article { padding: 20px 0 20px 80px; position: relative; min-height: 100px; height: auto !important; height: 100px; overflow: visible; background: url(img/bg/bg-dashed.png) left bottom repeat-x }
		.reader-comments article figure { display: block; width: 60px; height: 60px; overflow: hidden; position: absolute; left: 0; top: 23px }
		.reader-comments article em { font-style: normal; position: absolute; right: 0; top: 21px; color: #bbb }
		.whos-talking { padding-bottom: 10px }
			.whos-talking strong { color: #f39 }
		.title-react { background: url(img/bg/bg-dashed.png) left bottom repeat-x; padding-bottom: 20px; margin-bottom: 10px; position: relative }
			.title-react a.cta-grey { padding: 5px 10px; position: absolute; right: 0; bottom: -10px }
		a.count-comments { display: inline-block; float: left; margin-right: 10px }
		.frm-comments { background: url(img/bg/bg-dashed.png) left bottom repeat-x; padding: 20px 0 40px 0 }
		.frm-comments h2 { color: #666; padding-bottom: 30px }
		.frm-comments label { display: block; float: left; width: 150px }
		.frm-comments input { padding: 4px; width: 200px; margin-bottom: 20px }
		.frm-comments textarea { padding: 4px; width: 400px; height: 100px }
		.frm-comments button { border: none; background: #ccc; color: #666; padding: 10px 20px; font-weight: bold; margin: 20px 0 0 150px; cursor: pointer }
	
	.three-blocks { padding: 60px 20px 40px 20px }
		.three-blocks article { width: 300px; float: left; padding: 0 }
		.three-blocks .middle { margin: 0 20px }
		.three-blocks .trouwen-zo h2, .lucky-girl .trouwen-zo h3 { color: #f39 }
			
	aside { display: block; width: 300px; float: left; padding-bottom: 40px }
		.wie { float: right; margin: 5px 0 10px 20px }
		aside article { margin-bottom: 20px }
		aside h3 { padding-bottom: 10px }
			.trouwen-zo { padding: 20px 0 0 0; position: relative }
				.lucky-girl .trouwen-zo { padding: 0; margin-bottom: 40px }
				.trouwen-zo ul { padding-bottom: 20px }
				.trouwen-zo li { display: block; float: left; width: 100px; height: 100px; border: none }
				.hart-small { width: 47px; height: 37px; overflow: hidden; text-indent: -999px; position: absolute; bottom: 135px; left: 70px; background-position: -199px -232px }
				.in-love { width: 130px; height: 51px; display: block; overflow: hidden; background-position: 0 -303px; position: absolute; right: 10px; bottom: -15px; text-indent: -999px }
			.hier-werk-ik { padding: 20px 0 }
			.hier-werk-ik h3, .fan h3 { color: #f39 }
			.hier-werk-ik figure { margin-bottom: 20px }
			.het-roze-boekje { position: relative }
			.het-roze-boekje p { width: 220px }
				.het-roze-boekje .boek { display: block; overflow: hidden; width: 62px; height: 69px; text-indent: -999px; position: absolute; right: 10px; top: 0; background-position: -155px -302px }
				.het-roze-boekje div { position: relative; padding: 0 0 0 110px;  min-height: 100px; height: auto !important; height: 100px; overflow: visible; margin-bottom: 20px }
					.het-roze-boekje div figure { position: absolute; left: 0; top: 0; width: 100px; height: 100xp; overflow: hidden }
				.het-roze-boekje dt { font-weight: bold; color: #f39 }
				.het-roze-boekje dd { line-height: 140% }
				.nieuwste-adresjes { display: block; width: 117px; height: 58px; overflow: hidden; text-indent: -999px; position: absolute; bottom: 0; right: 0; background-position: -232px -307px }
				.fan { padding-top: 30px }
				.badge { display: block; height: 106px; text-align: center; background-position: 0 -388px; padding-top: 10px; margin-bottom: 15px }

.booth { margin: 20px 20px 0 20px; position: relative; display: block; clear: both }
	.wrap-content .booth { margin: 20px 0 0 0 }
	.wow, .camera { display: block; overflow: hidden; width: 63px; height: 30px; position: absolute; left: 600px; top: 0; text-indent: -999px; background-position: -467px 0 }
		.camera { background-position: -326px -66px; width: 65px; height: 51px; left: 105px; top: 120px }
	.booth h2, .all-messages h2, .related { display: block; clear: both; padding-bottom: 10px }
	.related { margin-top: 20px }
	h2 a { font-family: arial; font-size: 12px; display: inline-block; background: #eee; color: #666; text-decoration: none; padding: 4px 15px; margin-left: 20px }
		h2 a:hover, h2 a:visited:hover { background: #666; color: #fff }
	.booth .thumb-list { width: 760px; margin: 0 }
	.booth p { width: 160px; float: left; padding-right: 20px }

.img-werk { float: left; margin: 4px 20px 0 0; height: 176px; overflow: hidden; width: 220px; }
.img-werk img { width: 100%; }
aside .img-werk { float: none; }
.all-messages { display: block; margin: 40px 20px; clear: both; overflow: auto; }
	#content .all-messages { margin: 0 20px 0 20px }

.small-split { margin-top: 10px }
.small-split .left, .small-split .right { display: block; float: left; width: 130px; padding: 0 10px 0 90px; position: relative }
	.small-split .left figure, .small-split .right figure { position: absolute; left: 0; top: 0; display: block; overflow: hidden; width: 80px; height: 80px }

/* Doormat */
.doormat { background: #ff3399; padding: 30px 0; margin-top: 60px }
	.doormat .container { width: 940px; margin: 0 auto; position: relative }
	.doormat h3 { color: #fff }
	.doormat a, .doormat a:visited { color: #ffd6eb; text-decoration: none }
	.doormat a:hover, .doormat a:visited:hover { text-decoration: underline; color: #fff }
	.doormat ul { display: block; width: 215px; float: left; padding: 20px 20px 0 0 }
		.doormat ul li { padding-bottom: 4px }
	.doormat .last-list { padding-top: 52px }
	.doormat .last-list li { text-align: center }
	.cupcake-doormat { display: block; overflow: hidden; width: 88px; height: 118px; text-indent: -999px; position: absolute; left: 580px; top: -100px; background-position: -402px -66px }

.footer { padding-left: 2px }
	.footer ul { width: 940px }
.copy-info { width: 940px; margin: 0 auto; position: relative; padding: 60px 20px; color: #999 }
	.copy-info p { width: 700px }
	.copycat { display: block; overflow: hidden; width: 187px; height: 126px; text-indent: -999px; position: absolute; top: 80px; right: 45px; background-position: 0 -166px }

/* Wijziginen 30 nov 2011 */
.new-articles article { position: relative;}

.new-articles article em { display: block; width: 100px; height: 50px; background-position: -16px -548px; text-indent: -999px; position: absolute; overflow: hidden }

.new-articles .article1 em { width: 101px; height: 51px; background-position: -16px -548px; left: 27px; top: 94px;  }
.new-articles .article2 em { width: 123px; height: 65px; background-position: -16px -611px; left: 163px; top: 85px;  }
.new-articles .article3 em { width: 128px; height: 48px; background-position: -126px -548px; left: 61px; top: 21px;  }

.thumb-list li a { position: relative;}
.thumb-list li a em { display: block; width: 100px; height: 50px; background-position: -16px -693px; text-indent: -999px; position: absolute; overflow: hidden }

.thumb-list li a em.txt1 { width: 75px; height: 40px; background-position: -16px -693px; left: 9px; top: 48px;  }
.thumb-list li a em.txt2 { width: 73px; height: 30px; background-position: -100px -693px; left: 12px; top: 8px;  }
.thumb-list li a em.txt3 { width: 64px; height: 48px; background-position: -183px -693px; left: 23px; top: 40px;  }


	.cupcake-doormat { display: block; overflow: hidden; width: 88px; height: 118px; text-indent: -999px; position: absolute; left: 820px; top: -100px; background-position: -402px -66px }
.holy { width: 221px; height: 46px; overflow: hidden; display: block; text-indent: -999px; position: absolute; left: 580px; top: 0; background-position: 0 -111px }	

.onderwerpen { display: block; width: 470px; float: left }
.blogrolls { display: block; width: 470px; float: left }
.others { display: block; clear: both; padding-top: 40px } 
	.others .last-list { padding: 0 }  
	.others h3 { display: block; text-align: center; padding-bottom: 10px }
	
	
/* wijzigingen 7 dec */

.socials .flickr { position: absolute; right: 300px; top: 10px; width: 63px; height: 20px; overflow: hidden;  }

mark { background-color:#fce4f0; padding:4px; color: #666;}	 

article p.wowtxt {  
    overflow: visible;
    padding-bottom: 10px;
    position: relative;
    width: 280px; }

}
article p.wowtxt span { color:#ff3399; font-weight: bold;}
article p.wowtxt span.handwr { height:33px; width:283px; display:inline-block; text-indent: -5999px; background-position: -311px -599px; }

.boekje { display: block; overflow: hidden; width: 34px; height: 38px; background-position: -340px -134px; text-indent: -999px; position: absolute; left: 160px; top: -262px }
.het-roze-boekje { position: relative; padding-bottom: 70px; } 

#code { border: 1px solid #666; color: #666; font: 14px Arial; line-height: 140%; margin: 1.0em 0; overflow: hidden; padding: 10px; height: 110px; width: 280px; }

}