﻿@charset "UTF-8";
/* Custom CSS Document */
/* Portal4U */

/* ================================================================================================================================================================================================ */	
/* ================================================================================================================================================================================================ */	
/* ================================================================================================================================================================================================ */	


/**/

	body {
		background: url(https://tans.net/storage/916/conversions/homepage-banner-min-header.png) center center no-repeat;		
	}


/* ======================== */	
/* => CUSTOM LABELS */
/* ======================== */	

	.mainleftmenulist-newentry a ,a.add-label, .add-label {
	  display: inline-block; /* Maakt het span-element als een blokknop */
	  padding: 4px 20px; /* Binnenruimte voor tekst */
	  background-color: #45a049; /* Mooie groene achtergrondkleur */
	  color: white; /* Witte tekstkleur */
	  border-radius: 20px; /* Maakt de knop rond */
/*	  font-size: 16px; /* Lettergrootte */
	  text-align: center; /* Tekst centreren */
	  text-decoration: none; /* Geen onderstreping */
	  border: none; /* Geen rand */
	  cursor: pointer; /* Cursor verandert naar pointer bij hover */
	  transition: all 0.3s ease; /* Gladde overgang voor hover-effecten */
	}

	.mainleftmenulist-newentry a:hover, a.add-label:hover, .add-label:hover {
	  background-color: #4583be; /* Donkere tint bij hover */
	  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Schaduweffect */
	}
	
	.accept-label {
	  display: inline-block; /* Maakt het span-element als een blokknop */
	  padding: 4px 20px; /* Binnenruimte voor tekst */
	  background-color: #288A38; /* Mooie groene achtergrondkleur */
	  color: white; /* Witte tekstkleur */
	  border-radius: 20px; /* Maakt de knop rond */
/*	  font-size: 16px; /* Lettergrootte */
	  text-align: center; /* Tekst centreren */
	  text-decoration: none; /* Geen onderstreping */
	  border: none; /* Geen rand */
	  cursor: pointer; /* Cursor verandert naar pointer bij hover */
	  transition: all 0.3s ease; /* Gladde overgang voor hover-effecten */
	}

	.accept-label:hover {
	  background-color: #2B6735; /* Donkere tint bij hover */
	  color: #EEEEEE;
	  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Schaduweffect */
	}	

	.edit-label {
	  display: inline-block; /* Maakt het span-element als een blokknop */
	  padding: 4px 20px; /* Binnenruimte voor tekst */
	  background-color: #4583be; /* Mooie groene achtergrondkleur */
	  color: white; /* Witte tekstkleur */
	  border-radius: 20px; /* Maakt de knop rond */
/*	  font-size: 16px; /* Lettergrootte */
	  text-align: center; /* Tekst centreren */
	  text-decoration: none; /* Geen onderstreping */
	  border: none; /* Geen rand */
	  cursor: pointer; /* Cursor verandert naar pointer bij hover */
	  transition: all 0.3s ease; /* Gladde overgang voor hover-effecten */
	}

	.edit-label:hover {
	  background-color: #45a049; /* Donkere tint bij hover */
	  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Schaduweffect */
	}

	.delete-label {
	  display: inline-block; /* Maakt het span-element als een blokknop */
	  padding: 4px 20px; /* Binnenruimte voor tekst */
	  background-color: #9F2627; /* Mooie groene achtergrondkleur */
	  color: white; /* Witte tekstkleur */
	  border-radius: 20px; /* Maakt de knop rond */
/*	  font-size: 16px; /* Lettergrootte */
	  text-align: center; /* Tekst centreren */
	  text-decoration: none; /* Geen onderstreping */
	  border: none; /* Geen rand */
	  cursor: pointer; /* Cursor verandert naar pointer bij hover */
	  transition: all 0.3s ease; /* Gladde overgang voor hover-effecten */
	}

	.delete-label:hover {
	  background-color: #D9696A; /* Donkere tint bij hover */
	  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Schaduweffect */
	}


	.calendar-day {
		display: inline-block;
		padding: 40px 20px;
		margin: 5px;
		border: 1px solid #ddd;
		border-radius: 4px;
		background-color: #f9f9f9;
		font-family: Arial, sans-serif;
		font-size: 14px;
		color: #333;
		text-align: center;
		transition: all 0.3s ease;
	}

	.calendar-day:hover {
		background-color: #e0e0e0;
		cursor: pointer;
	}

	.calendar-daytoday {
		display: inline-block;
		padding: 40px 20px;
		margin: 5px;
		font-family: Arial, sans-serif;
		font-size: 14px;
		text-align: center;
		transition: all 0.3s ease;
		border-radius: 4px;
		border: 2px solid #ff9800;
		background-color: #ffe0b2;
		font-weight: bold;
		color: #d84315;
	}
	
	.calendar-daytoday:hover {
		background-color: #99e0b2;
		cursor: pointer;
	}


/* ======================== */	
/* => MAIN */
/* ======================== */	

	h2 { color:#4583be; }
	
	.divLogoImg { background-image: url(../../Images/logo-tans.png); }

	

/* ======================== */	
/* => INPUT FIELDS */
/* ======================== */
/*
	button[type=submit], button[type=button], input[type=submit], input[type=button], button[type=reset], input[type=reset] { background-color:#4583be; border:1px solid #20719a; }

	div.form_input_documentDownload .form_input_documentHyperlink a { color:#4583be; }
*/
/* ======================== */	
/* => LOGIN */
/* ======================== */	

	.form_formmain div > a { color: #4583be; }
	.form_companylogopicture { background-image: url(../../Images/logo-tans.png); height: 100px; }

/* ======================== */	
/* => HEADER */
/* ======================== */	

	.header { border-top: 65px solid #FFFFFF; }

	.header_topnav { background: #EEEEEE; color: #333333;	}
	.topnav > li a { color: #333333;	}
	.topnav > li a:hover { color: #999999;	}
	.topnav > a:focus { border-bottom:7px solid #4583be; }
	
	.subnav { background: #EEEEEE;	}
	.subnav li a:hover { background:#999999; color: #EEEEEE;	}
	.subnav li span:hover { background:#999999; }
	.subnav li.selected { border-left:5px solid #4583be; }
	
	
	.header .divLogo {	border: none;	}

/* ======================== */	
/* => CONTENT DIV */
/* ======================== */

	.cnt_div-hdr { background-color:#4583be; }
	.cnt_content { text-align: left;	}

/* ======================== */	
/* => LEFT MENU DIV */
/* ======================== */
/*
	.menuoptionsbutton a { background-color: #4583be; color: #FFF; }
	.menuoptions > div > div.mainleftmenu { border:1px solid #d5d5d5; border-bottom:5px solid #4583be; }
	.mainleftfilters > h1 { background-color: #4583be; color: #FFF; }
	.mainleftmenulist li a:hover { color:#4583be; }
*/
/* ======================== */
/* => Content Table */
/* ======================== */
/*
	.entity.jQueryPanel table.entity.searchResults > tbody > tr > td a { color:#4583be; }

	.cnt_div-content table.tblNormaal > thead > tr:hover th a { color:#4583be; }	
	.cnt_div-content table.tblNormaal > thead > tr:hover th a:hover { color:#4583be; }	
	.cnt_div-content table.tblNormaal > tbody > tr > td:hover a { color:#4583be; }	
	.cnt_div-content table.tblNormaal > thead > tr > th:hover a { color:#4583be; }
*/
/* ======================== */	
/* => GROUPS.ASPX */
/* ======================== */	

	.dashboardnavresultnav li:first-child { color: #4583be; }
	.dashboardnavresultnav li a:hover { color: #4583be; }

	.dashboard_menu { max-width: 120px;	width: 120px; }

/* ======================== */	
/* => FORMS.ASPX */
/* ======================== */	
/*
	.cnt_div-content table.formulier td.form_text_header { color:#4583be; }
	.cnt_div-content table.formulier td.form_text_label a { color:#4583be; }
*/
/* ======================== */	
/* => PAGE.ASPX */
/* ======================== */	

	table.pageaspx_infotable span.infotable a { color:#FFFFFF; }

/* ======================== */	
/* => PAGING OVERVIEW  */
/* ======================== */	
/*
	.entity.titlePanel { border-bottom: 1px solid #d5d5d5; background-color: #4583be; }
	.entity.pager > td > table > tbody > tr > td > a,
	.entity.pager > td > table > tbody > tr > td > span,
	.pagenavigation > td > table > tbody > tr > td > a,
	.pagenavigation > td > table > tbody > tr > td > span,
	.detailviewaspx .pagenavigation {
	  background-color: #ffffff;
	  border: 1px solid #dddddd;
	  color:#4583be;
	}

	.entity.pager > td > table > tbody > tr > td > span,
	.entity.pager > td > table > tbody > tr > td > span:hover,
	.entity.pager > td > table > tbody > tr > td > span:focus,
	.pagenavigation > td > table > tbody > tr > td > span,
	.pagenavigation > td > table > tbody > tr > td > span:hover,
	.pagenavigation > td > table > tbody > tr > td > span:focus {
		color: #ffffff;
		background-color: #4583be;
		border-color: #20719a;
	}
*/
/* ======================== */	
/* => jQuery DatePicker */
/* ======================== */	
/*
	.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
		border: 1px solid #4583be!important;
		background: #fff!important;
		color: #4583be!important;
	}

	.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active,
	a.ui-button:active, .ui-button:active, .ui-state-active.ui-button:hover {
		border: 1px solid #4583be!important;
		background: #4583be!important;
		color: #fff!important;
	}
*/