/********************************************
   HTML ELEMENTS
********************************************/ 

/* Top Elements */
* { margin: 0; padding: 0; }

body {
	background-color:#B2B6B8;
	font: 70%/1.5em Verdana, Tahoma, arial, sans-serif;
	text-align: center;
}

/* links */
a , a:visited{
	text-decoration: none;
	color: #474747;
	font-weight: bold;
}
a:hover {
	color: #000;
	text-decoration: underline;
	font-weight: bold;
}
/* headers */
h1, h2, h3 {
	font-family: Tahoma, Verdana, 'Trebuchet MS', Sans-serif;
	font-weight: Bold; 		
}
h1 {
	font-size: 120%;	
}
h2 {
	font-size: 110%;
	text-transform: uppercase;
	color: #88ac0b;
}
h3 {
	font-size: 110%;
	color: #666666; 
}

/* images */
img.float-left {
	margin: 5px 10px 10px 0px;
}

a img{
	border: 2px solid #474747;
}

a img:hover{
	border: 2px solid #000;
}

a img.vorige, a img.volgende{
	border: none;
	position: absolute;
}

#navigatie{
	position: fixed;
	top: 440px;
	width: 530px;
}

img.vorige{ 	margin-left: 2px; }
img.volgende{ margin-left: 528px; }


h1, h2, h3, p, form{
	padding: 10px;
	margin: 0;
}
form{
	padding-left: 0;
}

acronym {
  cursor: help;
  border-bottom: 1px dotted #474747;
}

/* form elements */
form textarea {
    width: 380px;
    height: 200px;
    margin-bottom: 10px;
    border: 1px solid black;
}
#description {
    width: 380px;
    height: 60px;
    margin-bottom: 10px;
    border: 1px solid black;
}
#sidebar .left-box form{
	margin-top:-18px;
	margin-left: 5px;
}
label {
	cursor: pointer;
}
label.field {
	cursor: auto;
	display : block;
	font-weight : bold;
	margin : 5px 0;
	color : #666;
}
button, input[type=submit], input[type=reset], .button {
	border : 1px solid #000;
	background-color:#474747;
	padding : 4px;
	margin-right: 2px;
	font : normal 1em Verdana, sans-serif;
	color : #1F1F1F;
	width : auto;
}
.button, .button:hover, .button:visited{
	color: #000;
	text-decoration: none;
	font-weight: normal;
}
input[type=text], input[type=password], select{
	padding : 4px;
	margin-right: 2px;
	font : normal 1em Verdana, sans-serif;
    width: 190px;
    margin-bottom: 10px;
    border: none;
    border-bottom: 1px dashed black;
	background-color:#716F5A;
}

input[type=password]{
	background: url('../images/lock.png') no-repeat left;
	padding-left: 20px;
}
#normal{
	border: 1px solid #000;
	width:150px;
	background-color: #FFF;
}
#user, #user2, #user3, #voornaam{
	background: url('../images/user.png') no-repeat left;
	padding-left: 20px;
}
#user3, #empty{
	border: none;
	color: #000;
}
#naam, #voornaam{
	width: 60px;
}
#controle{
	position:absolute;
	width:150px;
	margin-left:100px;
}
select{
	width: auto;
	background: #FFF;
	border: 1px solid #000;
}
div .align-topright {
	position: absolute;
	margin-top: -40px;
	margin-left: 300px;
}
#email{
	background: url('../images/email.png') no-repeat left;
	padding-left:20px;
}
#onderwerp{
	width: 206px;
}
#small{
	width:70px;
	margin-left:135px; /* 213-70= 143*/
}
#pass, #user{
	border: 1px solid #000;
	width:150px;
	background-color: #FFF;
}
.error{
	color:#a80000;
}
/* form elements 
form textarea {
    width: 380px;
    height: 200px;
    margin-bottom: 10px;
    border: 1px solid black;
}


form {
	margin:10px;
	padding: 5px;
}
label {
	cursor: pointer;
    float: left;
    width: 70px;
    padding-top: 5px;
}
input.fout, textarea.fout {
    border: 1px solid #FF0000;
}
button, input[type=submit], input[type=reset], input[type=button] {
	border : 1px solid #000;
	background-color:#474747;
	padding : 4px;
	margin-right: 2px;
	font : normal 1em Verdana, sans-serif;
	color : #1F1F1F;
	width : auto;
}
input[type=text], input[type=password], select{
	padding : 4px;
	margin-right: 2px;
	font : normal 1em Verdana, sans-serif;
    width: 190px;
    margin-bottom: 10px;
    border: none;
    border-bottom: 1px dashed black;
	background-color:#716f5a;
}
input[type=password]{
	background: url('../images/lock.png') no-repeat left;
}
#user{
	background: url('../images/user.png') no-repeat left;
}
#pass, #user{
	border: 1px solid #000;
	width:150px;
}
*/

/********************************************
   LAYOUT
********************************************/ 
#wrap {
	position: absolute;
	width: 820px;
	background: #b2b6b8 url(../images/content.png) repeat-y center top;
	margin-left: -410px;
	left: 50%;
	text-align: left;
}
#content-wrap {
	clear: both;
	width: 760px;
	padding: 0; 
	margin: 0 auto;
}
.normal {}
.lightgrey{ background-color: #716F5B;}
#header {
	width: 820px;
	position: relative;
	margin-left: -410px;
	height: 170px;
	background: #b2b6b8 url(../images/header.png) no-repeat center top;
	padding: 0;
	font-size: 14px;
	color: #FFF;
	left: 50%;
}
#header h1, #header h2 {
	display:none;
}

#karretje{
	position:absolute;
	width: 170px;
	height: 71px;
	top:20px;
	left:40px;
/*	background: #FFF;*/
	border: 3px solid #1F3418;
	background: url('../images/karretje.png') no-repeat center center;
	font: 11px/11px Verdana, Arial, Tahoma, Sans-serif;
}

#karretje a, #karretje a:visited{
	color: #000;
	text-decoration:underline;
	font: 11px/11px Verdana, Arial, Tahoma, Sans-serif;
}
#karretje a:hover{
	text-decoration: none;
}
#karretje:hover{
	cursor: pointer;
}
/* Menu */
#menu {
	position: relative;
	text-align:center;
	font: bold 12px/26px Verdana, Arial, Tahoma, Sans-serif;
	margin-top: -30px;
}
#menu a{
	padding-left: 10px;
	padding-right: 10px;
	width:200px;
}
#menu a:hover {
	color: #000;
	text-decoration:none;
	background: url(../images/arrow-side.png) no-repeat left center;
}
#menu .active, #menu .active:hover{	
	color: #333;
	background: url(../images/arrow-down.png) no-repeat left center;
}

/* Main Column */
#main {
	float: right;
	width: 550px;
	padding: 0; margin: 0;
}
#main h1 {
	margin-top: 10px;
	font: Bold 125% Verdana, 'Trebuchet MS', Sans-serif;
	color: #000;
	padding: 5px 0 5px 25px;
	background: #EEF0F1 url(../images/headerbg2.png) repeat-x left top;	
	height:20px;
}
#main .content{
	background-color:#716f5a;
	border: 1px solid #000;
	border-top:none;
}

/* Sidebar */	
#sidebar {
	float: left;
	width: 199px;
	padding: 0; margin: 0;	
}	
#sidebar h1 {
	margin-top: 10px;
	padding: 5px 0 5px 10px; 
	font: bold 1.1em Verdana, 'Trebuchet MS', Sans-serif;
	color: #000;
	background: #EEF0F1 url(../images/headerbg.png) repeat-x left bottom;	
	height:20px;
	/* border: 1px solid #EFF0F1; */
}
#sidebar .left-box , #sidebar .left-box-images{
	margin: 0 0 5px 0;
	border: 1px solid #000;
	border-top:none;
	background-color:#716f5a;
}
/* Voor Démo versie //
#sidebar .left-box{
	background: #716f5a url('../images/inloggen.png') no-repeat center center;
	height:170px;
} */

 .left-box-images  strong{
	word-wrap: break-word;
 }

#sidebar .left-box-images img{
	margin-left: 10px;
	margin-right: 10 px;
	margin-top:10px;
}

.tHead{
	font-weight: bold;
}

.lineTR{
    border-color: black;
    border-width: 1px 0 0 0;
    border-style: solid;

	font-weight: bold;
}

a button, a button:hover, a button:visited{
	text-decoration: none;
}

/* Footer */
#footer, #footerr {
	color: #000;
	background: #b2b6b8 url('../images/footer.png') no-repeat center top;
	clear: both;
	width: 820px;
	height: 55px;
	font-size: 92%;
	text-align: center;
	left: 50%;
	margin-left: -410px;
	position:relative;
}

#footer a, #footerr a { text-decoration: none; }
#footer .left, #footer .right,#footerr .left, #footerr .right{
	margin-top: -10px;
}
#footer .left, #footerr .left{
	float: left;
	margin-left: 30px;
}
#footer .right, #footerr .right{
	float: right;
	margin-right:30px;
}
#footer .left a[title='Ga nu naar Jeroendj.nl'],
	#footer .left a[title='Ga nu naar jeroendj.nl']{
	margin-left: 42px;
}
/* align styles, en kleuren etc.*/
.float-left  { float: left; }
.float-right { float: right; }
.float-center { float: center; }
.align-left  { text-align: left; }
.align-right { text-align: right; }
/* .align-right form{ padding-top: -10px; }*/
.push {padding-top: 15px; }
.pull {margin-top: -5px; }
.album_head form{ height: 10px;}
.align-center { text-align: center; }
.clear { clear: both; }
.gray { color: #CCC; }