/* common styles */
body, table, td, th, p {
	color: #FFFFFF;
	margin: 0px;
	padding: 0px;
} 
body {
	background: #63C264 url(../images/dealblas_bg.jpg) 50% top no-repeat;
	height: 100%;
}
body{
	font-family: arial;
	font-size: 0.8em;
}
img {
	border: 0px;
}
table {
	font-size: 1em;
	border-collapse:	collapse;
}
	th {
		text-align: left;
		border-collapse:	collapse;

	}
	th, td {
		vertical-align: top;
		padding: 2px 10px 3px 0px;
	}
	#textColom th, td {

		padding: 5px;
	}
	#textColumn table p{
		margin:0px;
	}
a {
	color: white;
	text-decoration: none;
}
p a{
	text-decoration: underline;
}
a img {
	text-decoration: none;
	margin: 2px 5px !important;
	border: 0 !important;
}
a:hover h1, a:hover h2, a:hover h3, a:hover h4 {
	text-decoration: underline;
	color: white
}
a:hover {
	color: #CB0305;
}
p {
	margin: 5px 0px;
}
.small {
	font-size:0.8em;
}
#textColumn a{
	color: #CB0305; /* red */
}
#textColumn a:hover{
	color: #000000 !important;
}
a.arrow {
	display: block;
	background: url(../images/link_arrow.gif) left 3px no-repeat !important;
	padding-left: 10px;
	font-weight: bold;
	text-decoration: none;
}
a.arrow:hover {
	color: #ccf7cc;
	text-decoration: underline;
	background: url(../images/link_arrow_sel.gif) left 3px no-repeat !important;
}
a.grey_arrow, a.red_arrow {
	display: block;
	padding-left: 10px;
	text-decoration: none;
}
a.grey_arrow {
	color: #333333;
	background: url(../images/link_grey_arrow.gif) left 3px no-repeat;
}
a.red_arrow {
	color: #AF0003;
	background: url(../images/link_red_arrow.gif) left 3px no-repeat;
}
a.grey_arrow:hover, a.red_arrow:hover {
	color: #333333;
	text-decoration: underline;
}
a.red_arrow:hover {
	background: url(../images/link_grey_arrow.gif) left 3px no-repeat;
}
a.back_arrow, a.back_arrow:hover {
	color: #333333 !important;
	background: url(../images/back_arrow.gif) 14% 6px no-repeat;
	padding-left: 20px !important;
	border: 1px solid #CCCCCC !important;
}
a.back_arrow:hover {
	color: black;
	background: #DFDFDF url(../images/back_arrow.gif) 14% 6px no-repeat;
}
a.next_arrow, a.next_arrow:hover {
	color: #333333 !important;
	background: url(../images/next_arrow.gif) 88% 6px no-repeat;
	padding-right: 19px !important;
	border: 1px solid #CCCCCC !important;
}
a.next_arrow:hover {
	color: black !important;
	background: #DFDFDF url(../images/next_arrow.gif) 88% 6px no-repeat;
}
a.clickbutton, a.clickbutton:hover {
	display: block;
	width: 160px;
	padding:10px;
	margin: 10px 0px;
	text-align: center;
	background: #AF0003;
	color: white !important;
	text-decoration: none;
	border: 1px solid white;
}
a.clickbutton:hover {
	color: #333333 !important;
	background: white;
	border: 1px solid #333333;
}
	
ul {
	list-style-type: square;
	padding: 0px;
	margin: 10px 0px 10px 20px;
}
ul.none {
	list-style-type: none;
	margin-left: 0px;
}
input {
	margin: 5px 5px 5px 0px;
}
hr {
	border: 0px;
	height: 0px;
	border-bottom: 1px dashed #CCCCCC;
	clear: both;
}

.floatLeft {
	float: left;
}
.clearBoth {
	clear: both;
}
.push {
	clear: both;
	width: 90%;
}

/* margins */
.nomargin{
	margin:0px !important;
}
.mtop10 {
	margin-top: 10px;
}
.mtop20 {
	margin-top: 20px;
}
.mtop-20 {
	margin-top: -20px;
}
.mright40 {
	margin-right: 40px;
}
.mleft20 {
	margin-left:20px;
}
/* headings */
h1 {
	display: block;
	font-size: 1.4em;
	font-weight: normal;
	margin: 15px 20px;
	width: 90%;
	border-bottom: 1px dashed #acdcac;
}
h2 {
	display: block;
	font-weight: normal;
	font-size: 1.4em;
	margin: 15px 20px;
	width: 80%;
	border-bottom: 1px dashed #acdcac;
}
#textColumn h1, #textColumn h2 {
	margin-left: 0px;
	border-color: #CCCCCC;
	margin-bottom: 30px;
}
#textColumn h2 {
	font-size: 1.2em;
	margin: 15px 0px;
	width: 90%;
}
h3 {
	font-size: 1.1em;
	margin: 0px 0px 10px 0px;
}
h4 {
	font-size: 1em;
	margin: 0px 0px 2px 0px;
}

/* specific styles */
#wrapper {
	position: relative;
	width: 960px;
	height: auto !important;
	margin: 0 auto;
	min-height: 100%;
}
	#content {
		position: absolute;
		top: 130px; 
	}
		#leftColumn {
			float: left;
			width: 240px;
			height: auto;
			background: url(../images/bg_green_30procent.png);
		}
		#centerColumn {
			float: left;
			margin: 0px 10px;
			width: 460px;
			height: auto;
			background: url(../images/bg_green_30procent.png);
			/*overflow:hidden;*/
		}
		#textColumn {
			float: left;
			color: #333333 !important;
			height: auto;
			background: #eaf6eb;
			padding: 0px 20px 20px 20px;
		}
		#textColumn.center_col {
			margin: 0px 10px;
			width: 420px;
		}
		#textColumn.left2cols {
			width: 670px;
			margin-right: 10px;
		}
		#textColumn.right2cols {
			width: 670px;
			margin-left: 10px;
		}
			#textColumn *{
				color: #333333;
			}	
			#textColumn p {
				margin: 15px 0px;
			}
		#rightColumn {
			float: right;
			width: 240px;
			height: auto;
			background: url(../images/bg_green_30procent.png);
		}
.odd img, .even img, .sideContent img {
	float: left;
	margin: 10px 15px 10px 0px;
	border: 2px solid #FFF;
}
.message img, #reactions img {
	float: none;
	margin: 0px;
	border: 0px;
}

.sideContent img {
	width: 90%;
}


/* lists */
		.links {
			margin: 0px;
			padding: 0px;
			list-style-type: none;
			width: 100%;
		}
		#textColumn .links {
			margin: -15px -20px 0px -20px;
		}
			.links li {
				display: block;
				padding: 15px 20px;
			}
			.links ol {
				clear: both;
				padding:0px 0px 15px 0px;
				margin:0px;
			}
			.links ol li {
				float: left;
				display: block;
				padding: 5px 10px 5px 0px;
				margin:0px;
			}
			.odd {
				background-color: #2b9c2e;
			}
			#textColumn .odd {
				background-color: transparent;
			}
			.even {
			} 
			#textColumn .even {
				background-color: #DFDFDF;
			}
			.links li.selected {
				background: #087F07;
				color: black;
			}
			.links li.selected a {
				background: url(../images/link_arrow_sel.gif) no-repeat left 3px !important;
				font-weight: normal;
			}
/* side */
		.sideContent {
			padding: 0px 20px 20px 20px;
		}
		.red_bg {
			background: #AF0003;
		}
		.white_bg {
			background: #eaf6eb;
		}
		.white_bg * {
			color: #333333 !important;
		}
		.sideContent.white_bg {
			padding-top: 10px;
			padding-bottom: 10px;
		}
		.red_bg .odd {
			background: transparent;
			padding: 10px 20px;
		}		
		.red_bg .even {
			background: #AF0A11;
			padding: 10px 20px;
		}
		#gallery-flickr	{
			margin-top: -20px;
		}
		#photo-overview-flickr ul{
			list-style-type: none;
			margin: 0px;
		}
			#photo-overview-flickr li {
				margin: 0px 10px 10px 0px;
			}
				#photo-overview-flickr li p{
					margin: 2px;
					font-weight: bold;
				}
		
/* statistieken */
.stats p {
	margin: 3px 0px !important;
}
	.percent_bar {
		width: 250px;
		border: 1px solid #CECECE;
		background: #FFFFFF;
	}
		.percent_bar .inner_bar {
			height: 8px;
			background: #AF0003;
			border: 1px solid #DDDDDD;
			border-top-color: #EEEEEE;
			border-bottom-color: #BBBBBB;
		}
				
/* header */
	#header {
		position: absolute;
		top: 0;
		width: 100%;
		height: 80px;
		background-image: url(../images/dealblas_header.jpg);
	}
	#header #logo {
		position: absolute;
		top: 10px;
		left: 50px;
	}
		#header #logo a img {
			margin:0px !important;
		}
	#header #menu {
		position: absolute;
		top: 37px;
		left: 110px;
	}
	#header #menu li {
		display:block;
		font-size: 13px;
		font-weight: bold;
	}
	#header #menu li a{
		display: block;
		padding: 8px 14px;
		background: url(../images/menu_border.jpg) right bottom no-repeat;
		text-decoration: none;
	}
	#header #menu li.last a {
		background: transparent;
	}
	#header #menu li a:hover, #header #menu li a.selected{
		display: block;
		padding: 8px 14px;
		color: #333333;
		background: #ccf7cc;
	}
	#header #menu li a:active {
		display: block;
		padding: 8px 14px;
		color: #333333;
		background: #eaf6eb;
	}
	#header #menu li a.selected{
		background: #eaf6eb;
	}
	#header #scores {
		position:absolute;
		left: 720px;
		width: 240px;
		height: 24px;
		padding: 55px 0 0 0;
		background: #2f9431;
	}
		#header #scores ul {
				list-style-type: none;
				padding: 0px;
				margin: 0px;
		}
		#header #scores .teams {
			padding-right: 10px;
		}
		#header #scores p{
			text-align: center;
			width: 100%;
		} 
	#add_scores {
		position: absolute;
		left: 820px;
		top: 79px;
		font-size: 0.9em;
		width: 130px;
		padding: 8px 0px 8px 10px;
		background: #eef7ee;
	}
	#scores p {
		margin: 0px;
	}

/* agenda */
.agenda {
	padding: 0px 20px;
}
.agenda_calendar {
	border-collapse: separate;
	border: 1px solid #63C264;
	float: left;
}
.agenda_calendar td{
	text-align: center;
	font-size: 0.9em;
	width: 20px;
	height: auto;
	padding: 3px;
	background: #4AB94B;
}
	.agenda_calendar .today {
		color: #059907; /* green */
		background: white;
	}
	.agenda_calendar .checked {
		text-decoration: underline;
		color: #059907; /* green */
		background: #ccf7cc; 
	}
.agenda_side {
	float: left;
	margin: 0 0 0 20px;
}
#leftColumn .agenda_side, #rightColumn .agenda_side {
	margin: 10px 0 0 0;
}
.agenda_side .datum {
	font-weight:bold;
	padding-right: 5px;
	width: 40px;
}

/* reacties */
#reactions {
	background: #EDEDED;
	margin: 10px -20px 0px -20px;
	padding-top: 10px;
}
	#reactions h3 {
		margin-left: 20px;
	}
	#reactions .reactionbox {
		background: #CCC;
		padding: 20px;
	}
	#reactions ol {
		padding: 0px;
		margin: 0px;
		list-style-type: none;
	}
	#reactions li {
		padding: 20px;
		border-top: 1px solid white;
	}
	#reactions .details {
		position: relative;
		width: 100%;
		height: 20px;
	}
		#reactions .details .date {
			position:absolute;
			right: 0px;
		}
	#reactions .text {
	}
	#reactions .flag {
		float:right;
	}
	#reactions .flag input.btn{
		border:0;
		background: url(../images/flag.gif) no-repeat;
		padding-left: 25px;
		cursor: pointer;
		cursor: hand;
	}

/* jeugd */
.jeugd_teams div {
	padding-bottom: 5px;
}
.jeugd_teams ul li{
	list-style-type: none;
	float: left;
	margin: 0px 10px 5px 0px;
}	
.jeugd_teams p {
	padding: 10px 0px 0px 20px;
}
	
/* programma */
.program_table {
	margin-bottom: 30px;
	border-bottom: 1px dashed #CCCCCC;
	width: 600px;
}
	.program_table thead {
		border-bottom: 1px dashed #CCCCCC;
	}
	.program_table th, .program_table td {
		padding-left: 10px;
	}
	.program_table .wedstrijd {
		width: 300px !important;
	}

/* forum */

	.forum .odd {
		border-color: #DFDFDF;
		border-width: 1px 0px;
		border-style: dashed;	
	}
	.forum .writer {
		float:left;
		width: 28%;
		padding-right: 2%;
	}
		.forum .writer strong {
			font-size: 0.95em;
		}
	.forum .message {
		float: left;
		width: 70%;
	}
.paging {
	float: right;
	clear: both;
	margin-bottom: 2px;
}
	.paging a {
		display: block;
		float: left;
		margin-top: 10px;
		padding: 3px 10px 2px 10px;
		border: 1px solid transparent;
		border-bottom: 1px solid #CCCCCC;
	}
	.paging a:hover {
		display: block;
		float: left;
		margin-top: 10px;
		padding: 3px 10px 2px 10px;
		border: 1px solid #CCCCCC;
	}
	.paging b {
		display: block;
		float: left;
		margin-top: 10px;
		padding: 3px 10px 2px 10px;
		color: black!important;	
		background: #DFDFDF;
		border: 1px solid #DFDFDF;
		border: 1px solid #CCCCCC;
	}
.width100percent {
	width: 100% !important;
}
img.noresize {
	width: auto;
	height: auto;
	border: 0px;
}
p.onderschrift {
	font-size: 0.9em;
}
.author {
	line-height: 150%;
	color: #000;
	background: white;
	padding: 2px;
}

/* */
#players_carousel p{
	margin:3px 0px;
}
#players_carousel .small p{
	margin: 0px;
}
#players_carousel .pasfoto {
	float:left;
	margin:0px 20px 0px 0px;
	border-width: 2px 2px 10px 2px;
	border-style: solid;
	border-color: white;
}
.players_details {
	float: left;
	width: 195px;
}
.sponsorblok {
background: #DDDDDD;
padding: 2px;
border: 1px solid #F2F2F2;
}
