/* ================================================================

   Base style sheet
	
================================================================ */



/*  Kleuren:
	#E8EBF0; table captions   
	#f6f6f6; light row 
	#D3D3D3 
       */

body {
	font-size			: 76%;
	background-color	: #FFF;
	font-family			: Arial;	
	width				: 990px;
}

/* Voor alle browsers behalve IE wordt hier de min-width gezet. Voor IE gebeurt dat in de head van het html-document */
html>body {
 width					: auto;
 min-width				: 990px;
}

/* default html-elements settings */

p, a, div {
	font-size			: 1.0em;
	color				: #000;
	background			: transparent none;
}
a {
	color				: #A68C53;
	text-decoration		: none;
}

body, p, a, img, div, form, table, tr, td, h1, fieldset, legend, ol, label {
	padding				: 0;
	margin				: 0;	
}
h1 { 
	font-size			: 1.2em;
	font-weight			: bold;
}
img { 
	border				: 0;
}
table {
	border-collapse		: collapse;
	width				: 100%;
}
tr, th, td {
	border				: 1px solid #D3D3D3;
	padding				: 0 0.3em 0 0.3em;
	text-align			: left;
	vertical-align 		: top;	
}
table caption {
	border				: 1px solid #D3D3D3;
	background-color	: #E8EBF0;
	text-align			: left;	
	padding				: 0.3em 0.5em 0.3em 0.5em;
	border-bottom		: 0; /* anders een dubbele lijn*/
}
table.autoWidth {
	width				: auto;
}

table.width800 {
	width				: 800px;
}


table.inclButton {
	width				: 96%;
	margin-left			: 0;
	padding-left		: 0;
}

table.planningPeriodeSelectLocations caption {
	font-weight			: bold;
}

/* tabel lightview*/
.lightviewTable caption {
	border				: 1px solid #D3D3D3;
	background-color	: #AFBAD3;
}


/* blockInTable */
.blockInTableTd {
	padding				: 0;	
}
.blockInTableTd table thead tr {
	background-color	: #E8EBF0;
}
.blockInTableTd table thead tr th {
	border-top			: 0;
	font-weight			: normal;
}
.blockInTableTd table thead tr th.headerLeft {
	border-right		: 0;
}
.blockInTableTd table thead tr th.headerRight {
	border-left			: 0;
	text-align			: right;
}
.blockInTableTd table thead tr th a {
	text-decoration		: underline;
}
.blockInTableTd table tbody tr td {
	border				: 0;
}

ul {
	margin				: 0 0 0 16px;
}
textarea {
	margin-top			: 0.3em;
}
/* default classes */
.noDisplay {
	display				: none !important;
}
.noShow {
	display				: none;
}
.noBorder {
	border				: 0;
}

.noBorderBottom {
	border-bottom		: 0;
}

.alignCenter {
	text-align			: center;	
}
.alignTop {
	vertical-align		: top;	
}
.alignRight {
	text-align			: right;	
}

.alignLeft {
	text-align			: left !important;	
}

.floatRight {
	float				: right;
	margin-right		: 0.5em;
}
.floatLeft {
	float				: left;
}

.margintop1 {
	margin-top			: 1em;
}

.marginRight1 {
	margin-right		: 1em;
}

.lightRow {
	background-color	: #f6f6f6;	
}
.lightHead {
	background-color	: #E8EBF0;
}
.cursorPointer {
	cursor				: pointer;
}
.cursorWaiting {
	cursor				: wait;
}

.vet {
	font-weight			: bold;		
}

.noBold {
	font-weight			: normal !important;
}
.opvallend {
	background-color	:#FF0000;
	color				:#FFF;
}

.incidenteeltekstOpvallen {
	color				: #FF0000;
	font-weight			: bold;
}

.tekstOpvallen {
	color				: #FF0000;
}

.underline {
	cursor				: pointer;
	text-decoration		: underline;
}


/* klasse om de link voor het selecteren van authorisatieobjecten te stylen  */
.groupSelection
{
	cursor				: pointer;
	text-decoration		: underline;
}

.groupSelection:hover
{
	color: black;	
}

/* hoogtes voor verschillende formulieren en labels */
.labelHoogte1 {
	/* origineel height:2.4em; */
	height:2em ! important;	
}
.labelHoogte2 {
	/* origineel height:2.4em; */
	height:4em ! important;	
}
.labelHoogte3 {	
	height:6em ! important;		
}
.labelHoogte4 {	
	height:8em ! important;		
}
.labelHoogte5 {
	height:10em ! important;		
}
.labelHoogte6 {
	height:12em ! important;		
}
.labelHoogte7 {
	height:14em ! important;		
}
.labelHoogte8 {
	height:16em ! important;		
}
.labelHoogte9 {
	height:18em ! important;		
}
.labelHoogte10 {
	height:20em ! important;		
}

/* APPLICATION HEADER (APPNAAM + BEDRIJFSLOGO) */
#app_header 			{ width:100%; border:0; }
#app_header tr			{ border:0; }
#app_header_left 		{ text-align:left; padding-left:16px; border:0; }
#app_logo 				{ height:100%; }
#app_header_right 		{ text-align:right; padding-right:20px; border:0; }
#edynamics_logo 		{ height:100%; }

/* MENU'S (Hoofdmenu en submenu) */
.menu {
	margin				: 0 0 0.1em 0;
	padding				: 0 0 0 1em;
	height				: 28px;
	border-bottom		: 1px solid #ccc;
	z-index				: 1;
}
.menu li {
	display				: inline;
	list-style-type		: none;
	margin				: 0;
	padding				: 0;
}
.menu img {
	position			: relative;
	left				: -4px;
	top					: -2px;
	float				: left;
}
.menu a {
	background-color	: #E8EBF0;
	border				: 1px solid #ccc;
	color				: #666;
	padding				: 0.4em 0.3em 0 0.6em;
	text-decoration		: none;
	margin				: 0 0.5em 0 0;
	float				: left;	
}
.menu a:hover	{
	color				: #FF0000;
}
.menu li.tabSelected a {
	border-bottom		: 1px solid #fff;
	background			: #fff;
}
.submenu {
	margin				: 0 0 1em 0;
	padding				: 0;
	border-bottom		: 1px solid #ccc;	
}
.submenu li.tabSelected a {
	border-bottom		: 1px solid #fff;
	background			: #fff;
}

/* APPLICATION BODY (LEFT MENU + CONTENT) */
#app_body	 			{ width:100%; border:0; border-bottom:1px solid #ccc; margin-bottom:16px; }
#app_body tr			{ border:0; }
#app_body_left 			{ padding:2em 0 16px 16px; width:145px; text-align:left; border:0; vertical-align:top; }
#app_body_right 		{ padding:2em 20px 16px 16px; text-align:left; border:0; vertical-align:top; }

/* LEFTMENU BOX */
div.leftMenuBox {
	border				: 1px solid #000;
	margin-bottom		: 1em;
	background-color	: #FFF;		
	width				: 140px;
}
h1.leftBoxHeader {
	font-size			: 1.0em;
	color				: #000;
	background-color	: #E8EBF0;
	padding				: 0.2em 0.5em 0.2em 0.5em;
	display				: block;
	font-weight			: normal;
	border-bottom		: 1px solid #D3D3D3;
}
div.leftMenuBox ul.leftMenuBoxUL {
	display				: block;
	margin-left			: 0.6em;
	padding				: 0 0 0 1em;
}
div.leftMenuBox ul.leftMenuBoxUL.recentItems, div.leftMenuBox ul.leftMenuBoxUL.searchItems {
	margin-left			: 0.1em;
	padding				: 0 0 0.2em 0;
}
div.leftMenuBox ul.leftMenuBoxUL li {
	list-style-type		: circle;
	display				: block;
	line-height			: 1.6em;
	margin				: 0;
	padding				: 0;
}
div.leftMenuBox ul.leftMenuBoxUL.recentItems li, div.leftMenuBox ul.leftMenuBoxUL.searchItems li {
	list-style-type		: none;
	font-size			: 0.9em;	
	width				: 136px;
	line-height			: 13px;
	margin-top			: 1px;	
}
div.leftMenuBox ul.leftMenuBoxUL li img { 
	margin				: 0;
}
div.leftMenuBox ul.leftMenuBoxUL li a {
	background-color	: #FFF;
	border				: 0;
	float				: none;
	text-decoration 	: underline;
	margin				: 0;
	padding				: 0;
}
div.leftMenuBox ul.leftMenuBoxUL.recentItems li a, div.leftMenuBox ul.leftMenuBoxUL.searchItems li a {
	text-decoration		: none;
}

/* PAGINA-TITEL */
#paginaTitel {
	position			: relative;
	left				: 0;
	top					: -0.2em;
	margin-bottom		: 0.3em;
}

/* FORM STYLES */
form {
	border				: 0;	
}
#frmLogin {
	width				: 40.5em;
}
fieldset {
	border				: 1px solid #D3D3D3;
}
h3.fieldset {
	border				: 1px solid #D3D3D3;
	background-color	: #E8EBF0;
	text-align			: left;	
	padding				: 0.3em 0.5em 0.3em 0.5em;
	margin				: 0 0 0.1em 0;
	font-size			: 1.0em;
	color				: #000;
	font-weight			: normal;
}
div.buttonsBelowForm {
	margin-top			: 1em;
	text-align			: right;
}

/* specifieke span ipv label*/
fieldset span {
	display				: block;
	float				: left;
	clear				: right;
	width				: 11em;	
	padding-top			: 0.3em;
	padding-left		: 0.5em;	
}
/* specifieke p ipv input*/
fieldset p {	
	padding-top			: 0.3em;	
}
/* normal fieldset (nFieldset) */
fieldset.nFieldset  {
	margin				: 0;
	margin-top			: 0.1em;
	padding				: 0;
	background-color	: #E8EBF0;					/* achtergrondkleur van de gehele fieldset (tot 10.5em, vanaf 10.5em is het wit) */
	background-image	: url(../img/witlijn.gif);	/* image of 1500px */
	background-position	: 10.5em 0;					/* start op 10.5em van links met witte achtergrond (0.5em kleiner dan de width van de label*/
	background-repeat	: repeat-y;
	padding-top			: 0.7em;
	vertical-align		:bottom;
}
fieldset.nFieldset.extra {
	background			: none;
	padding-top			: 0;
	border				: 0;
}
fieldset.nFieldset legend {
	border				: 1px solid #D3D3D3;
	background-color	: #E8EBF0;
	text-align			: left;	
	padding				: 0.3em 0.5em 0.3em 0.5em;
	margin				: 0 0 0.1em 0;
	font-size			: 1.0em;
	color				: #000;
	font-weight			: normal;
}
fieldset.nFieldset label {
	float				: left;
	width				: 11em;	/* 0.5em groter dan de background-position van de fieldset*/
	padding-left		: 0.6em;
	padding-top			: 0.3em;
}
fieldset.nFieldset label.extra {
	float				: none;
	width				: 8em;
	margin				: 0 0.2em 0 0;
	padding				: 0;
	position			: relative;
	top					: -0.4em;
	left				: 0;
	border				: 0;	
}
fieldset.nFieldset label.reset {
	width				: 0;
}
fieldset.nFieldset input, select, textarea {
	margin-bottom		: 5px;	
}

fieldset.noBackgroundPositon
{
	background-position	: 1.0em;	
	background-color: #FFF;
}

/* zoekscherm startpagina */
form.zoekschermStartPagina {
	display				: block;
	width				: 200px;
	float				: left;
	margin				: 0;
	margin-right		: 20px;
}
form.zoekschermStartPagina fieldset {
	padding				: 8px;
}
form.zoekschermStartPagina fieldset legend {
	display				: none;
}
form.zoekschermStartPagina fieldset label {
	font-size			: 10px;
	display				: block;
	margin				: 0;
	padding				: 0;
}
form.zoekschermStartPagina fieldset input {
	margin				: 0;
	padding				: 0;
}

#zoekschermDiv {
	margin-bottom		: 6px;
}

/* PAGINA-SPECIFIEKE STYLES */

#tableLocatieTotalen {
	margin-top			: 6px;
}

#tblServiceMonteursIncSo {
	width				: 90%;
}

/* genereer looplijstacties */
#genereerLooplijstActies {
	border				: 1px solid #000;
	width				: 350px;
}
#genereerLooplijstActies th {
	border-bottom		: 1px solid #000;
}
#monteurUrenTabel {
	width				: 200px;
}

/* div container voor datatabellen; geef een datatabel een hoogte en waar nodig een scrollbar */
div.dataTableContainer {
	height:30em;
	overflow-y:auto;
	overflow-x:hidden;	
}
div.dataTableContainer table {
	width:98%;
}
.tableBottomBorder
{
	border-bottom: 1px solid #d6d6d6;
	border-collapse: collapse;
}

/* FORM INPUTS */

input.readonly						{ border:0; }
/* input.fileUpload					{ width:38em;} */
input.uren							{ width:3.5em; }
input.aantal						{ width:4.2em;}
input.aantalProducten				{ width:3.5em;border:0; }
input.aantalProductenLocatie		{ width:2em; }
input.achternaam					{ width:24em; }
input.begindatum					{ width:5.5em; }
input.bestandsnaam					{ width:24em; }
input.betaalwijze					{ width:24em; }
input.contactpersoon				{ width:24em; }
input.contactPersoonKlein			{ width:8em; }
input.contractnummer 				{ width:24em; }
input.datum							{ width:5.5em; }
input.debiteurnaam	 				{ width:24em; }
input.debiteurNaamKlein				{ width:8em; }
input.debiteurnummer				{ width:4.8em; }
input.debiteurnummerKlein			{ width:8em; }
input.einddatum						{ width:5.5em; }
input.email							{ width:24em; }
input.fax	 						{ width:10em; }
input.faxKlein						{ width:8em; }
input.frequentie					{ width:4.2em; }
input.workload						{ width:4.2em; }
input.kenteken 						{ width:6em; }
input.locatie						{ width:24em; }
input.locatieKlein					{ width:8em; }
input.locatieNaam					{ width:24em; }
input.locatienummer					{ width:4.8em; }
input.monteur						{ width:24em; }
input.monteurKlein					{ width:8em; }
/* input.naam							{ width:24em; } */
input.nummer						{ width:3em; }
input.organisatie					{ width:24em; }
input.personeelsNummer 				{ width:24em; }
input.password						{ width:24em; }
input.plaats 						{ width:24em; }
input.plaatsKlein					{ width:8em; }
input.plandatum						{ width:5.5em; }
input.planningApprove				{ width:10.0em; }
input.planningApproveCancel			{ width:9.0em; }
input.planningAssign				{ width:4.0em; }
input.planningAssignCancel			{ width:10.0em; }
input.planningOverview				{ width:13.0em; }
input.planningOverviewCancel		{ width:9.0em; }
input.planningPrintAndMail  		{ width:13.0em; }
input.postcode 						{ width:4.2em; }
input.postCodeKlein					{ width:8em; }
input.productcode 					{ width:7em; }
input.selectInvoer					{ width:6em; }
input.serviceOpdrachtType			{ width:24em; }
input.soNummer 						{ width:24em;  }
input.soNummerKlein					{ width:8em;  }
input.straat 						{ width:24em; }
input.straatKlein					{ width:8em; }
input.serviceopdrachtLooplijst		{ width:8.5em; }       
input.serviceopdrachtServicebon		{ width:12.0em; }
input.telefoon 						{ width:10em; }
input.telefoonKlein					{ width:8em; }
input.telMobiel						{ width:11em; }
input.toevoeging					{ width:3em; }
input.totalen						{ width:3.5em; }
input.tussenvoegsels				{ width:11em; }
input.username						{ width:24em; }
input.voornaam 						{ width:24em; }
input.etage							{ width:2em; }
input.bouwjaar						{ width:2em; }
input.productlocatie				{ width:12em; }
input.emailSubject					{ width:42em; }
input.configMap						{ width:24em; }
input.rolNaam						{ width:24em; }
input.rolBeschrijving				{ width:24em; }
input.logoUpload					{ width:31em; }
input.code							{ width:15em; }
input.url							{ width:15em; }
input.httpReferer					{ width:15em; }
input.maxContentOnPage				{ width:15em; }
input.subject						{ width:31em; }
input.file							{ width:38em; }
input.titel							{ width:30em; }




.labelRadio { width:14em ! important }

/* select */
select.bestelwijze 			{ width:24.5em; }
select.gemeente				{ width:25em; }
select.taal					{ width:25em; }
select.land					{ width:25em; }
select.plaats				{ width:25em; }
select.provincie			{ width:25em; }
select.soortContract		{ width:24.5em; }
select.taalID				{ width:15.5em; }
select.templateID			{ width:15.5em; }
select.volgorde				{ width:14.5em; }


/* textarea */
textarea					{font-family	: Arial;} 

textarea.info				{ width:24em; }
textarea.opmerking			{ width:98%; height:10em; border:0; }
textarea.opmerkingKlein		{ width:98%; height:7em; border:0; }
textarea.productOpmerking	{ width:10em; height:3em;}
textarea.productLocatie		{ width:15em; height:3em;}
textarea.voorwaarden		{ width:42em; height:14em; }
textarea.emailcontent		{ width:42em; height:5em; }
textarea.introText			{ width:42em; height:7em; }

.beschrijving	{font-size			:100%;	
				 width:38em;
				 font-family:arial;}
				 
.bericht  		{ width:22.1em; 
				  font-size:100%;}
.fileUpload	{ 
	width:30.5em;
	height:1.7em;
	margin-bottom:5px;
	padding:0;
}
.naam { 
	width:20em; 
	height:1.4em;
	margin-bottom:5px;
	padding:0;	
}

/*class wordt ook gebruikt bij servicebonnen van afgeronde SO's */
.opmerkingKlein		{ width:98%; height:7em; border:0; font-weight: normal; }


input.image {
	border				: 0;
	margin				: 3px 6px 0 6px;	
}

/* specific classes */
img.icon {
	width				: 22px;
	height				: 22px;		
	margin-left			: 6px;		
}

img.menuIcon {
	width				: 22px;
	height				: 22px;		
}

img.iconSmall {
	width				: 16px;
	height				: 16px;	
	margin-left			: 6px;
}

.locatieRegioSelectie		{
	padding-left:1.7em;
	font-weight:bold;
}

/* ERROR HANDLING */
.inputErrorValidatie {
	border 				: 1px solid #FF0000 !important;	
}

select.inputErrorValidatie {
	border-left 		: 1px solid #FF0000;	
	border-right 		: 1px solid #FF0000;	
	border-top 			: 1px solid #FF0000;	
	border-bottom 		: 1px solid #FF0000;	
}

.messageErrorFormat {
	color				: #FF0000;
	margin-bottom		: 6px;
}
.messageSuccesFormat {
	color				: #FF0000;
	margin-bottom		: 6px;
}


/* POPUP DIVJES */
.overlay {
	position:absolute;
	width: 100%;
	height: auto;
	left: 0;
	top: 0;
	background: #E8EBF0;
}

.popup {
		position:absolute;
     	left: 50%; 
    	top: 50%;
    	width: 700px;
     	/*height: 500px;  geen height opgeven. */
    	margin-top: -250px; /* half of the height */
     	margin-left: -350px; /* half of the width */
		border:		1px solid #000;
		z-index: 10;
}

.popupHeader {
		margin: 0;
		padding: 0;
		background: #E8EBF0;
		border-bottom: 1px solid #000;
		height: 25px;
}

.close {
		position: relative;
		float   : right;
		padding : 5px;
		cursor  : default; 
}

.popupTable {
		width: 663px;
}

#contentPopup {
		width: 400px;
}

.mainDiv {
	padding: 10px;
	background: #FFF;
}

.overflowDiv {
	height: 175px;
	overflow: auto;
}
.hAlign {
	float: left;
	vertical-align: middle;
}
.inputCamouflage {
	border-style: none;
	border-color:#FFFFFF;
	width: 10em;
	height: 1.0em;
	font-size: 1.0em;
}

/* planning links / spans*/
.selectPeriode ,.deSelectPeriode{
	text-decoration		: underline;
}
.atttentionPlanning {
	color:#FF0000;
}
.progressbar {
	border	: 1px solid #000;
}

/* lijsten */
.lijstRijSelected {
	background-color : #eeeeee;
	cursor			 : pointer;
}

/*Elementen worden alleen in de print weergegeven (als alternatief voor een select bijvoorbeeld) */
.noDisplayPrint
{
	display:none;
}
.colofon
{
	margin-left: 16px;	
}
#colofon
{
	margin-left: 16px;	
}
.bovenkantpagina
{
	margin-right: 20px;
}

/* UITBREIDING VOOR TVSHOW, kiezen van een thumb */

.thumbContainer		{
	width: 80%;
	height: 115px;
	overflow: auto;
	background-color: #FFF;
	padding-top: 5px;
	border: 1px solid #000;
}

.imgThumb {
	display: block;

}	

.thumb {
	float:left;
	margin-left:5px;
}

.fotoGoedgekeurd {
	background-color:#00ff40; 
}
.fotoAfgekeurd {
	background-color:#ff0000;
	color:#fff;  
}
.fotoNieuw {
	background-color:#ffff00; 
}




