/* -- Eric Meyer's Global Reset -- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

/* -- My Global Re-Reset -- */

body { background: #333; font: 12px/20px Verdana, Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; }
a, a:hover { text-decoration: none; }
.floatleft { float: left; padding-right: 5px; }
.floatright { float: right; }


/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after { clear: both; content: '.'; display: block; height: 0; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/* -- Colours -- 

Blue (dark to light):
#000066
#1313fe
#cbcbfd

Yellow (dark to light):
#ffff00
#fefeaa
#ffffee

Orange (dark to light):
#ff9900
#ffc979
#feebce

Purple (dark to light):
#4e019a
#9458d1
#e2cbfe


/* -- General settings for div's -- */

.container { background: #ebebeb; width: 100%; }

#tnt, #headerSub, .articleInfo, .articleMain, #footerAbout, #footerTwitter, #commentFormHeader, .commentForm, .commentInfo, .commentMain { display: inline; float: left; margin-left: 10px; margin-right: 10px; }

.head { background: #222; border-bottom: 5px solid #707070; }
#header { margin: 0 auto; width: 720px; }
	#tnt { background: url(img/tnt.png) no-repeat 0 0; height: 100px; width: 220px; }
	#headerSub { width: 460px; position: relative; }
		#search { background: url(img/search.png) no-repeat 100% 50%; padding: 0 30px 0 0; position: absolute; top: 10px; right: 120px; }
			#search input { background: #333; border: 1px solid #111; height: 20px; width: 140px; }
				#search input:focus { background: #ebebeb; } 
		#rss { height: 40px; }
			#rss .rssmenu { background: url(img/rss.png) no-repeat 100% 50%; color: #707070; cursor: pointer; float: right; font-size: 10px; line-height: 40px; padding: 0 28px 0 0; text-align: right; width: 100px; }
				.menuRSS { background: #222; border-left: 5px solid #ebebeb; border-bottom: 5px solid #ebebeb; border-right: 5px solid #ebebeb; border-top: 5px solid #ebebeb; display: none; right: 0; position: absolute; top: 30px; width: 200px; z-index: 1000; }
					.menuRSS h5 { color: #F90; font: 16px/20px Corbel, Helvetica, Arial, sans-serif; font-weight: normal; padding: 5px; }
						.menuRSS h5 span { font-weight: bold; }
					.menuRSS ul { padding-bottom: 10px; } 
					.menuRSS ul li { background: #222 url(img/feed.png) no-repeat 5px 50%; }
					.menuRSS ul li a { background: #222 url(img/feed.png) no-repeat 5px 50%; color: #FFF; display: block; padding: 5px 10px 5px 23px; } 
					.menuRSS ul li a:hover { background: #444 url(img/feed.png) no-repeat 5px 50%; }
		#logo { background: url(img/logo.png) no-repeat 0 100%; height: 60px; text-indent: -9999px; width: 460px; }
		
	#menu { float: left; height: 50px; margin-top: 5px; width: 720px; }
		#navMenu { background: url(img/menu.png) no-repeat; height: 50px; position: relative; width: 720px;  }
			#navMenu li { list-style: none; position: absolute; top: 0; }
			#navMenu li, #navMenu a { display: block; height: 50px; }
			#navMenu a { text-indent: -9999px; }
				#navMenu #snhome { left: 0px; width: 110px; }
				#navMenu #sntumblog { left: 110px; width: 145px; }
				#navMenu #sngallery { left: 255px; width: 133px; }
				#navMenu #snzin { left: 388px; width: 199px; }
				#navMenu #sninfo { left: 587px; width: 133px; }
					#navMenu #snhome a:hover { background: url(img/menu.png) no-repeat 0px -50px; }
					#navMenu #sntumblog a:hover { background: url(img/menu.png) no-repeat -110px -50px; }
					#navMenu #sngallery a:hover { background: url(img/menu.png) no-repeat -255px -50px; }
					#navMenu #snzin a:hover { background: url(img/menu.png) no-repeat -388px -50px; }
					#navMenu #sninfo a:hover { background: url(img/menu.png) no-repeat -587px -50px; }
						#navMenu #snhome.active a:link, #navMenu #snhome.active a:visited { background: url(img/menu.png) no-repeat 0px -100px; cursor: default; }
						#navMenu #sntumblog.active a:link, #navMenu #sntumblog.active a:visited { background: url(img/menu.png) no-repeat -110px -100px; cursor: default; }
						#navMenu #sngallery.active a:link, #navMenu #sngallery.active a:visited { background: url(img/menu.png) no-repeat -255px -100px; cursor: default; }
						#navMenu #snzin.active a:link, #navMenu #snzin.active a:visited { background: url(img/menu.png) no-repeat -388px -100px; cursor: default; }
						#navMenu #sninfo.active a:link, #navMenu #sninfo.active a:visited { background: url(img/menu.png) no-repeat -587px -100px; cursor: default; }

.cat { background: #e2cbfe; border-bottom: 1px solid #b7b7b7; }
#categories { background: #e2cbfe; height: 30px; margin: 0 auto; width: 700px; }
	#categories p { line-height: 30px; }
		#categories a { color: #707070; font-weight: bold; }
		#categories a:hover { color: #333; font-weight: bold; }
		#categories a.active { color: #333; font-weight: bold; }

#main { margin: 0 auto; width: 700px; }
	.article { border-bottom: 1px solid #b7b7b7; padding: 20px 0 10px; }
		.articleInfo { margin-left: 0; width: 220px; }
			.articleInfo .link { background: url(img/link.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .cartoon { background: url(img/cartoon.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .text { background: url(img/text.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .photo { background: url(img/photo.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .senses { background: url(img/senses.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .photos { background: url(img/photos.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .video { background: url(img/video.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .audio { background: url(img/audio.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .chat { background: url(img/chat.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .quote { background: url(img/quote.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
			.articleInfo .search { background: url(img/searchbig.png) no-repeat 0 0; float: left; height: 64px; text-indent: -9999px; width: 70px; } 
				.articleInfo .date, .articleInfo .comments { color: #707070; font: 13px/15px Corbel, Helvetica, Arial, sans-serif; font-variant: small-caps; margin-left: 70px; width: 130px; }
				.articleInfo .date { margin-top: 25px; }
					.articleInfo a, .articleInfo a:hover { color: #f7941d; }
					.articleInfo a:hover { border-bottom: 1px solid #f7941d; }
    	.articleMain { margin-right: 0; width: 460px; }
			.articleMain h2 { color: #006; font: 30px/30px Corbel, Helvetica, Arial, sans-serif; padding: 0 0 10px 0; text-shadow: #FFF 0 2px 0; }
			.articleMain h3 { color: #006; font: 20px/20px Corbel, Helvetica, Arial, sans-serif; }
				.articleMain h2 a, .articleMain h3 a { color: #006; border: none; }
				.articleMain h2 a:hover, .articleMain h3 a:hover { border: none; }
			.articleMain h6 { color: #4e019a; font: 20px/20px Corbel, Helvetica, Arial, sans-serif; padding: 10px 0; }
			.articleMain p { margin: 0 0 10px; }
			.articleMain p.light { color: #707070; }
				.articleMain a { border-bottom: 1px dashed #1313fe; color: #1313fe; }
				.articleMain a:hover { border-bottom: 1px solid #006; }
			.articleMain blockquote { background: url(img/blockquote.png) no-repeat 0 0; margin: 0 0 10px; }
				.articleMain blockquote p { font: 16px/20px Georgia, Times, serif; font-style: italic; padding: 0 60px 0 50px; }
				.articleMain blockquote p.quoteAuthor { font: 12px/20px Helvetica, Arial, sans-serif; font-style: normal; text-align: right; }
			.articleMain .media img { border: 1px solid #b7b7b7; margin: 0 0 10px; }
				.articleMain .media a { border: none; }					
			.articleMain p.articleMore { background: url(img/readmore.png) no-repeat 0 0px; padding: 0px 0 0 18px; }
				.articleMain p.articleMore a { border-bottom: 1px dashed #4e019a; color: #4e019a; }
				.articleMain p.articleMore a:hover { border-bottom: 1px solid #9458d1; }
							
#footerGraphicTop { background: #ebebeb url(img/footertop.png) no-repeat 0 0; height: 130px; margin: 0 auto; width: 880px; }
#footerGraphicBottom { background: #ebebeb url(img/footerbottom.png) repeat-x 0 0; margin-top: 60px; height: 200px; }

.foot { background: #222; border-top: 5px solid #707070; }
#footer { color: #ebebeb; margin: 20px auto 0; padding: 0 0 30px 0; width: 720px; }
	#footer p { margin: 0 0 10px 0; }
	#footer a { border-bottom: 1px dashed #ffc979; color: #feebce; }
	#footer a:hover { border-bottom: 1px solid #ffc979; }
	#footerAbout, #footerTwitter { width: 340px; }
		#footer h4 { color: #9458d1; font: 30px/30px Corbel, Helvetica, Arial, sans-serif; padding: 0 0 10px 0; text-shadow: #000 0 2px 0; }
		#footerTwitter li { background: url(img/tweet.png) no-repeat 0 0; margin: 0 0 10px 0; padding: 0 0 0 18px; }

.credits { background: #333; border-top: 5px solid #707070; } 
#footerCredits { margin: 0 auto; width: 700px; padding: 10px 0 0; }
	#footerCredits ul li { display: inline; font: 15px/20px Corbel, Helvetica, Arial, sans-serif; padding: 0 20px 0 0; }
		#footerCredits ul li a { color: #9458d1; border: none; } /* andere kleur van maken */
		#footerCredits ul li a:hover { border-bottom: 1px solid #ebebeb; }
		#footerCredits ul li.active a:link, #footerCredits ul li.active a:visited { color: #ebebeb; border-bottom: 1px solid #9458d1; }
	#footerCredits p { color: #000; font: 10px/30px Verdana, Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; }
		#footerCredits a { border-bottom: 1px dashed #cbcbfd; color: #cbcbfd; }
		#footerCredits a:hover { border-bottom: 1px solid #1313fe; }

/* Pages */

ul.nav { border: none; display: block; font-size: 11px; margin: 30px 0px 100px 0px; padding: 0px; text-transform: uppercase; }
	ul.nav li { display: inline; float: left; list-style: none; margin-left: 0; }
	ul.nav li a { background: #ebebeb; border: 1px solid #e2c6fe; color: #9458d1; display: block; float: left; font-weight: normal; margin: 0 5px 0 0; padding: 0 5px; text-decoration: none; }
	ul.nav li a:hover { background: #fff; border: 1px solid #ffc979; color: #9458d1; }
		ul.nav li.pgEmpty { border: 1px solid #cbcbfd; color: #e2c6fe; display: block; float: left; margin: 0 5px 0 0; padding: 0px 5px; }
		ul.nav li.pgCurrent { background: #ffffee; border: 1px solid #ffc979; color: #4e019a; display: block; float: left; font-weight: normal; margin: 0 5px 0 0; padding: 0px 5px; }



/* Comments */

#commentContainer { border-bottom: 1px solid #b7b7b7; padding: 0 0 20px; }
	#commentFormHeader { background: url(img/commentheader.png) no-repeat 0 100%; height: 84px; margin-left: 0; width: 220px; }
	.commentForm { margin-right: 0; width: 460px; }

.comment { border-bottom: 1px solid #b7b7b7; padding: 10px 0; }
h5.commentHeader { color: #006; font: 30px/30px Corbel, Helvetica, Arial, sans-serif; padding: 30px 0 10px 240px; text-shadow: #FFF 0 2px 0; }
	.commentInfo { width: 220px; margin-left: 0; }
		.commentInfo .header { background: url(img/user_comment.png) no-repeat 0 0; float: left; height: 64px; width: 70px;  }
		.commentInfo .name, .commentInfo .date { color: #707070; font: 13px/15px Corbel, Helvetica, Arial, sans-serif; font-variant: small-caps; margin-left: 70px; width: 130px; }
				.commentInfo .name { color: #006; font-size: 15px; font-weight: bold; margin-top: 25px; }
					.commentInfo a { color: #f90; }
					.commentInfo a:hover { text-decoration: underline; }
	.commentMain { margin-right: 0; width: 460px;  }
		.commentMain h6 { color: #9458d1; font: 20px/20px Corbel, Helvetica, Arial, sans-serif; font-variant: small-caps; font-weight: bold; margin-bottom: 10px; }

/* Commentform */

	div.commentForm p, div.commentForm ul { color: #111; }
	div.commentForm .commentFormInfo { background: #cbcbfd; padding: 9px 10px 12px 10px; }
		div.commentForm .commentFormInfo ul { list-style: circle inside; }
		div.commentForm .commentFormInfo a { color: #f90; }
	div.commentForm .comments_error { }
	div.commentForm fieldset { background: #cbcbfd; }
		div.commentForm form fieldset { border: 0; }
			div.commentForm form fieldset div { background: url(img/formdivider.gif) repeat-x 0 100%; padding: 6px 5px 9px 5px; }
		div.commentForm form legend { visibility: hidden; } 
	div.commentForm label { margin-right: 10px; padding-right: 10px; width: 50px; display: block; float: left; text-align: left; position: relative; line-height: 18px; }
	div.commentForm div.buttonrow { background: #cbcbfd url(img/formdivider.gif) repeat-x 100% 100%; padding: 5px 0 7px 5px; }
	div.commentForm span.nofloat { margin-left: 20px; }
	div.commentForm span.nofloat label { float: none; display: inline; font-size: 10px;  }


/* caption styling */

.caption-bottom { background: #000; border-width: 1px 0px 0px 0px; color: #fff; cursor: default; font-size: 12px; padding: 10px 0 20px; text-align: center; }
.caption-bottom a, .caption a { background: #000; border: 0; padding: 0 0 10px; text-decoration: none; }
.caption-bottom a:hover, .caption a:hover { background: #202020; }
.caption-bottom img, .caption img { vertical-align: text-bottom; }
.caption-wrapper { float: left; }
br.c { clear: both; }		
.mediaSub { margin: 0 0 10px; text-align: center; }
	.articleMain img.noborder { border: 0; }