@import url('reset.css');

body, html {
  background: url(../images/body-back.jpg) repeat-x;
  text-align:center;
  font:12px/22px 'Lucida Grande','Lucida Sans Unicode','Lucida Sans',Tahoma,Arial;
}

a {
  color:#E30120;
  text-decoration:none;
}

a:hover {
  text-decoration:underline;
}
#formhandler-errors {
  display:none;
}
html, body, #wrap {
  height: 100%;
}

body > #wrap {
  height: auto; 
  min-height: 100%;
}

#main { 
  padding-bottom: 64px;
  width:1001px;
  background:url(../images/content-back2.jpg) no-repeat left top;
  margin:0 auto;  
  position:relative;
}

#main #logo {
  position:absolute;
  height:104px;
  width:115px;
  background:url(../images/design/logo.jpg) no-repeat 0 0;
  top:7px;
  /*left:48px;*/
  left:82px;
}

#main h1#title {
  font-size:39px;
  position:absolute;
  left:259px;
  top:25px;
} 

#main h2#slogan {
  font-size:29px;
  position:absolute;
  left:256px;
  top:68px;
  font-family:neotech;
  font-weight:300;
} 

#main #rightcolumn {
  position:absolute;
  right:49px;
  top:186px;
  width:161px;
  text-align:left;
  padding:10px 10px 10px 10px;
  border:1px solid #d9d9d9;
}

#main #rightcolumn a.register {
  background:url(../images/buttons/aanmelden.jpg);
  width:173px;
  height:76px;
  position:absolute;
  left:9px;
  bottom:9px;
}


#main #rightcolumn h4 {
  font-size:18px;
  color:#e30120;
  margin-bottom:7px;
}

#main #rightcolumn div.grey {
  background:#f1f1f3;
  padding:5px;
}

#main #rightcolumn div.grey a.button {
  float:none;
}

#footer {
  position: relative;
	margin-top: -54px; /* negative value of footer height */
	height: 54px;
	clear:both;
	background:#f0f0f2;
} 

#footer p {
  height:54px;
  margin:0 auto;
  padding-right:76px;
  text-align:right;
  text-indent:13px;
  width:925px;
  line-height:54px;
}

/* CLEAR FIX*/
.clearfix:after {
  content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
  display: inline-block;
}

* html .clearfix { 
  height: 1%;
}
.clearfix {
  display: block;
}

div#content {
  width:480px;
  height:100%;
  height:auto;
  margin:0 auto;    
  text-align:center;
  display:block;
  padding-top:186px;
  text-align:left;
  min-height:632px;
}

div#content h3 {
  border-bottom:1px solid #999999;
  text-align:left;
  color:#fff;
  background:#000;
  font-size:13px;
  line-height:25px;
  padding-left:7px;
}

div#videoplayer {
  width:480px;
  background:#000;
  height:246px;
}

div#content h2 {
  background:#000000;
  color:#FFFFFF;
  font-size:18px;
  height:42px;
  line-height:42px;
  text-indent:13px; 
  text-align:left;
  margin:2px 0 9px;
  * margin:10px 0 9px;
}

p {
  color:#555555;
  margin-bottom:12px;
}

ul {
  list-style:disc;
  margin-left:25px;
  margin-bottom:12px;
}

ul li {
  color:#555;
}

embed {
  margin:0;
  padding:0;
}

label {
  width:240px;
  display:block;
  float:left;
  line-height:40px;
  height:32px;
  color:#555555;
  text-indent:39px;
  font-size:12px;
}

label.error, h5.error, h5.formHeader label.error {
  color:red;
} 

input {
  float:left;
  width:219px;
  margin-top:9px;
  height:15px;
  display:block;
  text-indent:3px;
}

select {
  float:left;
  margin-top:9px;
  height:15px;
  display:block;
  margin-right:10px;
}

textarea {
  width:424px;
  height:130px;
  margin:20px 29px 9px 40px;
}

.nofloat { 
  clear: both; 
  height: 0; 
  font-size: 0; 
  line-height: 0; 
}


/* FORM ELEMENTS */
h5.formHeader, h5.formHeader label {
  margin-top:20px;
  height:34px;
  background:#ffcc00;
  line-height:34px;
  text-indent:31px;
  display:block;
}

h5.formHeader label {
  width:100%;
  margin-top:0;
  font-weight:bold;
  color:black;
}

div.formBlk {
  border:1px solid #dadada;
  border-top:0;
  padding-bottom:10px;
  background:#f0f0f2;
}

div.formBlk.widelabels {
  margin-top:0;
  height:168px;
}

div.formBlk.widelabels label {
  display:block;
  height:auto;
  line-height:24px;
  padding-left:39px;
  text-indent:0;
  width:431px;
  position:relative;
}

div.formBlk.widelabels label.noStyle {
  width:30px;
  padding-left:2px;
  float:left;
}

div.formBlk.widelabels input {
  width:20px;
  margin-top:5px;
  margin-left:35px;
  float:left;
  clear:both;
}

div.formBlk span {
  display:block;
  float:left;
  line-height:38px;
  height:32px;
  color:#555555;
  font-size:12px;
  text-indent:10px;
}
input.w_153 {
  width:153px;
  margin-right:9px;
}

input.w_51 {
  width:51px;
}

input.w_71 {
  width:71px;
  margin-right:9px;
}

input.w_134 {
  width:134px;
}

input.fh_ok {
  background:url(../images/forms/ok.jpg) no-repeat right center #fff;
}

input.fh_error {
  background:url(../images/forms/error.jpg) no-repeat right center #fff;
}

select {
  height:23px;
  background:#fff;
}

select#geboortedatum_day {
  width:38px;
}

select#geboortedatum_month {
  width:112px;
}

select.error {
  background:red;
  color:#fff;
}

input.button, a.button {
  background: url(../images/buttons/btn-back.jpg) right 0 no-repeat #000;
  border:0;
  float:right;
  height:25px;
  width:inherit;
  color:#fff;
  padding-right:20px;
  text-align:right;
  padding-right:39px;
  padding-left:14px;
  margin-top:14px;
  cursor:pointer;
  display:block;  
  text-decoration:none;
}

/* Menu */
ul.menu {
  background:url(../images/menu/separator.jpg) no-repeat;
  position:absolute;
  top:121px;
  height:33px;
  margin:0 0 0 48px;
  text-align:left;
  padding-left:2px;
  left:0;
}

ul.menu li {
  float:left;
  list-style:none;
  height:100%;
  background:url(../images/menu/separator.jpg) no-repeat right top;
  font-weight:bold;
}

ul.menu li a {
  padding:0 9px 0 9px;
  margin-right:2px;
  display:block;
  height:33px;
  color:#000;
  text-decoration:none;
  line-height:33px;
  background: url(../images/menu/background.jpg) repeat-x 0 0;
}

ul.menu li a:hover, ul.menu li a.active {
  background-position:0 -33px;
  color:#fff;
}

div#content ul li {
  font-style:italic;
}

div#inlogbutton {
	position: absolute;
	top: 186px;
	left: 51px;
}

div#inlogbutton a.login {
	display: block;
	width: 190px; height: 39px;
	background-image: url(../images/btn_login.png);
	background-position: top;
	text-indent: -9999px;
}
div#inlogbutton a.login:hover {
	background-position: bottom;
}