/*

<< LessCSS syntax is actief voor dit bestand >>
<< http://lesscss.org/ >>

#####################################################################
#	Algemeen														#
#####################################################################
*/
/* 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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	border: 0;
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

/* Html & body
-------------------------------------------------------------------*/
html { min-height: 100%; overflow-y: scroll; }
body {
	background: #000 url(/img/footer.png) no-repeat 50% bottom;
	font: 12px/160% milibus, Arial, Verdana, Tahoma, sans-serif;
	font-weight: 300;
	color: #fff;
	line-height: 20px;
}

/* TypeKit-Fonts
-------------------------------------------------------------------*/
.tk-milibus { 		 font-family: milibus, sans-serif; }
.tk-milibus-light { 	.tk-milibus; font-weight: 300; }
.tk-milibus-regular { 	.tk-milibus; font-weight: 400; }
.tk-milibus-semibold { 	.tk-milibus; font-weight: 600; }
.tk-milibus-bold { 		.tk-milibus; font-weight: 700; }

.arial { font-family: Arial, Verdana, Tahoma, sans-serif; }

/* CSS3
-------------------------------------------------------------------*/
.rounded-corners (@radius: 10px) {
  border-radius: @radius;
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
}

.text-shadow (@values: 1px 1px 3px #888) {
	text-shadow: @values;	
}

.box-shadow (@values: 0px 0px 4px #fff) {
     -moz-box-shadow: @values; 
  -webkit-box-shadow: @values; 
          box-shadow: @values;	
} 

.ease-out (@ease: 0.3s) {
     -moz-transition: all @ease ease-out;  
       -o-transition: all @ease ease-out;  
  -webkit-transition: all @ease ease-out;  
      -ms-transition: all @ease ease-out;  
          transition: all @ease ease-out;  
}

.opacity-old(@value: 100) {
	/* IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	/* IE 5-7 */
	filter: alpha(opacity=50);	
}
.opacity(@value: 1) {
	/* Netscape */
	moz-opacity: @value;
	/* Safari 1.x */
	-khtml-opacity: @value;
	/* Good browsers */
	opacity: @value;
}

/* Algemene classnames
-------------------------------------------------------------------*/
.nomargin, .nom { margin: 0; }
.nopadding .nop { padding: 0; }
.nomp { margin: 0; padding: 0; }

.block { display: block; }
.inline { display: inline; }
.inline-block {
	display: inline-block;
	zoom:1;
	*display:inline;
}

.center { display: block; margin: auto; }

.hide, .hidden { position: absolute; left: -9999px; }

.fleft { float: left; }
.fright { float: right; }
.fnone { float: none; }

.clear { clear: both; }
.cleft { clear: left; }
.cright { clear: right; }

.tcenter { text-align: center; }
.tleft { text-align: left; }
.tright { text-align: right; }

.vbottom { vertical-align: bottom; }
.vmiddle { vertical-align: middle; }
.vtop { vertical-align: top; }

.static { position: static; }
.absolute { position: absolute; }
.relative { position: relative; }

.bold, .b, .strong { font-weight: bold; }
.em, .italic, .i { font-style: italic; }
.normal { font-weight: normal; }
.u, .underline { text-decoration: underline; }
.small { font-size: 11px; }
.lower { text-transform: lowercase; }
.upper { text-transform: uppercase; }
.capitalize { text-transform: capitalize; }

.wide { width: 100%; }

.default { cursor: default; }
.pointer, .js-hover { cursor: pointer; }

/* Afbeeldingen
-------------------------------------------------------------------*/
img { 
	.block;
	.vmiddle;
	border: none;
}

#ibox-background {
	background: #000 !important;
	opacity: 0.75 !important;
}

/* Flash
-------------------------------------------------------------------*/
object { .block; }

/* Alinea's en paragafen
-------------------------------------------------------------------*/
p, div.alinea { margin-bottom: 20px; }

div.intro {
	.tk-milibus-semibold;
	.rounded-corners(4px);
	padding: 15px 19px 1px 18px;
	background: #000;
}

div.zijkolom div.side-alinea {
	background: url(/img/brick-pat.png);
	.rounded-corners(4px);
	padding: 17px 16px 1px 19px;
	
	h2 { 
		background: none;
		margin-bottom: 4px !important;
		
		span { background: none; }
	}
}

/* Overflow en clearfix
-------------------------------------------------------------------*/
.overflow { overflow: hidden; }
.clearfix:after {
	.clear;
	.block;
	visibility: hidden;
	font-size: 0;
	content: ' ';
	height: 0;
}

/* Headings
-------------------------------------------------------------------*/
h1 { 
	.tk-milibus-bold;
	.i;
	.upper;
	.text-shadow(0px 1px 0px #000);
	font-size: 20px;
	margin-bottom: 18px;
	color: #ff9900;
}

h2 { 
	.tk-milibus-bold;
	.i;
	.upper;
	.text-shadow(0px 1px 0px #000);
	font-size: 16px;
	color: #ff9900;
	margin-bottom: 10px;
/*
	background: url(/img/h2-bg.gif) repeat-x 0 11px;
		
	span {
		.inline-block;
		padding-right: 13px;
		background: #000;
	}
*/
}
	
.border-wrapper {
    width: 9000px;
    white-space: nowrap;  
	.overflow;
	
	h2 {
	    .fleft;
		.cnone;
		margin: 0 10px 10px 0;
	}
	
	span.border {
		.fleft;
		background: url(/img/h2-bg.gif) repeat-x 0 11px;
		width: 3000px;
	} 
}

h3 { 
	.tk-milibus-bold;
	font-size: 14px;
}
h4 { font-size: 10px; }

/* Hyperlinks
-------------------------------------------------------------------*/
a { color: #ff9900; }
a.never-underline, a:hover, a:focus, a.none { text-decoration: none; }
a.none:hover, a.none:focus { .u; }
a span { .pointer; }

/* Lijsten
-------------------------------------------------------------------*/
ul, form ol { list-style: none; }

/* Formulieren
-------------------------------------------------------------------*/
label {
	.fleft;
	.vmiddle;
	margin-right: 10px;
	width: 180px;
}
.keuze label,
.form-input-multipleselect li label {
	.block;
	.fnone;
	margin-left: 20px;
	width: auto;
}
.keuze label.multiple-title { .b; margin-left: 0; }

input { .vmiddle; .nomp; }
input[type='text'], textarea {
	padding: 2px 3px;
	.vmiddle;
	width: 260px;
}
textarea { font-size: 12px; overflow: auto; }
select { .vmiddle; width: 268px; }
select.auto, li.form-input-date select { width: auto; }
textarea { height: 80px; }
input, select, textarea {
	/* font-family: Arial, Verdana, Tahoma, sans-serif; */
	.tk-milibus-light
}
input[type='radio'], input[type='checkbox'] { .absolute; left: 0; top: 2px; }
input[type='submit'] { .pointer; overflow: visible; }

fieldset { border: none; .nomp; }
legend { display: none; }

form li { margin: 5px 0; .relative; }
form .keuze li { margin: 0; }

form em.verplicht { margin-left: 4px; }
form img.unitip { .absolute; right: 0; top: 2px; }

/* Tabellen
-------------------------------------------------------------------*/
table { border-collapse: collapse; border-spacing: 0; }
th, td { padding: 3px; }
th { .tleft; }

/* Highlighted
-------------------------------------------------------------------*/
.highlighted {  color: #fff; }

p.zoek-url {
	.small;
	
	color: #999;
	a { color: #999; }
}

/* Html 5-elementen (nodig voor oudere browsers)
-------------------------------------------------------------------*/
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	.block;
}

/* Overig
-------------------------------------------------------------------*/
address { font-style: normal; }

/*
#####################################################################
#	Standaard-elementen												#
#####################################################################
*/

/* Illustraties
-------------------------------------------------------------------*/
p.illustratie img { margin: 0 auto; }
p.illustratie span {
	.tk-milibus-bold;
	.block;
	.i;
	.tleft;	
	font-size: 12px;
	padding: 5px 0 3px;
}
img.illustratie {
	.fright;
	margin-right: 0;
	margin-left: 22px;
}
img.illustratie-links {
	.fleft;
	margin: 5px 22px 3px 0;
}
div.zijkolom img.illustratie {
	.block;
	.fnone;
	margin: 0 auto 20px;
}

/* Preview
-------------------------------------------------------------------*/
div.preview { margin-bottom: 20px; }
div.preview h2 { font-size: 18px; }
div.preview p { margin-bottom: 0; }

/* Optie-menu (mail & stuur door)
-------------------------------------------------------------------*/
ul#opties { .fright; padding: 10px; }
ul#opties li { .fleft; margin-left: 14px; }
ul#opties a {
	.block;
	background: url(/img/opties.gif) no-repeat 0 5px;
	color: #808080;
	padding-left: 18px;
}
ul#opties a.mail { background-position: -289px 4px; }

/* Error-menu
-------------------------------------------------------------------*/
ul.errors, ol.errors, li.input-error {
	border: 1px solid #c70a00;
	margin: 10px 0;
	padding: 2px 0;
	border-radius: 3px;
}
ul.errors li, ol.errors li { 
	list-style: none;
	margin: 0 0 0 10px;
	padding: 2px 0; 
}

li.input-error { 
	padding: 4px 0 4px 10px;
	
	> label {
		margin-right: 5px;
		width: 142px !important;
	}
}

li div.input-error { 
	font-weight: 600;
	
	p { margin-bottom: 10px; }
}

div.form-error {
	background: #000;
	border: 3px #c70a00 solid;
	padding: 5px 10px;
	.rounded-corners(5px);
	margin: 5px 0 10px;
}

/* FCK-editor-lijst
-------------------------------------------------------------------*/
div.alinea ul { list-style: disc; }
div.alinea ul, div.alinea ol { margin: 10px 0 10px 16px; }
div.alinea ol { margin-left: 24px; }

/* Sitemap
-------------------------------------------------------------------*/
ul.sitemap { list-style: disc; margin: 0 0 10px 24px; }

/* Webbeheer formulier
-------------------------------------------------------------------*/
div.webbeheer-formulier-thanks {
	background: #000;
	border: 2px solid #ff9900;
	padding: 5px 10px;
	.rounded-corners(5px);
	margin: 5px 0 10px;
	line-height: 140%;
}
div.webbeheer-formulier-thanks p { margin-bottom: 0; }

form.webbeheer-formulier {
	fieldset {
		padding: 7px 0;
		
		legend { display: none; }
		
		ul.velden {
			
			li {
				margin: 5px 0 10px;
				
				label {
					width: 150px;
					padding: 5px 0;
					
					em { color: #e64215; }
				}
				
				select,
				textarea,
				input.text {
					.box-shadow(2px 2px 3px #d9d9d9 inset);
					border: 1px #d9d9d9 solid;
					border-width: 1px 0 0 1px;
					color: #818181;
					padding: 5px 7px;
					width: 282px - (2 * 7);
					
					.ease-out(0.2s);
					:hover, :focus {
						color: #333;
					}
				}
				
				select {
					padding: 5px 4px 5px 7px;
					width: 297px - (4 + 7);
				}
				
				&.form-input-checkbox {
					input,
					label {
						position: static;
						display: inline;
						width: auto;
						font-weight: normal;
					}
					label { margin-left: 10px; }
				}
				
				&.form-input-radio,
				&.form-input-multipleselect {
					label { float: left; }
					
					ul {
						float: left;
						width: 282px;
						
						li { margin: 3px 0; }
						label { 
							width: 260px;
							margin-right: 0;
							padding: 0;
							font-weight: normal;
						}
					}
				}
				
				&.form-input-date {
					select { width: 92px; }
				}
				
				h2 {
					font-size: 15px;
					padding-top: 10px;
					color: #fff;
				}
			}
		}
		
		div.buttons {
			padding: 10px 0 10px 160px;
			
			input.button {
				.tk-milibus-bold;
				.rounded-corners(5px);
				.upper;
				.text-shadow(0 1px 0 #b45e00);
				background: #fb9600;
				color: #fff;
				border: 0;
				font-size: 14px;
				padding: 4px 9px;
				
				.ease-out(0.2s);
				:hover, :focus {
					background: #003171;
				}
			}
		}
	}
}

/* Zoekformulier
-------------------------------------------------------------------*/
form#zoeken { .fright; }

form#zoeken,
form.zoekformulier {
	padding: 7px 0 0 0; /* 10px 0 13px; */
	width: 247px;
	height: 66px - 7;
	background: url(/img/zoekform-bg.png) no-repeat;
	
	fieldset {
		.block;
		background: url(/img/zoekform-fieldset.png) no-repeat;
		width: 223px;
		padding-top: 1px;
		height: 28px;
		margin: 0 auto;
	}
	
	input {
		
		&.text {
			.fleft;
			background: transparent;
			border: 0;
			.arial;
			font-size: 11px;
			color: #00050b;
			padding: 6px 0 6px 12px;
			width: 146px;
		}
		
		&.button {
			.fright;
			.tk-milibus-bold;
			.i;
			.upper;
			color: #fff;
			background: transparent url(/img/zoekform-button.png) no-repeat;
			width: 61px;
			height: 26px;
			border: 0;
			font-size: 14px;
			.text-shadow(0px 1px 0px #b45e00);
			padding-bottom: 3px;
			
			:hover, :focus, :active {
				background-position: 0 -26px;
			}		
		}
	}
}

form.zoekformulier fieldset { margin-top: 9px; }

/* FCK-editor-tabel
-------------------------------------------------------------------*/
div.alinea table,
table.webapp-table {
	border: none;
	border-collapse: collapse;
	border-spacing: 0;
	color: #545454;
	width: 100%;
}

div.alinea table caption,
table.webapp-table caption {
	.i;
	.tleft;
	margin: 10px 6px 3px;
}

div.alinea table td,
div.alinea table th,
table.webapp-table td,
table.webapp-table th {
	border: 1px solid #d8d8d8;
	padding: 2px 4px;
}

/*
#####################################################################
#	Layout															#
#####################################################################
*/

/* Container
-------------------------------------------------------------------*/
div#bodywrap { background: url(/img/container-bg.jpg) no-repeat 50% 0; }
div#container {
	background: url(/img/basketball-court.png) no-repeat 50% 307px;
	min-height: 650px;
	
	.inner-container {
		margin: 0 auto;
		width: 976px;
	} 
}

/* Header & Logo
-------------------------------------------------------------------*/
div#header {
	.relative;
	height: 235px;
	
	p#logo {
		.absolute;
		z-index: 4;
		top: 20px;
		left: 0;
		/*
		background: url(/img/gasterra-flames.png) no-repeat;
		height: 80px;
		text-indent: -9999px;
		width: 300px;
		*/
		a { .block; }
	}
	
	div.hoofdmenu {
		.absolute;
		top: 175px;
		left: 48px;
	}
	
	form#zoeken {
		.absolute;
		top: 133px;
		/* right: -16px; */
		right: -8px;
	}
	
	div.social-en-login {
		.fright;
		padding: 6px 12px;
		background: url(/img/topmenu-bg.png) repeat-x bottom left;
		.rounded-corners(0 0 4px 4px);
		margin-bottom: 22px;
		
		a.login-bbc {
			.fleft;
			.b;
			.text-shadow(0 1px 0 #000);
			font-family: Verdana, Arial, Tahoma, sans-serif;
			font-size: 10px;
			color: #fff;
			text-decoration: none;
			padding: 0 2px 0 0;
			background: url(/img/top-seperate.png) no-repeat right 9px;
			margin-right: 9px;
			
			span {
				.block;
				padding: 3px 8px 1px 16px;
				background: url(/img/slotje.png) 0 8px no-repeat;
			}
			
			.ease-out(.2s);
			:hover, :focus { color: #ff9900; }
		}

		.welkom {
			.fleft;
			.b;
			padding: 3px 12px 1px 5px;
			.text-shadow(0 1px 0 #000);
			font-family: Verdana, Arial, Tahoma, sans-serif;
			font-size: 10px;
			color: #fff;
		}
	}
	
	ul#social-links {
		.fright;
		
		li {
			.fleft;
			margin-left: 8px;
			
			:first-child { margin-left: 0; }
			
			a {
				.block;
				.overflow;
				height: 24px;
				width: 24px;
				background: url(/img/social-btns.png) no-repeat;
				text-indent: -9999px;
				
				&.tw { background-position: -24px 0; }
				&.fl { background-position: -48px 0; }
				&.yt { background-position: -72px 0; }
				
				:hover, :focus, :active { 
					.opacity-old(80);
					.opacity(.8);
				}
			}
		}
	}
	
	p.logos {
		.nom;
		.overflow;
		.fright;
		.cright;
		text-indent: -9999px;
		width: 306px;
		height: 45px;
		background: url(/img/header-logos.png) no-repeat;
		
	}
	
	#counter {
		.absolute;
		top: 20px;
		left: 260px;
		background: url(/img/counter.png) no-repeat;
		padding: 55px 0 0 22px;
		width: 336px - 22;
		height: 144px - 55;
		
		p {
			.nom;
			
			span {
				.block;
				.fleft;
				.tcenter;
				.tk-milibus-bold;
				.text-shadow(0px 1px 0px #fff);
				.ease-out(.2s);
				width: 65px;
				margin-right: 11px;
				font-size: 43px;
				color: #003171;
				line-height: 100%;
			}
		}
	}
	
}


/* Hoofdmenu
-------------------------------------------------------------------*/
div.hoofdmenu {
	background: url(/img/hoofdmenu-bg.png) no-repeat 0 1px;
	width: 930px;
	height: 46px;
}

ul#hoofdmenu {
	.fleft;
	padding: 0 0 0 106px;
	position:relative;
	z-index: 5;
	
	a {
		.block;
		.tk-milibus-bold;
		.i;
		.upper;
		.text-shadow(0px 1px 0px #fff);
		font-size: 15px;
		color: #003171;
		text-decoration: none;
		background: url(/img/hoofdmenu-item-border.png) no-repeat right 0;
		height: 44px;
		
		span { 
			.block;
			height: 44px - (2 * 10);
			margin-left: 9px;
			padding: 10px 14px 10px 6px;
		}
		
		:hover, :focus, &.active {
			.text-shadow(0px -1px 0px #a74b00);
			color: #fff;
			background: url(/img/hoofdmenu-item-hover.png) no-repeat 0 -44px;
			
			span {
				background: url(/img/hoofdmenu-item-hover.png) no-repeat right 0;
			}
		}
		
		:active, &.active:hover {
			color:#A74B00;
			.text-shadow(0px 1px 0px #FFE59B);
		}
		
	}
	li {
		.fleft;
		margin-left: -8px;
		
		:hover, &.hover-ie {
			ul {
				.block;
			}
		}
	}
	ul {
		.clear;
		.absolute;
		display: none;
		width: 200px;
		a {
			.nop;
		}
		li {
			.fnone;
		}
	}
}

/* Submenu
-------------------------------------------------------------------*/
dl#submenu {
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	margin-bottom: 15px;
	
	dt { 
		background: url(/img/submenu-dt.png) no-repeat -1px 0;
	
		a {
			.block;
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #00132b);
			font-size: 15px;
			color: #fff;
			padding: 9px 5px 0 15px;
			height: 37px - 9;
			text-decoration: none;
			
			:hover, :focus {
				color: #ff9900;
				.text-shadow(0px 1px 0px #0c2c5d);
			}
			:active { 
				color: #00132D;
				.text-shadow(0px 1px 0px #0037CA)
			}
		}
	}
	
	dd {
		border: 1px #999 solid;
		border-width: 0 1px;
		.rounded-corners(0 0 5px 5px);
		
		ul.submenu {
			li {
								
				:last-child,
				:last-child a {
					.rounded-corners(0 0 5px 5px);
				}
				
				a {
					.block;
					.tk-milibus-bold;
					font-size: 13.5px;
					color: #262626;
					text-decoration: none;
					padding: 8px 10px 6px 16px;
					border-top: 1px #fff solid;
					border-bottom: 1px #cdcdcd solid;
					background: #f7f7f7;
					
					:hover, :focus,
					&.active {
						border: 1px #e67712 solid;
						border-width: 1px 0;
						color: #fff;
						background: #ff9a00 url(/img/submenu-a-hover.png) repeat-x;
						.text-shadow(0px 1px 0px #a74b00);
						padding: 9px 10px 6px 16px;
						margin: -1px 0 0;
					}
					:active {
						.text-shadow(0 1px 0 #FFDE86);
						color: #893d00;
					}
				}
				
				&.odd a {
					background: #f0f0f0;
					
					:hover, :focus,
					:active, &.active { background: #ff9a00 url(/img/submenu-a-hover.png) repeat-x; }
				}
				
			}	
		}
		
	}
}

/* Breadcrumbs
-------------------------------------------------------------------*/
p#breadcrumbs {
	.tk-milibus-light;
	.nom;
	font-size: 12px;
	color: #467fce;
	padding: 10px 20px 10px 40px;
	
	a {
		.u;
		color: #fff;

		:hover, :focus, :active { text-decoration: none; }
	}
}

/* Kolommen
-------------------------------------------------------------------*/
div.kolom-container {
	.rounded-corners(4px);
	padding: 0 32px 15px 16px;
	margin-bottom: 20px;
	background: url(/img/kolom-container.png) repeat-x 0 250px;
}
div.kolom-wrapper {
	.fleft;
	width: 664px;
}
div.kolom-midden {
	background: #000 url(/img/content-bg.png) no-repeat;
	.rounded-corners(0 0 3px 3px);
	padding: 20px 24px;
	min-height: 450px;
}

div.kolom-rechts {
	.fright;
	width: 248px;
}
div.zijkolom { min-height: 10px; }

body#component-homepage,
body#component-fanzone,
body#component-match {
	div.kolom-wrapper {	
		width: 536px;
		div.kolom-midden { background-image: url(/img/content-bg-small.png); }
	}
	div.kolom-rechts { 
		width: 368px;
		
		dl#submenu dt { background-image: url(/img/submenu-dt-breed.png); }
		
		h2 { 
			font-size: 16px;
			margin-bottom: 15px;
		}
	}
}

body#component-homepage div.kolom-rechts,
body#component-match div.kolom-rechts { padding-top: 2px; }

body#component-homepage {
	div#container {
		background: url(/img/basketball-court-home.png) no-repeat 50% 362px;
	}
	
	div.kolom-container {
		padding: 0 20px 15px 16px;
	}
	
	div.kolom-wrapper {
		width: 544px;
		
		div.kolom-midden {
			background: transparent url(/img/content-bg-home.png) no-repeat;
			.rounded-corners(0);
			padding: 17px 15px 5px 16px;
			height: 658px - (17 + 5);
		}
	}
	
	div.kolom-wrapper { margin-bottom: 20px; }	
}

/* Footer
-------------------------------------------------------------------*/
div#footer {
	
	.bottom {
		.clear;
		.tk-milibus-light;
		font-size: 11px;
		color: #467fcf;
		.text-shadow(0px 1px 0px #001531);
		background: url(/img/footer-basket.png) no-repeat 50% 0;
		padding-top: 45px;
		
		a {
			.tk-milibus-bold;
			.text-shadow(0px 1px 0px #00132b);
			color: #fff;
			:hover {
				color:#ff9900;
				text-decoration:none;
			}
		}
		
		p.fleft {
			a {
				background: url(/img/seperator.png) no-repeat 0 4px;
				padding-left: 8px;
				margin-left: 4px;
				
				:first-child { background: none; }
			}
		}
		
		p.fright {
			
			span {
				background: url(/img/seperator.png) no-repeat 0 4px;
				padding-left: 8px;
				margin-left: 4px;
				a:hover {
					color:#ff0000;
				}
			}
		}
	}
}

ul#sitemap {
	border-top: 1px #3a3a3a solid;
	padding: 20px 0 0;
	
	> li {
		.fleft;
		width: 107px;
		margin-left: 15px;
		
		> a {
			.block;
			.tk-milibus-bold;
			.i;
			.text-shadow(0px 1px 0px #B45E00);
			color: #FF9900;
			font-size: 14px;
			text-decoration: none;
			:hover {
				color:#fff;
			}
		}
		
		ul {
			a {
				.tk-milibus-light;
				color: #fff;
				text-decoration: none;
				font-size: 11px;
				
				:hover, :focus, :active, &.active {
					color: #ff9900;
				}
			}
		}
	}	
}

/* Nieuwsbrief balk */
div.nieuwsbrief-balk {
	background: url(/img/nieuwsbriefbalk-bg.png) no-repeat;
	/*
	padding: 8px 27px 0 77px;
	width: 1011px - (27 + 77);
	margin: 0 0 20px -21px;
	*/
	padding: 8px 23px 0 73px;
	width: 1002px - (23 + 73);
	margin: 0 0 20px -18px;
	height: 46px - 8;
	
	p {
		.fleft;
		.tk-milibus-light;
		.i;
		.text-shadow(0px 1px 0px #0047f9);
		.nom;
		padding-top: 3px;
		color: #fff;
		font-size: 15px;
		
		span {
			.upper;
			.tk-milibus-bold;
			.text-shadow(0px 1px 0px #00132b);
			font-size: 17px;
			padding-right: 3px;
		}
		
	}
	
	form#footer-nieuwsbrief {
		.fright;
		width: 302px;
		height: 27px;
		background: url(/img/footer-nb-bg.png) no-repeat;
		
		fieldset { 
			.block;
			padding-top: 1px;
			height: 27px - 1;
		}
		
		input {
		
			&.text {
				.fleft;
				background: transparent;
				border: 0;
				.arial;
				font-size: 11px;
				color: #00050b;
				padding: 6px 0 6px 12px;
				width: 186px;
			}
			
			&.button {
				.fright;
				.tk-milibus-bold;
				.i;
				.upper;
				font-size: 14px;
				color: #fff;
				background: transparent url(/img/footer-nb-btn.png) no-repeat;
				width: 98px;
				height: 26px;
				border: 0;
				.text-shadow(0px 1px 0px #b45e00);
				padding-bottom: 3px;
				
				:hover, :focus, :active {
					background-position: 0 -26px;
					.text-shadow(0px 1px 0px #5CA8FF);
				}		
			}
		}
	}
}

/* Sponsoren */
ul.footer-sponsoren {
	margin-bottom: 10px;
	
	li {
		.fright;
		width: 145px;
		margin: 0 14px 0 0;
		
		.tk-milibus-bold;
		.upper;
		.tcenter;
		font-size: 13.5px;
		color: #fff;
		.text-shadow(0px -1px 0px #424242);
		
		&.mainsponsor {
			.fleft;
			margin: 0 0 0 14px;
		}
		
		a,
		span {
			.block;
			padding: 8px 0 0 5px;
			margin-bottom: 12px;
			height: 75px - 8;
			background: url(/img/footer-sponsoren-bg.png) no-repeat;
		}
		
		a {
			img { .ease-out(.3s); }
			:hover, :focus {
				img { 
					.opacity-old(85);
					.opacity(.85);
				}
			}
		}
	}
}

/* Blok USP's
-------------------------------------------------------------------*/
dl.blok-upcs {
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	margin-bottom: 15px;
	
	dt { 
		.tk-milibus-bold;
		.i;
		.upper;
		.text-shadow(0px 1px 0px #00132b);
		font-size: 15px;
		color: #fff;
		background: url(/img/submenu-dt.png) no-repeat -1px 0;
		padding: 9px 5px 0 15px;
		height: 37px - 9;
		text-decoration: none;
	}
	
	dd {
		border: 1px #999 solid;
		border-width: 0 1px;
		border-top: 1px #c0c0c0 solid;
		.rounded-corners(0 0 5px 5px);
		background: #f0f0f0;
		
		ul {
			border-top: 1px #ccc solid;
			padding: 0 14px 0 16px;
			
			li {
				border-top: 1px solid #FFFFFF;
				border-bottom: 1px solid #cdcdcd;
				
				:first-child {
					border-top: none;
				}
				:last-child {
					border-bottom: none;
					
					span { .rounded-corners(0 0 5px 5px); }
				}
				
				span {
					.block;
					.tk-milibus-light;
					font-size: 12px;
					color: #333;
					padding: 7px 10px 10px 23px;
					background: url(/img/usps-check.png) no-repeat 0 13px;
				}
				
			}	
		}
		
	}
}


/* Nieuwsfolder en items
-------------------------------------------------------------------*/
.datum {
	.tk-milibus-bold;
	.i;
	.nom;
	color: #999;
}

body#component-newsitem_gasterra {
	.datum {
		.fleft;
		padding-right: 3px;
	}
}

div.meer-nieuws {
	.clear;
	.rounded-corners(4px);
	background: url(/img/black-grey-dotspattern.gif) repeat;
	border: 2px #424242 solid;
	padding: 20px 21px 10px 24px;
	
	h2 { .fleft; background: none; }
	
	
	
	ul.filter {
		.fright;
		.tk-milibus-bold;
		.upper;
		color: #999;
		font-size: 13.5px;
		line-height: 100%;
		
		li {
			.fleft;
			background: url(/img/filter-seperator.gif) no-repeat right 2px;
			:first-child,
			:last-child { background: none; }
			
			a {
				.block;
				text-decoration: none;
				letter-spacing: .2px;
				padding: 0 5px;
				&.last { padding-right: 0; }
				
				.ease-out(.2s);
				:hover, :focus {
					color: #fff;
				}
			}
		}
	}
	
	
}

ul.meer-nieuws {
	margin-bottom: 5px;
	
	li {
		background: url(/img/black-darkgrey-borderpattern.gif) repeat-x 0 bottom;
		
		a {
			.block;
			text-decoration: none;
			padding: 4px 0 5px;
			
			.title {
				.fleft;
				.tk-milibus-bold;
				color: #fff;
				font-size: 11px;
				.ease-out(.2s);
			}
			
			.date {
				.fright;
				.tk-milibus-light;
				.tright;
				width: 70px;
				color: #999;
				font-size: 12px;
				.ease-out(.3s);
			}
			
			:hover, :focus, :active {
				.title { color: #ff9900; }
				.date { color: #fff; }
			}
			
		}
	}
}

a.to-archive {
	.block;
	.tk-milibus-bold;
	.text-shadow(0px 1px 0px #000);
	text-decoration: none;
	font-size: 13.5px;
	padding: 5px 0;
	
	.ease-out(.3s);
	:hover, :focus, :active {
		color: #fff;
		padding-left: 6px;
	}
}
	
body#component-searchengine,
body#component-newsfolder_gasterra {
	div.preview {
		.clear;
		
		img {
			.fleft;
			border-top: 1px #2c2c2c solid;
		}
		
		div.detail {
			.fright;
			width: 430px;
		}
		
		h2 {
			font-size: 18px;
			margin-bottom: 5px;
			
			a {
				.block;
				text-decoration: none;
				
				.ease-out(.2s);
				:hover, :focus {
					color: #fff;
				}
			}
		}
		
		.datum,
		.lees-meer {
			.tk-milibus-bold;
			.i;
		}
		
	}
}

body#component-searchengine div.preview { 
	margin-bottom: 32px;
}

/* Fotoalbumsoverzicht
-------------------------------------------------------------------*/
ul.fotoalbums {
	
	li {
		.fleft;
		width: 303px;
		margin-bottom: 17px;
		margin-right: 10px;
		&.last { margin-right: 0; }
		
		h2 {
			.fleft;
			.nom;
			.i;
			background: none;
			margin-bottom: 1px;
			
			a {
				.block;
				text-decoration: none;
				font-size: 16px;	
				
				span.aantal {
					font-size: 14px;
					color: #999;
					background: none;
				}
				
				.ease-out(.2s);
				:hover, :focus { color: #fff; }
			}		
		}
		
		.datum {
			.fright;
			.tk-milibus-light;
			font-size: 11px;
			padding-right: 7px;
		}
		
		a.fotoalbum-preview {
			.block;
			background: url(/img/fotoalbumpreview.png) no-repeat;
			padding: 10px 9px 14px 10px;
			height: 206px - (10 + 14);
			
			.ease-out(.2s);
				:hover, :focus { 
				img {
					.ease-out(.3s);
					.opacity-old(85);
					.opacity(.85);
				}
			}
		}
		
		a.videoalbum-preview {
			.block;
			
			.ease-out(.2s);
				:hover, :focus { 
				img {
					.ease-out(.3s);
					.opacity-old(85);
					.opacity(.85);
				}
			}
		}
	}
}


form#season_select_form {
	padding: 0 0 20px;
	margin-bottom: 15px;
	background: url(/img/black-darkgrey-borderpattern.gif) repeat-x 0 bottom;
	
	label {
		.block;
		.fnone;
		.b;
		width: auto;
		font-size: 14px;
		padding: 0 0 6px;
	}
	
	select {
		width: auto;
		color: #595959;
		padding: 4px 3px 4px 3px;
		
		option { padding-right: 20px; }
	}
}

/* Fotoalbum
-------------------------------------------------------------------*/
.photoalbum_photo {
	border: 2px solid #fff;
	.box-shadow(0 3px 1px #000);
	float: left;
	margin: 0 16px 16px 0;
	.ease-out(.1s);
	
	:hover {
		border: 2px solid #FF9900;
		.box-shadow(0 0 10px #FF9900);
	}
}

/* Videoalbum
-------------------------------------------------------------------*/

.youtube_gasterra {
	margin-bottom: 25px;
	position:relative;
	width: 296px;
	
	&.large {
		width: auto;
		h3 {
			background:none;
			position:relative;
			display: none;
		}
	}
	
	h3 { 
		background: url(/img/youtube-titel.png) repeat;
		font-style: italic;
		color: #FF9900;
		text-transform: uppercase;
		position:absolute;
		padding: 6px;
		top: 0;
	}
	&.playing h3 { display:none; }
}

/* CTA Button
-------------------------------------------------------------------*/
a.cta {
	.block;
	.rounded-corners(3px);
	.tcenter;
	.box-shadow(0 0 4px #111 inset);
	padding: 6px 11px 8px;
	text-decoration: none;
	background: #333;
	color: #fff;
	font-size: 14px;
	margin-bottom: 15px;
	
	span {
		.block;
		
		&.regel1 {
			.tk-milibus-light;
			.text-shadow(0px -1px 0px #1c1c1c);
			margin-bottom: 5px;
			padding: 1px 0 3px;
		}
		
		&.regel2 {
			.tk-milibus-bold;
			.upper;
			.text-shadow(0px 2px 0px #b45e00);
			background: url(/img/cta.png) no-repeat -1px 0;
			padding: 9px 0 11px;
			height: 44px - (9 + 11);
			letter-spacing: -.3px;
			
		}
	}
	:hover .regel2, :focus .regel2, :active .regel2 {
		background-position: -1px -44px;
		.text-shadow(0px 2px 0px #00132b);	
	}
	:active .regel2 {
		color: #00132D;
		.text-shadow(0px 1px 0px #0037CA);
	}

}

body#component-homepage a.cta,
body#component-fanzone a.cta,
body#component-match a.cta,
a.cta-big {
	
	span {
		
		&.regel2 {
			font-size: 24px;
			background: url(/img/cta-big.png) top center;
			padding: 15px 0 0;
			height: 56px - 15;
			
		}
	}
	:hover .regel2, :focus .regel2 {
		.text-shadow(0px 1px 0px #FDB604);	
		color:#893D00;
		padding: 16px 0 0;
		height: 40px;
	}
	:active .regel2 {
		background-position: -1px -56px;
		color:#00132D;
		.text-shadow(0px 1px 0px #0037CA);
	}
	
}

/* Sponsorenpagina
-------------------------------------------------------------------*/
div.overige-sponsoren {
	ul {
		margin-bottom: 15px;
		
		li {
			.fleft;
			width: 195px;
			margin: 0 15px 10px 0;
			
			&.first { .cleft; }
			&.last { .cright; margin-right: 0; }
			
			a {
				.block;
				background: #fff;
				.rounded-corners(4px);
				padding: 10px 0;
				
				img {
					margin: 0 auto;
				}
				
				.ease-out(.2s);
				:hover, :focus { 
					img {
						.ease-out(.3s);
						.opacity-old(85);
						.opacity(.85);
					}
				}
			}
		}
	}
}

div#mainsponsor {
	margin-bottom: 25px;
	
	h3 {
		margin: 1px 0 3px;
		font-size: 16px;
	}
	
	p.afb {
		.fleft;
		.rounded-corners(4px);
		margin-top: 5px;
		background: #fff;
		padding: 5px 10px;
		width: 195px - (2 * 10);
		
		img { margin: 0 auto; }
	}
	
	div.details {
		.fright;
		width: 400px;
	}
}

/* Wedstrijddetail
-------------------------------------------------------------------*/
div.match {
	.relative;
	width: 824px;
	height: 254px;
	margin: 0 auto;
	background: url(/img/match-big-bg.png) no-repeat;
	
	.home-team { .fleft; margin-left: 28px; }
	.guest-team { .fright; margin-right: 28px; }
	
	.home-team,
	.guest-team {
		.relative;
		margin-top: 20px;
		width: 160px;
		height: 145px;
		
		h2 {
			.text-shadow(none);
			.tcenter;
			.absolute;
			.nomp;
			text-transform: none;
			font-style: normal;
			bottom: 0;
			left: 0;
			width: 160px;
			background: none;
			color: #fff;
			font-size: 16px;
		}	
	}
	
	.score {
		.absolute;
		top: 109px;
		left: 251px;
		width: 328px;
		padding-top: 12px;
		height: 107px - 12;
		letter-spacing: -5px;
		
		.home-score { .fleft; }
		.guest-score { .fright; }
		
		.home-score,
		.guest-score {
			.tk-milibus-bold;
			.tcenter;
			.text-shadow(0px 1px 0px #0038);
			width: 155px;
			margin-right: 9px;
			font-size: 80px;
			line-height: 100%;
		}
		
		.overlay {
			.absolute;
			top: 0;
			left: 0;
			.overflow;
			background: url(/img/score-overlay.png) no-repeat;
			width: 328px;
			height: 107px;
			text-indent: -99999px;
		}
	}
	.tie { color: #1E5EB1; }
	.winners { color: #25a10c; }
	.losers { color: #cd0c0c; }
}

/* Algemene info en topschutters */
div.more-matchinfo {
	margin-bottom: 20px;
	
	h2 {
		font-weight: 18px;
		background: none;
	}
	
	div.algemeneinfo {
		.fleft;
		width: 642px;
		
		ol { margin-right: 36px; }
	}
	
	ol,
	ul {
		.fleft;
		width: 285px;
		list-style: none;
		margin-bottom: 17px;
		
		li {
			border-bottom: 1px #3e3e3e solid;
			padding: 5px 14px 6px 20px;
			background: url(/img/dot.png) no-repeat 2px 12px;
			
			span {
				.fright;
				.tk-milibus-bold;
			}
			
			:last-child { border-bottom: 0; }
		}
	}
	
	div.topschutters { 
		.fleft;
		
		ol {
			list-style: decimal inside;
			
			li {
				background: none;
				padding-left: 1px;
				.tk-milibus-bold;
				
				em {
					.tk-milibus-semibold;
					.i;
					color: #999;
					margin-left: 7px;
				}
			}
		}

		a {
			text-decoration: none;
			color: #FFFFFF;
		}
	}

}

p.all-stats {
	.clear;
	background: url(/img/fading-border.png) no-repeat 50% 50%;
	margin-bottom: 25px;
	
	a {
		.block;
		.tcenter;
		.tk-milibus-bold;
		.text-shadow(0px 1px 0px #a74b00);
		width: 303px;
		padding-top: 8px;
		height: 40px - 8;
		margin: 0 auto;
		background: url(/img/all-stats-btn.png) no-repeat;
		font-size: 14px;
		letter-spacing: -.3px;
		color: #fff;
		text-decoration: none;
		
		:hover, :focus { 
			.text-shadow(0px 1px 0px #0047f9);
			background-position: 0 -41px;
		}
	}
}

/* Quoteblok
-------------------------------------------------------------------*/
div.quotes {
	margin-bottom: 10px;
	
	/*
	.overflow;
	.h2-wrap {
		width: 1000px;
    	white-space: nowrap;
		
		h2 {
			.fleft;
			clear: none;
			margin-right: 13px;
		}
		
		span {
			.fleft;
			width: 1000px;
			background: url(/img/h2-bg.gif) repeat-x 0 11px;
		}   
	}
	*/
}

div.quote {
	margin-bottom: 10px;
	
	.citaat {
		.tk-milibus-light;
		.nom;
		background: #f0f0f0;
		border: 1px #999 solid;
		color: #333;
		font-size: 12px;
		padding: 10px 20px;
	}
	
	.auteur {
		.nom;
		.tk-milibus-semibold;
		.i;
		color: #999;
		padding: 5px 0 3px 32px;
		background: url(/img/quote.png) no-repeat 15px 0;
		margin-top: -1px;
	}
}

/* Sponsorblok
-------------------------------------------------------------------*/
div.sponsorblok {
	margin-bottom: 25px;
	
	a {
		.block;
		.rounded-corners(3px);
		background: #fff;
		text-decoration: none;
		padding: 15px 0;
		
		.ease-out(.2s);
		:hover, :focus {
			.opacity-old(85);
			.opacity(.85);
		}
		
		img { margin: 0 auto; }
	}
}

/* Uitgelichte pagina blok
-------------------------------------------------------------------*/
div.highlightedpageblock {
	margin-bottom: 25px;
	
	h2 { 
		background: none;
		font-size: 17px;
		margin-bottom: 3px;
	}
	
	div.alinea {
		.nom;
		p { .nom; }
	}
	
}

/* Speler-detail
-------------------------------------------------------------------*/
ul.player-details {
	margin-bottom: 20px;
	
	li {
		padding: 2px 0;
		
		&.fb,
		&.tw {
			a {
				.block;
				.tk-milibus-bold;
				.i;
				float:left;
				font-size: 14px;
				padding: 0 0 10px 30px;
				text-decoration: none;
				
				.ease-out(.2s);
				:hover, :focus {
					color: #fff;
					.opacity-old(80);
					.opacity(.8);
				}
			}
		}
		
		&.fb a { background: url(/img/fb.png) no-repeat 0 1px; }
		&.tw a { background: url(/img/tw.png) no-repeat 0 1px; }
		
		&.age { margin-top: 15px; }
		
		span {
			.inline-block;
			.tk-milibus-bold;
			.i;
			width: 80px;
		}
	}	
}

div.player-nav {
	border-top: 1px #333 solid;
	padding-top: 5px;
	
	a {
		.tk-milibus-bold;
		.i;
		text-decoration: none;
		padding: 5px 0;
		font-size: 14px;
		
		.ease-out(.2s);
		:hover, :focus { color: #fff; }
		
		&.fleft { 
			padding-left: 6px;
			:hover, :focus { padding-left: 0; }
		}
			
		&.fright { 
			padding-right: 6px;
			:hover, :focus { padding-right: 0; }
		}
		
	}
}


/* iFader (default, vrijwel gelijk aan ifader.css)
------------------------------------------------------------------*/
div.js-ifader { .relative; }
div.js-ifader ul.js-ifader-nav,
div.js-ifader a.js-ifader-prev,
div.js-ifader a.js-ifader-next { .absolute; z-index: 5; }	/* Indien deze boven de items moet komen te liggen */
div.js-ifader div.js-ifader-item { left: 0; .absolute; top: 0; z-index: 0; }

div.js-ifader ul.js-ifader-nav { bottom: 0; right: 0; }
div.js-ifader ul.js-ifader-nav li { .inline; }

div.js-ifader a.js-ifader-prev,
div.js-ifader a.js-ifader-next { top: 45%; }
div.js-ifader a.js-ifader-next { left: auto; right: 0; }

/* iFader op spelersdetail
------------------------------------------------------------------*/
div#player-ifader.js-ifader,
div.playerimage {
	.relative;
	.fleft;
	margin: 0 25px 20px 0;
	width: 321px;
	height: 243px;
	
	div.ifader-items {
		.static;
		height: 214px;
	}

	&.wedstrijd-player {
		width: 480px;
		height: 360px;

		margin-bottom: 40px;

		div.ifader-items {
			height: 360px;
		}
	}
	
	div.controls {
		background: url(/img/ifader-balk.png) repeat-x;
		height: 29px;
		
		> span {
			.block;
			.fleft;
			.b;
			color: #ccc;
			padding: 4px 13px 0 12px;
			height: 29px;
			background: url(/img/ifader-span-border.png) no-repeat right 0;
		}
		
		a.js-ifader-prev,
		a.js-ifader-next {
			.static;
			.block;
			.overflow;
			.fleft;
			height: 29px;
			width: 30px;
			text-indent: -9999px;
			background: url(/img/ifader-nav.png) no-repeat;
			
			:hover, :focus { background-position: 0 -29px; }
		}
		
		a.js-ifader-prev {
			background-position: -30px 0;
			
			:hover, :focus { background-position: -30px -29px; }
		}
	}
}

/* iFader op spelersdetail
------------------------------------------------------------------*/
div#homepage-ifader.js-ifader {
	.relative;
	.nom;
	width: 940px;
	height: 530px + 29;
	
	div.ifader-items {
		.static;
		height: 530px;
		
		span.bijschrift {
			.absolute;
			.block;
			font-size: 13.5px;
			color: #fff;
			top: 530px;
			left: 121px;
			font-weight: 700;
			background: url(/img/ifader-balk.png) repeat-x;
			padding-top: 4px;
			height: 29px - 4;
			width: 815px;
			.overflow;
		}
	}
	
	div.controls {
		background: url(/img/ifader-balk.png) repeat-x;
		height: 29px;
		
		> span {
			.block;
			.fleft;
			.b;
			color: #ccc;
			padding: 4px 13px 0 12px;
			height: 29px;
			background: url(/img/ifader-span-border.png) no-repeat right 0;
		}
		
		a.js-ifader-prev,
		a.js-ifader-next {
			.static;
			.block;
			.overflow;
			.fleft;
			height: 29px;
			width: 30px;
			text-indent: -9999px;
			background: url(/img/ifader-nav.png) no-repeat;
			
			:hover, :focus { background-position: 0 -29px; }
		}
		
		a.js-ifader-prev {
			background-position: -30px 0;
			
			:hover, :focus { background-position: -30px -29px; }
		}
	}
	
	div.extra-controls {
		.absolute;
		left: 0;
		top: 0;
		width: 940px;
		
		a.js-ifader-prev,
		a.js-ifader-next {
			.absolute;
			.block;
			.overflow;
			top: 0;
			left: 0;
			height: 530px;
			width: 170px;
			background: url(/img/homepage-ifader-controls.png) no-repeat 20px 50%;
			text-indent: -9999px;
			
			.opacity-old(40);
			.opacity(.4);
			
			:hover, :focus { 
				.opacity-old;
				.opacity;
				}
		}
		
		a.js-ifader-next {
			left: auto;
			right: 0;
			background-position: -44px 50%;
		}
	}
}

/* iFader voor nieuwsberichten homepage
------------------------------------------------------------------*/
div#nieuws-fader.js-ifader {
	.relative;
	width: 513px;
	height: 307px;
	margin-bottom: 25px;
	
	.js-ifader-item {
		width: 513px;
		height: 307px;
		
		.afb {
			.absolute;
			.rounded-corners(4px);
			top: 0;
			left: 0;
			width: 513px;
			height: 307px;
			z-index: 2;
		}
		
		.overlay {
			.absolute;
			.rounded-corners(0 0 4px 4px);
			left: 0;
			bottom: 0;
			z-index: 3;
			background: url(/img/halftransparent.png);
			padding: 13px 20px 15px 17px;
			width: 513px - (20 + 17);
			
			h2 {
				margin-bottom: 3px;
				
				a {
					.block;
					text-decoration: none;
					
					.ease-out(.2s);
					:hover, :focus {
						color: #fff;
					}
				}
			}
			
			p {
				.nom;
				
				.date { .b; }
			}
		}
	}
	
	ul.js-ifader-nav {
		.absolute;
		top: 7px;
		right: 3px;
		bottom: auto;
		.fright;
		
		li {
			.fleft;
			margin-right: 5px;
			
			a {
				.block;
				.overflow;
				width: 14px;
				height: 15px;
				text-indent: -9999px;
				background: url(/img/newsfader-dots.png) no-repeat;
				
				:hover,
				&.js-ifader-active {
					background-position: -19px 0;					
				}
			}
			
		}
	}
	
}

/* Spelersoverzicht
------------------------------------------------------------------*/
body#component-team div.kolom-midden {
	background: none;
	
	ul {
		li {
			.fleft;
			background: url(/img/spelersoverz-table.png) no-repeat 0 bottom;
			margin: 0 17px 15px 0;
			width: 194px;
			&.first { .cleft; }
			&.last { .cright; margin-right: 0; }
			
			span.geen-foto,
			img { 
				.relative;
				z-index: 2;
				.ease-out(.3s);
			}
			
			span.geen-foto {
				.block;
				.rounded-corners(4px 4px 0 0);
				.tcenter;
				line-height: 218px;
				width: 194px;
				height: 218px;
				background: #000;
				color: #fff;
				font-size: 13.5px;	
			}
			
			.table-wrap {
				.overflow;
				padding-bottom: 11px;
			}
					
			table {
				.wide;
				.relative;
				z-index: 3;
				margin-top: -4px;
				
				th, td { .nomp; }
				
				thead {
					a {
						.block;
						.tk-milibus-bold;
						.i;
						.text-shadow(0px 1px 0px #00132b);
						.tcenter;
						.upper;
						color: #fff;
						font-size: 15px;
						background: url(/img/spelersoverz-a.png) no-repeat;
						padding: 9px 0 0 0;
						height: 37px - 9;
						text-decoration: none;
						margin-left: -1px;
						margin-bottom: 3px;
						
						:hover, :focus {
							background-position: 0 -37px;
							.text-shadow(0px 1px 0px #a74b00);
						}
					}	
				}
				
				tbody {
					.block;
					color: #262626;
					
					th, td {
						width: 164px / 2;
						padding: 2px 0;
					}
					
					th { 
						.i; .b;
						font-family: Arial, Verdana, Tahoma, sans-serif;
						padding-left: 15px;
					}
					
					td { 
						.tright;
						padding-right: 15px;
						
						a {
							display:block;
							color:#003B9A;
							font-weight:bold;
							font-size: 11px;
							margin: -3px 0 0;
							padding: 0 0 0 15px;
							text-align:center;
							text-decoration:none;
						}
					}
					
				}
			}
		}
	}
}

body#component-team div.kolom-midden ul.teamleden li.js-hover {
	
	table thead a {
		background-position: 0 -37px;
		.text-shadow(0px 1px 0px #e67712);
	}
	table td a {
		text-decoration:none;
		color:#FF9900;
	}
}

/* Wedstrijdoverzicht
------------------------------------------------------------------*/
body#component-matchfolder {
	h1 { .nom; }
}

ul.upcoming-matches.order-tickets {
	li.match_preview_large {
		padding-top: 33px;
		min-height: 237px - 33;
		.nom;
		
		.home-team,
		.guest-team {
			h2 {
				.text-shadow(none);
				.tcenter;
				.absolute;
				.nomp;
				.tk-milibus-bold;
				text-transform: none;
				font-style: normal;
				bottom: 0;
				left: 0;
				width: 145px;
				background: none;
				color: #fff;
				font-size: 14px;
				text-shadow: none;
				text-transform: none;
				padding: 0;
				background: none;
			}			
		}

	}
}

ul.upcoming-matches,
ul.archived-matches {
	
	li {
		
		h2 {
			margin-bottom: 20px;
		}
		
		&.match_preview_large {
			.relative;
			background: url(/img/next-match-bg.png) no-repeat 0 20px;
			min-height: 237px;
			margin-bottom: 13px;
			
			h2 {
				.b;
				.text-shadow(0px 1px 0px #960800);
				.tcenter;
				.nom;
				background: none;
				font-family: Verdana, Arial, Tahoma, sans-serif;
				font-size: 11px;
				font-style: normal;
				color: #fff;
				text-transform: lowercase;
				padding: 3px 0 10px;
				background: url(/img/next-match-head.png) no-repeat 50% 0;
			}
			
			.home-team { .fleft; margin-left: 28px; }
			.guest-team { .fright; margin-right: 28px; }
			
			.home-team,
			.guest-team {
				.relative;
				margin-top: 20px;
				width: 145px;
				height: 145px;
				
				h3 {
					.text-shadow(none);
					.tcenter;
					.absolute;
					.nomp;
					text-transform: none;
					font-style: normal;
					bottom: 0;
					left: 0;
					width: 145px;
					background: none;
					color: #fff;
					font-size: 14px;
				}	
			}
			
			.center {
				.absolute;
				top: 41px;
				left: 201px;
				width: 213px;
				
				.datetime {
					.tk-milibus-bold;
					.text-shadow(0px -1px 0px #002356);
					font-size: 16px;
					margin-bottom: 50px;
					
					span {
						.block;
						.tcenter;

						&.date {
							.fleft;
							.tright;
							width: 103px;
						}
						
						&.time {
							.fright;
							.tleft;
							width: 91px;
						}
						
					}
				}
				
				.extra-matchinfo {
					.tk-milibus-light;
					.i;
					.text-shadow(0 -1px 0 #002356);
					.tcenter;
					.nom;
					font-size: 12px;
					
					span { .block; }
				}
				
				.ticket-price {
					.absolute;
					top: 162px - 41;
					left: 55px;
					
					.nom;
					.tcenter;
					.b;
					font-size: 16px;
					padding: 6px 1px 0 0;
					width: 105px - 1;
					height: 34px - 6;
					background: url(/img/prijs-bg-match_preview_large.png) no-repeat;
					
					.overlay {
						.absolute;
						.overflow;
						background: url(/img/prijs-overlay-match_preview_large.png) no-repeat 1px 3px;
						top: 0;
						left: 0;
						width: 105px;
						height: 34px;
						text-indent: -99999px;
					}
				}
				
				a.order-tickets {
					.absolute;
					left: 34px;
					top: 117px;
				}
				
			}
			
		}
		
		&.match_preview_small {
			margin-bottom: 15px;
			background: url(/img/match_preview_small-bg.png) no-repeat;
			padding: 10px 13px 0;
			height: 105px - 10;
			
			.datetime {
				.nom;
				.fleft;
				width: 52px;
				
				span {
					.block;
					.tk-milibus-bold;
					.tcenter;
					line-height: 100%;
					
					&.time {
						.text-shadow(0 -1px 0 #002356);
						font-size: 11px;
						color: #fff;
					}
					
					&.day {
						.text-shadow(0 1px 0 #fff);
						color: #003171;
						font-size: 28px;
						padding: 20px 0 12px;
					}
					
					&.month {
						.text-shadow(0 1px 0 #000);
						font-size: 16px;
						color: #fff;
					}
					
				}
				
			
			}
			
			&.archive {
				position:relative;
				
				.score {
					background: url(/img/score-archive.png) no-repeat;
					.tk-milibus-bold;
					color: #fff;
					font-style: normal;
					font-size: 24px;
					height: 37px;
					position:absolute;
					right: 20px;
					top: 34px;
					width: 102px;
					
					&.winners { color: #25A10C; }
					&.losers { color: #CD0C0C; }
					
					span {
						display:block;
						padding-top: 9px;
						text-align:center;
						.text-shadow(0px 1px 0px #003a98);
						width: 50px;
					}
					
					.home-score {
						.fleft;
					}
					.guest-score {
						.fright
					}		
					.overlay {
						background: url(/img/score-archive-overlay.png) no-repeat;
						height: 19px;
						text-indent: -9999px;
						position:absolute;
						top: 2px;
						width: 102px;
					}	
				}
			}
			&.js-hover a.wsverslag {
				color:#fff;
			}
				
			a.wsverslag {
				.block;
				.tcenter;
				.b;
				color: #1760c0;
				font-size: 10px;
				font-family: Verdana, Arial, Tahoma, sans-serif;
				text-decoration: none;
				text-transform: lowercase;
				
				position:absolute;
				bottom: 12px;
				left: 237px;
				
				.ease-out(.2s);
				:hover, :focus { color: #fff; }
			}
			
			.uit,
			.thuis {
				.fleft;
				.tk-milibus-bold;
				.upper;
				.text-shadow(0 1px 0 #0038ff);
				.tcenter;
				width: 65px;
				font-size: 12px;
				margin: 29px 0 10px 9px;
				padding-top: 3px;
				height: 26px - 3;
			}
			
			.thuis { color: #25a10c; }
			.uit { color: #f01500; }
			
			.opponents {
				.fleft;
				width: 280px;
				margin: 20px 0 0 7px;
				
				h3 {
					.nom;
					.tcenter;
					.tk-milibus-bold;
					color: #fff;
					font-size: 14px;
					width: 108px;
					
					&.home-team {
						.fleft;
					}
					&.guest-team {
						.fright;
					}
				}
			}
			
			.extra {
				.nom;
				.fright;
				.tright;
				.tk-milibus-light;
				.i;
				width: 148px;
				margin-top: 10px;
				
				a.order-tickets {
					margin-top: 10px;
					.fright;
					font-style: normal;
					
					:active {
						background-position: 0 -43px;
					}
				}
				
				.label {
					.block;
					.tright;
					.upper;
					.tk-milibus-bold;
					.i;
					.text-shadow(0 1px 0 #002356);
					color: #ff9900;
				}
			}
			
		}
		
	}
	
}

ul.archived-matches { 
	padding: 15px 0 0 0;
}

a.order-tickets,
a.order-tickets-homepage {
	.block;
	.upper;
	.tcenter;
	.tk-milibus-bold;
	.text-shadow(0 2px 0 #b45e00);
	font-size: 15px;
	text-decoration: none;
	color: #fff;
	letter-spacing: -.5px;
	background: url(/img/bestel-btn-match_preview_large.png) no-repeat;
		
	padding: 9px 0 0;
	width: 148px;
	height: 44px - 9;
	
	:hover, :focus {
		.text-shadow(0 1px 0 #FDB604);
		color:#893D00;
	}
	:active {
		background-position: 0 -43px;
		.text-shadow(0 1px 0 #0037CA);
		color:#00132D;
	}
}

a.order-tickets-homepage {
	margin: 20px auto 0px;
}

/* Fanzone
 -------------------------------------------------------------------*/
body#component-fanzone {
	div.ytvideos {
	 	padding-bottom: 20px;
		margin-bottom: 20px;
		background: url(/img/black-darkgrey-borderpattern.gif) repeat-x 0 bottom;
		
		.youtube_gasterra {
			width: 234px;
		}
		
		h2 {
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #000);
			font-size: 20px;
			margin-bottom: 8px;
			color: #ff9900;			
		}
		
		h3 {
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #00132b);
			font-size: 13.5px;
			line-height: 16px;
			margin-bottom: 10px;
			color: #ff9900;		
		}
	}
	 
	dl.zie-ook {
		.fleft;
		width: 235px;
		
		dt {
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #000);
			font-size: 18px;
			color: #ff9900;
			margin-bottom: 12px;
		}
		
		dd {
			
			li {
				background: url(/img/black-darkgrey-borderpattern.gif) repeat-x 0 bottom;
				
				a {
					.block;
					.tk-milibus-light;
					color: #fff;
					text-decoration: none;
					padding: 5px 0 5px 23px;
					/* border-bottom: 1px #3e3e3e solid; */
					background: url(/img/dot.png) no-repeat 2px 12px;
					
					.ease-out(.2s);
					:hover, :focus {
						color: #ff9900;
					}
				}
				
				:last-child {
					background: none;
				}
			}
			
		}
	}
	
	dl.twittersearch {
		.fright;
		width: 235px;
		
		dt {
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #000);
			font-size: 18px;
			color: #ff9900;
			margin-bottom: 12px;
		}
		
		dd {
			ul {
				
				li {
					padding-bottom: 10px;
					margin-bottom: 12px;
					/* border-bottom: 1px #3e3e3e solid; */
					background: url(/img/black-darkgrey-borderpattern.gif) repeat-x 0 bottom;
					
					img { .fleft; }
					.tweet {
						.fright;
						width: 170px;
						
						a {
							text-decoration: none;
							
							:hover, :focus { .u; }
							
							&.author {
								.block;
								.tk-milibus-bold;
								.i;
								color: #999;
								line-height: 100%;
								padding-bottom: 4px;
								
								.ease-out(.2s);
								:hover, :focus {
									color: #ff9900;
									text-decoration: none;
								}
							}
						}
						
					}	
					
					:last-child { 
						border: 0;
						background: none;
					}
				}
			}
		}
	}
	
}
 
body#component-fanzone div.kolom-rechts div.photocollage {
	.rounded-corners(3px);
	background: url(/img/black-grey-dotspattern.gif);
	border: 2px #3a3a3a solid;
	padding: 12px 10px 14px 16px;
	margin-bottom: 15px;
	
	h2 { 
		background: none;
		font-size: 16px;
		color: #fff;
		.text-shadow(0px 1px 0px #000);
		
		span {
			.inline;
			.nop;
			background: none;
			color: #ff9900;
		}
	}
	
	a {
		.fleft;
		margin: 0 1px 1px 0;
		
		.ease-out(.3s);
		:hover, :focus {
			.opacity-old(85);
			.opacity(.85);
		}
	}
	
	div.klein-wrapper {
		.fleft;
		height: 100px;
		.overflow;
		
		a { 
			.fnone;
			.block;
		}
	}
	
}

/* Fanzone blok 
-------------------------------------------------------------------*/ 
div.fanzoneblok {
	margin-bottom: 15px;
	
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	margin-bottom: 60px;
	
	h2 {
		margin: 0 !important;
		background: url(/img/submenu-dt-breed.png) no-repeat -1px 0;
	
		a,
		span {
			.block;
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #00132b);
			font-size: 15px;
			color: #fff;
			padding: 9px 5px 0 15px;
			height: 37px - 9;
			text-decoration: none;
			
		}
		
		a {
			:hover, :focus,
			:active, &.active {
				color: #ff9900;
				.text-shadow(0px 1px 0px #0c2c5d);
			}	
		}
	}
	
	.inner {
		.relative;
		.tk-milibus-light;
		.rounded-corners(0 0 5px 5px);
		color: #333;
		background: #fff;
		padding: 13px 30px 10px 15px;
		font-size: 14px;
		line-height: 30px;
		
		p { margin-bottom: 10px; }
		
		img.afb {
			.absolute;
			/* right: -51px; */
			right: -40px;
			bottom: -60px;
		}
		
	}
}

a.fanzone-btn {
	.block;
	.tcenter;
	.tk-milibus-bold;
	.text-shadow(0 2px 0 #b45e00);
	font-size: 16px;
	text-decoration: none;
	color: #fff;
	letter-spacing: -.5px;
	background: url(/img/fanzone-btn.png) no-repeat -1px 0;
		
	padding: 6px 0 0;
	width: 163px;
	height: 44px - 5;
	
	:hover, :focus, :active {
		background-position: -1px -43px;
		.text-shadow(0 2px 0 #00132b);
	}
	:active {
		color: #00132D;
		.text-shadow(0px 1px 0px #0037CA);
	}
}
 
/* Competitiestand 
-------------------------------------------------------------------*/
div.competitie {
	.fleft;
	margin-right: 18px;
	margin-bottom: 25px;
	width: 376px;
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	
	h2 {
		.nom;
		height: 37px;
		padding-left: 5px;
		background: url(/img/blue-head-bg.png) no-repeat 0 -37px;
		
		span {
			.block;
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #00132b);
			background: url(/img/blue-head-bg.png) no-repeat right 0;
			font-size: 15px;
			color: #fff;
			padding: 9px 5px 0 10px;
			height: 37px - 9;
			text-decoration: none;	
		}
	}
	
	ol {
		list-style: none;
		background: #f0f0f0;
		border: 1px #9a9a9a solid;
		border-width: 0 1px;
		.rounded-corners(0 0 5px 5px);
			
		li {
			border-bottom: 1px #cdcdcd solid;
			border-top: 1px solid #fff;
			padding: 8px 10px 8px 16px;
			background: #F7F7F7;
			
			&.odd {
				background: none;
				padding-bottom: 8px;
			}
			
			&.gtf {
				border: 1px #e67712 solid;
				border-width: 1px 0;
				margin: -1px 0 0;
				background: #ff9a00 url(/img/submenu-a-hover.png) repeat-x;
				.tk-milibus-bold;
				.text-shadow(0 1px 0 #a74b00);
				color: #fff;
				
				span.team,
				span.score,
				span.nr {
					.tk-milibus-bold;
					.text-shadow(0 1px 0 #a74b00);
					color: #fff;
				}
			}
			
			&.last {
				border-bottom: 0;
				padding-bottom: 8px;
				.rounded-corners(0 0 5px 5px);
			}
			
			span {
				&.team,
				&.score {
					.fleft;
					.tk-milibus-bold;
					color: #262626;
					font-size: 13.5px;
				}
				
				&.score {
					.fright;
					.tcenter;
					width: 35px;
				}
				
				&.nr {
					.tk-milibus-light;
					.fleft;
					width: 30px;
					color: #999;
					font-size: 13.5px;
				}	
			}
			
		}
	}
	
}

/* Partners en Sponsoren blok 
-------------------------------------------------------------------*/
div#partners-sponsoren-wrap {
	width: 264px;
	float:left;
}

div.partners-sponsoren {
	.fleft;
	width: 264px;
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	margin-bottom: 14px;
	
	h2 {
		.nom;
		height: 37px;
		padding-left: 5px;
		background: url(/img/blue-head-bg.png) no-repeat 0 -37px;
		
		span {
			.block;
			.tk-milibus-bold;
			.i;
			.upper;
			.text-shadow(0px 1px 0px #00132b);
			background: url(/img/blue-head-bg.png) no-repeat right 0;
			font-size: 15px;
			color: #fff;
			padding: 9px 5px 0 10px;
			height: 37px - 9;
			text-decoration: none;	
		}
	}
	
	div.inner {
		background: #f0f0f0;
		padding: 10px 15px;
		.rounded-corners(0 0 5px 5px);
		border: 1px #9a9a9a solid;
		border-width: 0 1px;
		
		h3 {
			.tcenter;
			background: url(/img/gray-white-border.png) repeat-x 0 10px;
			margin-bottom: 15px;
			
			span {
				.nom;
				.tk-milibus-bold;
				.i;
				font-size: 15px;
				background: #f0f0f0;
				color: #003b9a;
				padding: 0 5px;
				text-transform: lowercase;
			}
			
		}
		
		a {
			.block;
			
			.ease-out;
			:hover, :focus {
				.opacity-old(85);
				.opacity(.85);
			}
		}
		
		img {
			margin: 0 auto 15px;
		}
		
	}
	
}

/* iFader voor subsponsoren op homepage
------------------------------------------------------------------*/
div#sponsoren-home-ifader.js-ifader {
	.relative;
	width: 185px;
	height: 90px;
	margin: 0 auto 15px;;
	
	.js-ifader-item {
		width: 185px;
		height: 90px;
		background: #f0f0f0;
	}
}

/* Fanzone blok homepage
------------------------------------------------------------------*/
body#component-homepage div.highlightedpageblock {
	.fright;
	width: 264px;
	.rounded-corners(5px 5px 5px 5px);
	.box-shadow(0 0 5px #333);
	
	h2 {
		.nom;
		height: 37px;
		padding-left: 5px;
		background: url(/img/blue-head-bg.png) no-repeat 0 -37px;
		
		a {
			.block;
			.tk-milibus-bold;
			.i;
			.upper;
			text-decoration: none;
			.text-shadow(0px 1px 0px #00132b);
			background: url(/img/blue-head-bg.png) no-repeat right 0;
			font-size: 15px;
			color: #fff;
			padding: 9px 5px 0 10px;
			height: 37px - 9;
			text-decoration: none;	
		}
	}
	
	.inner {
		.relative;
		.rounded-corners(0 0 5px 5px);
		.tk-milibus-light;
		background: url(/img/fanzone-products.png) no-repeat 116px bottom #F0F0F0;
		border: 1px #9a9a9a solid;
		border-width: 0 1px;
		color: #333;
    	font-size: 14px;
    	line-height: 30px;
    	padding: 8px 30px 10px 15px;
		min-height: 338px - (37 + 8 + 10);
		
		p { margin-bottom: 10px; }
		
		img.afb {
			.absolute;
			right: -51px;
			bottom: -60px;
		}
		
		.products {
			background: url(/img/fanzone-products.png) no-repeat -146px 0;
			bottom: 0;
			display: block;
			height: 193px;
			position: absolute;
			right: -95px;
			width: 95px;
		}
	}
}

/* Crosslinklist blok
------------------------------------------------------------------*/
div.zie-ook {
	margin-bottom: 20px;
	
	ul {
		a {
			.block;
			.tk-milibus-light;
			font-size: 12px;
			border-bottom: 1px solid #3e3e3e;
			padding: 5px 14px 6px 20px;
			background: url(/img/dot.png) no-repeat 2px 12px;
			text-decoration: none;
			color: #fff;
			
			.ease-out(.2s);
			:hover, :focus {
				color: #ff9900;
			}
		}	
	}
}

body#component-homepage div.zie-ook ul {
	li {
		width: 176px;
		
		&.first {
			.fleft;
			.cleft;
		}
		
		&.second {
			.fright;
			.cright;
		}
	}
}


/* Twitter blok
------------------------------------------------------------------*/
body#component-homepage div.kolom-rechts div.twitteruser h2 { margin-bottom: 10px; }

ul.twitter {
	margin-bottom: 15px;
	
	li {
		padding: 10px 0;
		border-bottom: 1px solid #3e3e3e;
		
		div.tweet {
			.fright;
			.tk-milibus-light;
			font-size: 12px;
			color: #fff;
			width: 300px;
			
			.datetime {
				.block;
				.tk-milibus-bold;
				.i;
				color: #999;
			}
		}
		
		&.last { 
			border: 0;
			padding-bottom: 0;
		}
		
		&.volgons {
			.tcenter;
			border: 0;
			background: url(/img/h2-bg.gif) repeat-x 0 11px;
			margin: 10px 0 0;
			padding: 0;
			
			a {
				.tk-milibus-bold;
				background: #000 url(/img/kolom-container.png) repeat-x 0 -380px;
				color: #467fcf;
				font-size: 11px;
				padding: 0 5px;
				text-decoration: none;
				
				.ease-out(.2s);
				:hover, :focus { color: #fff; }
			}
		}
	}
}

/* Homepage matches
------------------------------------------------------------------*/
div.homepage_matches {
	padding: 35px 0 60px 6px;
	
	ul {
		li {
			.relative;
			.fleft;
			background: url(/img/blue-box.png) no-repeat;
			margin-right: 15px;
			padding: 12px 10px 0 10px;
			width: 178px - (2 * 10);
			height: 198px - 12;
			
			h3 {
				.tk-milibus-bold;
				.tcenter;
				color: #fff;
				font-size: 14px;
			}
			
			.teams-absolute {
				.relative;
				height: 95px;
				background: url(/img/vs.png) no-repeat 50% 50%;
				margin-bottom: 15px;
				
				h3 {
					.absolute;
					width: 158px;
					
					&.home {
						bottom: 59px;
						left: 0;
					}
					
					&.guests {
						top: 58px;
						left: 0;
					}
				}
				
			}
			
			p.score {
				.nom;
				.relative;
				width: 124px;
				height: 42px;
				margin: 0 auto;
				background: url(/img/home-score-bg.png) no-repeat;
				margin-bottom: 5px;
				
				span {
					.block;
					.tk-milibus-bold;
					.tcenter;
					width: 60px;
					font-size: 32px;
					line-height: 100%;
					padding-top: 5px;
					.text-shadow(0px 1px 0px #003a98);
					
					&.home-score { .fleft; }
					&.guest-score { .fright; }
					
					&.overlay {
						.absolute;
						width: 124px;
						height: 33px;
						top: 0;
						left: 0;
						text-indent: -9999px;
						background: url(/img/home-score-overlay.png) no-repeat;
					}
				}
				
				&.winners { color: #25a10c; }
				&.losers { color: #cd0c0c; }
			}
			
			a.wsverslag {
				.block;
				.tcenter;
				.b;
				color: #1760c0;
				font-size: 10px;
				font-family: Verdana, Arial, Tahoma, sans-serif;
				text-decoration: none;
				text-transform: lowercase;
				
				.ease-out(.2s);
				:hover, :focus { color: #fff; }
			}
			
			.teams {
				h3 {
					padding: 4px 0;
				}
			}
			
			p.date {
				.nom;
				.tcenter;
				.tk-milibus-bold;
				font-size: 13.5px;
				color: #176dd6;
				margin-bottom: 10px;
				.text-shadow(0px -1px 0px #002356);
			}
			
			a.order-tickets {
				.absolute;
				.block;
				.tcenter;
				.b;
				.text-shadow(0 1px 0 #b45e00);
				font-size: 11px;
				font-family: Verdana, Arial, Tahoma, sans-serif;
				width: 148px;
				padding: 3px 0 1px;
				height: 34px - 4;
				margin: 0 auto;
				bottom: 9px;
				left: 15px;
				background: url(/img/order-tickets-home.png) no-repeat;
				text-transform: none;
				
				:hover, :focus {
					.text-shadow(0 1px 0 #FDB604);
					color:#893D00;
				}
				:active {
					background-position: 0 -43px;
					.text-shadow(0 1px 0 #0037CA);
					color:#00132D;
				}
			}
			
			span.vs {
				.block;
				.overflow;
				text-indent: -9999px;
				height: 15px;
				background: url(/img/vs.png) no-repeat 50% 0;
			}
			
			&.last { margin-right: 0; }
			
			&.big {
				background: none;
				
				&.js-hover .js-target {
					color:#893D00;
					.text-shadow(0px 1px 0px #FDB604);
					
					:active {
						color: #00132D;
						.text-shadow(0px 1px 0px #0037CA);
					}
				}
				
				p.date {
					margin: 0;
				}
				
				> div {
					.absolute;
					background: url(/img/blue-box-big.png) no-repeat;
					padding: 16px 20px 4px 20px;
					width: 232px - (2 * 20);
					height: 259px - 20;
					margin-left: -35px;
					margin-top: -40px;
					z-index: 2;
					
					div.teams {
						height: 144px;
					
						h3 {
							font-size: 20px;
							padding: 8px 0;
							line-height: 23px;
						}
						
						span.vs {
							background-image: url(/img/vs-big.png);
							height: 18px;
						}
					}
					
					p.score {
						width: 160px;
						height: 54px;
						background-image: url(/img/home-score-big-bg.png);
						
						span {
							font-size: 43px;
							padding-top: 6px;
							width: 78px;
							&.overlay {
								background-image: url(/img/home-score-big-overlay.png);
								width: 159px;
								height: 43px;
								left: 1px;
								top: 3px;
							}	
						}
						
					}
					
					a.live-msgs {
						.block;
						.tcenter;
						.text-shadow(0px -1px 0px #960800);
						width: 162px;
						padding: 9px 0 0;
						height: 34px - 9;
						background: url(/img/home-live-msgs.png) no-repeat;
						text-decoration: none;
						font-size: 11px;
						font-family: Verdana, Arial, Tahoma, sans-serif;
						color: #fff;
						.absolute;
						bottom: -9px;
						left: 33px;
						
						:hover, :focus {
							color:#6B0700;
							.text-shadow(0px 1px 0px #FF6366);
						}
						:active { color: #000; }
					}
					
				}
			}
			
		}
		li.js-hover a.js-target {
			color: #fff;
			
			&.order-tickets {
				.text-shadow(0 1px 0 #FDB604);
				color:#893D00;
				
				:active {
					background-position: 0 -43px;
					.text-shadow(0 1px 0 #0037CA);
					color:#00132D;
				}
				&.small:active {
					background-position: 0 -33px;
				}
			}
		}
	}
}

/* Homepage advertenties */
div.horizontal-ads {
	.clear;
	margin: 0 -10px 15px -3px;
	
	a {
		.block;
		.fleft;
		.cleft;
		margin-bottom: 10px;
		
		.ease-out(.3s);
		:hover, :focus {
			.opacity-old(85);
			.opacity(.85);
		}
		
		&.last {
			.fright;
			.cright;
		}
		
		img {
			border-top: 1px #000 solid;
			border-bottom: 1px #555 solid;
		}	
	}
}

/* Verticale advertentie */
body#component-homepage div.kolom-container { .relative; }
a.vertical-ad {
	.block;
	.absolute;
	width: 120px;
	top: 23px;
	right: -142px;
	
	.ease-out(.3s);
	:hover {
		.opacity-old(80);
		.opacity(.8);
	}
}

/* Kantlijn advertenties */
div.blockadvert {
	margin-bottom: 15px;
	
	a {
		.block;
		.rounded-corners(4px);
		.tcenter;
		.box-shadow(0 0 4px #111 inset);
		padding: 28px 5px 28px;
		text-decoration: none;
		background: #333;
		
		:hover, :focus {
			img { 
				.opacity-old(85);
				.opacity(.85);
			}
		}
		
		img { 
			.ease-out(.3s);
			margin: 0 auto;
		}
	}	
	
}

/* Sharethis */
div.sharethis {
	left: 248px;
	position: absolute;
	text-align: center;
	top: 223px;
	width: 329px;
}

div.sharethisnews {
	position: absolute;
    right: 19px;
    top: 20px;
}

/* BBC Bedrijven
-------------------------------------------------------------------*/
div.bbc-page h2 { 
	font-size: 21px; 
	margin-bottom: 10px;
	padding-left: 3px; 
}

ul.bbcloop {
	margin-bottom: 10px;

	li {
		.block;
		.fleft;
		padding: 0;
		width: 194px;
		min-height: 126px;
		margin: 0 17px 15px 0;
		background: url(/img/bbc-preview-bg.png) no-repeat;
		
		&.first { .cleft; }
		&.last { .cright; margin-right: 0; }
		
		.afb-wrap {
			.block;
			padding: 5px;
			height: 92px - (2 * 5);
			background: url(/img/bbc-preview-top.png) no-repeat;
		}
		
		img,
		span.geen-foto {
			.block;
			.tcenter;
			/* margin-bottom: 11px; */
			height: 82px;
			line-height: 82px;
			vertical-align: middle;
			color: #333;
		}
		
		h3 a {
			.block;
			.tk-milibus-bold;
			.i;
			.text-shadow(0px 1px 0px #00132b);
			.tcenter;
			.upper;
			color: #fff;
			font-size: 15px;
			text-decoration: none;
			background: url(/img/bbc-preview-bg.png) no-repeat 0 bottom;
			border-top: 1px #0047f9 solid;
			padding: 6px 0 8px;
			
			&:hover, &:focus { 
				.text-shadow(0px 1px 0px #a74b00);
				background-position: -194px bottom;
				border-color: #ffe59b;
			}
		}
		
		&.js-hover h3 a {
			.text-shadow(0px 1px 0px #a74b00);
			background-position: -194px bottom;
			border-color: #ffe59b;
		}
	}
}

/* Filter */
div.bbc-filter {
	.rounded-corners(4px);
	background: url(/img/black-grey-dotspattern.gif) repeat;
	border: 2px #424242 solid;
	padding: 15px 13px 10px;
	margin-bottom: 30px;
}

form#bbc-filter {
	padding-bottom: 15px;
	margin-bottom: 13px;
	background: url(/img/h2-bg.gif) repeat-x 0 bottom;
	
	label {
		.tk-milibus-bold; 
		width: auto;
		margin-right: 15px;
	}
	
	input, select { 
		.arial;
		.fleft;
		.rounded-corners(3px);
		color: #00050b;
		font-size: 11px;
		margin-right: 15px;
		.box-shadow(2px 2px 3px #d9d9d9 inset);
		border: 1px #e7e7e7 solid;
		
		.ease-out(0.2s);
		:hover, :focus {
			color: #333;
		}
	}
	
	input {
		padding: 3px 5px;
		width: 175px - (2 * 5);
	}
	
	select {
		padding: 3px 5px;
		width: 195px - (2 * 5);
		margin-right: 0;
	}
}

ul.letter-filter {
	li {
		.fleft;
		
		a {
			.tk-milibus-semibold;
			font-size: 13px;
			text-decoration: none;
			color: #fff;
			padding: 1px 5px 1px 7px;
			background: url(/img/filter-seperator.gif) no-repeat left 50%;
			
			&.first { padding-left: 0; background: none; }
			
			.ease-out(.2s);
			:hover, :focus, &.active {
				color: #ff9900;
			}	
		}
	}
}

/* Detailgpagina */
body#component-bbcitem {
	
	div.kolom-content {
		.fleft;
		width: 416px;
		
		h1 { margin-bottom: 5px; }
		
		h2 {
			.text-shadow(0);
			font-style: normal;
			font-size: 13px;
			color: #fff;
		}
		
		.border-wrapper {
		    width: 9000px;
		    white-space: nowrap;  
			.overflow;
			
			h3 {
			    .fleft;
				.cnone;
				margin: 0 10px 10px 0;
				.tk-milibus-bold;
				.i;
				.upper;
				.text-shadow(0px 1px 0px #000);
				font-size: 16px;
				color: #ff9900;
			}
			
			span.border {
				.fleft;
				background: url(/img/h2-bg.gif) repeat-x 0 11px;
				width: 3000px;
			} 
		}

		div.bbc-contactgegevens {
			margin-bottom: 20px;
			
			ul { width: 203px; }
		}
		
	}
	
	.bbc-logo {
		.fright;
		.rounded-corners(3px);
		padding: 25px;
		width: 184px - (2 * 25);
		background: #fff;
	}
	
	div#subinhoud-rechts {
		a.cta { padding-top: 11px; }
	}
} 

div.bbc-contactpersonen {
	
	ul {
		padding-top: 5px;
		
		li {
			float: left;
			width: 202px;
			margin: 0 12px 15px 0;
			
			&.last { margin-right: 0; }
			
			a.foto {
				.block;
				height: 194px;
				text-decoration: none;
				
				span.geen-foto {
					.block;
					.rounded-corners(4px 4px 0 0);
					.tcenter;
					color: #333;
					background: #fff;
					padding-top: 90px;
					height: 194px - 90;
				}
			}
			
			h4 a {
				.block;
				.tcenter;
				.text-shadow(0px 1px 0px #00132b);
				.upper;
				padding-top: 8px;
				height: 51px - 8;
				background: url(/img/bbc-contactpersoon-h2.png) no-repeat;
				text-decoration: none;
				color: #fff;
				font-size: 15px;
				line-height: 18px;
				
				.functie {
					.block;	
					color: #ff9900;
					font-size: 11px;
					.text-shadow(0px 1px 0px #0047f9);
					text-transform: none;
				}
				
				:hover, :focus {
					background-position: -202px 0;
					.text-shadow(0 1px 0 #a74b00);
					
					.functie {
						.text-shadow(0 1px 0 #a74b00);
						color: #fff;
					}
				}
			}
			
			&.js-hover {
				h4 a {
					background-position: -202px 0;
					.text-shadow(0 1px 0 #a74b00);
					
					.functie {
						.text-shadow(0 1px 0 #a74b00);
						color: #fff;
					}
				}
			}
			
		}
	}
}

/* Inloggen en nieuw ww opvragen BBC form */
form#bbc-resetpass,
form#bbc-login {
	.rounded-corners(4px);
	background: url(/img/black-grey-dotspattern.gif) repeat;
	border: 2px #424242 solid;
	padding: 12px 13px 13px;
	margin-bottom: 15px;
	
	ul.velden {
		li {
			margin: 0;
			padding: 5px 0;
			
			label {
				.tk-milibus-bold;
				.i;
				.upper;
				font-size: 13px;
				color: #ff9900;	
				width: 140px;
			}
			
			input.text {
				width: 264px;
				.arial;
				.fleft;
				.rounded-corners(3px);
				color: #00050b;
				font-size: 11px;
				.box-shadow(2px 2px 3px #d9d9d9 inset);
				border: 1px #e7e7e7 solid;
				padding: 4px 5px;
				
				.ease-out(0.2s);
				:hover, :focus {
					color: #333;
				}
			}
			
			&.forgot-password {
				padding: 2px 0 6px 150px;
				
				a {
					color: #fff;
					text-decoration: none;
					
					:hover, :focus { .underline; }
				}
			}
			
		}
	}
	
	div.buttons {
		padding: 4px 0 0 150px;
		
		input {
			.upper;
			.tcenter;
			.tk-milibus-bold;
			.text-shadow(0 2px 0 #b45e00);
			font-size: 15px;
			color: #fff;
			border: 0;
			height: 41px;
			padding: 0 0 8px;
			letter-spacing: -.5px;
			
			&.login {
				width: 104px;
				background: url(/img/bbc-login.png) no-repeat;
				
				:hover, :focus { background-position: -104px 0; }
			}
			
			&.recover-pass {
				width: 204px;
				background: url(/img/recover-pass.bg.png) no-repeat;
				
				:hover, :focus { background-position: -204px 0; }
			}
			
			:hover, :focus {
				.text-shadow(0 1px 0 #00132B);
				color: #fff;
			}
		}
	}
	
}


