/***************************************************************
 main styles nps/vpro/nos - andere tijden sport
 marcel van den berg
 12 mei 2009
***************************************************************/

/* reset
---------------------------------------------------------- */
p,a,ul,ol,li,h1,h2,h3,h4,td,th,dd,dt,span,input,form,select,textarea,em,blockquote,img,
* {
	margin: 0;
	padding: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	line-height: 1.2em;
	color: #934217;
	border: 0;
	}

/* global
---------------------------------------------------------- */
body {
	/*background-color: #efefef;*/
	background-color: #f7f7f7;
	background-image: url("../gfx/bck_body.jpg");
	background-repeat: repeat-x;
	background-position: 0 0;
	margin: 0;
	padding: 0;	
	height: 100%;
	}
html {
	height: 100%;
	}
#title {
	background-image: url("../gfx/logo.png");
	background-position: 0px 25px;
	background-repeat: no-repeat;
	width: 407px;
	height: 68px;
	}
#logo {
	float: right;
	position: relative;
	margin: -35px 0 0 0px;
	}
#logo img {
	vertical-align: middle;
	margin: 0px 0 0 20px;
	}
a {
	text-decoration: none;
	color: #ce642b;
	font-weight: bold;
	}
a:hover {
	text-decoration: none;
	}
p {
	margin: 10px 0 0 0;
	}
h1 {
	margin: 10px 0 15px 0;
	font-size: 2.4em;
	font-weight: normal;
	}
h2 {
	font-family: "trebuchet ms", arial, helvetica, sans-serif;
	font-size: 2.0em;
	letter-spacing: -0.05em;
	font-weight: bold;
	color: #934217;
	line-height: 1.8em;
	}
h3 {
	font-size: 2.0em;
	/*letter-spacing: -0.05em;*/
	font-weight: bold;
	color: #000;
	line-height: 1.0em;
	margin: 0;
	}
.right {
	float: right;
	}
.hidden,
.hide {
	display: none;
	}
.show {
	display: inline;
	}
.clear{ 
	clear: both;
	display: block;
	height: 0;
	}
.clearfix:after { 
	clear: both;
	content: "";
	display: block;
	height: 0;
	visibility: hidden;
	}

/* layout
***************************************************************/
#wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -60px;
	}
#container {
	margin: 0px auto 0px auto;
	width: 972px;
	}
#main {
	width: 972px;
	padding: 25px 0 10px 0px;
	}
#main.overview #left_col {
	float: left;
	width: 475px;
	}
#main.overview #right_col {
	float: right;
	width: 474px;
	}
#main.live #left_col {
	float: left;
	width: 525px;
	}
#main.live #right_col {
	float: right;
	width: 425px;
	}
#main.video #left_col {
	float: left;
	width: 525px;
	}
#main.video #right_col {
	float: right;
		width: 435px;
	}




/* navbar
***************************************************************/
#navbar {
	width: 897px;
	height: 28px;
	padding: 0;
	position: relative;
	z-index: 1;
	margin-top:24px;
	}
#navbar ul {
	list-style: none;
	}
#navbar ul li {
	background-image: url("../gfx/nav_end.png");
	background-repeat: no-repeat;
	background-position: 100% 0;
	height: 28px;
	display: block;
	margin: 0 5px 0 0;
	padding: 0 0px 0 0;
	float: left;
	}
#navbar ul li a {
	background-image: url("../gfx/nav.png");
	background-repeat: no-repeat;
	margin: 0px 10px 0px 0px;
	padding: 5px 10px 5px 20px;
	display: block;
	color: #fff;
	font-size: 1.15em;
	font-weight: bold;
	height: 18px;
	}
#navbar ul li.active {
	background-image: url("../gfx/nav_end_active.png");
	color: #000;
	}
#navbar ul li.active a {
	background-image: url("../gfx/nav_active.png");
	color: #000;
	}

/* content overview
***************************************************************/
#main.overview #left_col div.show_post {
	background-image: url("../gfx/show_post.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 475px;
	height: 56px;
	padding: 4px;
	margin: 0 0 6px 0;
	overflow: hidden;
	}
#main.overview #left_col div.show_pre {
	background-image: url("../gfx/show_pre.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 475px;
	height: 56px;
	padding: 4px;
	margin: 0 0 6px 0;
	overflow: hidden;
	}
div.text p,
div.text h4,
div.text h4 a {
	height: 30px;
	line-height: 12px;
	margin: 0px;
	color: #fff;
	}
div.fragment_active div.text,
div.fragment div.text {
	width: 285px !important;
	}
#main.overview img.thumb {
	float: left;
	margin-right: 10px;
	}
#main.overview div.text {
	float: left;
	width: 240px;
	height: 56px;
	margin-right: 10px;
	}
#main.overview div.text a {
	color: #fff !important;
	}
#main.overview div.view {
	float: left;
	width: 70px;
	height: 30px;
	background-image: url("../gfx/btn_view_active.png");
	background-repeat: no-repeat;
	background-position: 100% 50%;
	padding: 13px 30px 13px 0;
	}
#main.overview div.view img,
#main.overview div.view a img {
	float: right;
	height: 35px;
	width: 20px;
	margin: -25px  -30px 0 0;
	padding: 0;
	}
#right_col div.box img {
	margin: 0 0 10px 10px;
	}
#main.overview div.noview {
	float: left;
	width: 70px;
	height: 30px;
	background-image: url("../gfx/btn_view_passive.png");
	background-repeat: no-repeat;
	background-position: 100% 50%;
	padding: 13px 30px 13px 0;
	color: #7e7e7e;
	font-weight: bold;
	}
#main.overview div.box {
	background-color: #fff;
	padding: 10px 20px 20px 20px;
	}
#main.overview div.box_top {
	background-image: url("../gfx/box_top_474.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
	}
#main.overview div.box_bottom {
	background-image: url("../gfx/box_bottom_474.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
	margin-bottom: 10px;
	}
#intro1_main,
#intro2_main,
#intro3_main,
#intro4_main,
#intro5_main,
#intro6_main,
#intro7_main,
#intro8_main,
#intro9_main {
	height: 223px;
	height: 190px;
	overflow: auto;
	margin-bottom: 0;
	padding-bottom: 0;
	}

/* content live
***************************************************************/
#main.live div.box {
	background-color: #fff;
	padding: 10px 20px 20px 20px;
		height: 303px;
		overflow: auto;
	}
#main.live div.box_top {
	background-image: url("../gfx/box_top_425.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
	}
#main.live div.box_bottom {
	background-image: url("../gfx/box_bottom_425.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
	margin-bottom: 10px;
	}
#main.live div.box_live {
	background-image: url("../gfx/box_live.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 524px;
	height: 363px;
	padding: 5px;
	text-align: center;
	margin: 0;
	}
#main.live div.box_live #streamholder {
	width: 514px;
	height: 312px;
	padding: 0px;
	margin: 0;
	}
#main.live div.box_live h4 {
	padding: 0px;
	margin-top: 15px;
	color: #fff;
	}
#main.live div.shadow {
	background-image: url("../gfx/bck_shadow.png");
	background-repeat: no-repeat;
	background-position: 0 2px;
	width: 524px;
	height: 90px;
	margin: 0;
	padding: 15px 5px 5px 15px;
	}
#main.live div.shadow a {
	color: #fff;
	}

/* content video
***************************************************************/
#main.video div#pages {
	background-image: url("../gfx/box_pages.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 976px;
	height: 46px;
	padding: 0px;
	text-align: center;
	margin: 0 0 30px 0;
	}
#main.video div#pages .left {
	float: left;
	margin: 10px;
	background-image: url("../gfx/arrow_backward.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 19px;
	padding: 3px 0 0 25px;
	}
#main.video div#pages .right {
	float: right;
	margin: 10px;
	background-image: url("../gfx/arrow_forward.png");
	background-repeat: no-repeat;
	background-position: 100% 0;
	height: 19px;
	padding: 3px 25px 0 0;
	}	
#main.video div.box {
	background-color: #fff;
	padding: 10px 20px 20px 20px;
	width: 484px;
	}
#main.video div.box_top {
	background-image: url("../gfx/box_top_524.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
		width: 524px;
	}
#main.video div.box_bottom {
	background-image: url("../gfx/box_bottom_524.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 10px;
	margin-bottom: 10px;
		width: 524px;
	}
#main.video div.box .intro {
	float: right;
	margin: 0;
	background-image: url("../gfx/btn_view_active.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 25px;
	padding: 5px 0 0 30px;
	}
#main.video div.box_video {
	background-image: url("../gfx/box_video_top.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 514px;
	padding: 5px;
	margin: 0;
	color: #fff;
	}
#main.video div.box_video p,
#main.video div.box_video h5 {
	color: #fff;
	}
#main.video div.box_video #videoitem p {
	margin: 20px;
	padding: 10px;
	border: 1px solid #fff;
	}
#main.video div.box_video_bottom {
	background-image: url("../gfx/box_video_bottom.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 514px;
	padding: 5px;
	text-align: center;
	margin: 0;
	}
#main.video #right_col div.fragment {
	background-image: url("../gfx/fragment.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 409px;
	height: 56px;
	padding: 4px 4px 4px 30px;
	margin: 0 0 6px 0;
	overflow: hidden;
	}
#main.video #right_col div.fragment_active {
	background-image: url("../gfx/fragment_active.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 409px;
	height: 56px;
	padding: 4px 4px 4px 30px;
	margin: 0 0 6px 0;
	overflow: hidden;
	}
#main.video #right_col h4,
#main.video #right_col p {
	color: #fff;
	margin-bottom: -5px;
	}	
#main.video #right_col img.thumb {
	float: right;
	margin-right: 10px;
	}
#main.video #right_col div.text {
	float: left;
	width: 240px;
	height: 56px;
	margin-right: 10px;
		/*border: 1px solid red;*/
	}
#main.video #right_col div.text a {
	color: #fff !important;
	}
#main.video #right_col h5 {
	line-height: 40px;
	font-size: 1.6em;
	margin: -10px 0 28px 12px;
	}
#main.video #right_col div.view {
	float: left;
	width: 70px;
	height: 30px;
	background-image: url("../gfx/btn_view_active.png");
	background-repeat: no-repeat;
	background-position: 100% 50%;
	padding: 13px 30px 13px 0;
	}
#main.video #right_col div.view a img {
	/*float: right;
	height: 35px;
	width: 20px;
	margin: -25px  -30px 0 0;
	padding: 0;*/
	}

/* footer
***************************************************************/
.push {
	height: 45px;
	}
#footer {
	margin: 10px 0px 0px 0px;
	padding: 0px 0px 0 0;
	text-align: right;
	height: 45px;
	background-color: #000;
	}
#footer div {
	margin: 15px auto 20px auto;
	width: 972px;
	text-align: right;
	}
#footer p {
	margin: 0px;
	font-size: 0.9em;
	color: #fff;
	}
#footer a {
	margin-right: 0px;
	color: #fff;
	}

/* form elements
***********************************************/
form {
	margin: 0px;
	}
fieldset label {
	font-weight: bold;
	float: left;
	text-align: right;
	width: 60px;
	padding: 0px 0px 0px 0px;
	margin: 0px;
	color: #000;
	}
fieldset .row {
	vertical-align: top;
	padding-top: 0px;
	height: 24px;
	}
fieldset .block {
	vertical-align: top;
	padding-top: 0px;
	padding-bottom: 0px;
	}
fieldset input.text {
	float: right;
	border: 1px solid #cfcfcf;
	background-color:#fff;
	vertical-align: top;
	padding: 2px 3px;
	margin: 0px 0px 0px 0px;
	width: 400px;
	color: #000;
	}
fieldset input.note {
	float: right;
	border: 1px solid #fff;
	background-color:#fff;
	vertical-align: top;
	padding: 2px 3px;
	margin: 0px 0px 0px 0px;
	width: 400px;
	color: #000;
	}

