#LoginScreenTop{
	background-image: url('img/logo-csys.png');
}

#topbarcontent {
	background-image: url('img/logo-csys.png');
}

#mainmenu li#formation{
	background-image:url('img/formation.png');
}

#mainmenu li#overviews{
	background-image:url('img/overviews.png');
}

#mainmenu li#profile{
	background-image:url('img/profile.png');
}

#mainmenu li#agreements{
	background-image:url('img/overviews.png');
}

#mainmenu li#jobsize{
	background-image:url('img/jobsize.png');
}

#mainmenu li#teachers{
	background-image:url('img/teachers.png');
}

#mainmenu li#formation-preferences{
	background-image:url('img/formation-preferences.png');
}

#mainmenu li#task-list{
	background-image:url('img/information.png');
}

#tabmenu li{
	width:auto;
}

#DefaultButtonRight{
	float:right;
	margin-left:10px;
}

.DeleteButton{
	text-decoration:none;
	color:#000000;
	float:right;
	display:none;
}

tr:hover .DeleteButton{
	display:block;
}

#tabmenu .Crop{
	margin-right:0px;
}

#tabmenu.small li{
	padding-left:12px;
	padding-right:12px;
}

#tabmenu li.AlignRight{
	float:right;
	background:none;
	border:none;
}
#tabmenu li.AlignRight:hover{
	font-weight:normal;
}

#tabmenu li.AlignRight#selected,#tabmenu li.AlignRight#selected:hover{
	font-weight:normal;
}

#tabmenu li.AlignRight:after{
	content:" \25BA";
	color:#CCCCCC;
}

#tabmenu li.AlignRight:hover:after{
	color:#000000;
}

#tabmenu li.completed{
	background-color:#FFF;
}

#tabmenu li.selected{
	font-weight:bold;
	border-bottom:1px solid #FFF;
}

#tabmenu2 {
	margin:0px;
	padding:0px;
	list-style-type:none;
	height:41px;
}

#tabmenu2 li{
	float:left;
	padding-left:15px;
	padding-right:15px;
	margin-left:8px;
	margin-right:7px;
	border:1px solid #CCCCCC;
	border-radius:5px;
	text-align:center;
	height:40px;
	line-height:40px;
	background-color:#EFEFEF;
	margin-bottom:15px;
}

#tabmenu2 li:hover{
	background-color:#DDDDDD;
}

#tabmenu2 li#selected,#tabmenu li#selected:hover{
	background:#FFFFFF;
	font-weight:bold;
}

#tabmenu2 a{
	text-decoration:none;
	font-family:arial;
	font-size:14px;
	color:#000000;
}

#content h2{
	font-family:arial;
	font-size:19px;
	color:#333333;
	line-height:40px;
	margin-top:0px;
}

.selectbox{
	border:none;
	background:none;
	display:inline-block;
	margin-left:8px;
	margin-right:7px;
	border:1px solid #CCCCCC;
	border-radius:5px;
	text-align:center;
	height:40px;
	line-height:40px;
	background-color:#EFEFEF;
}

.selectbox::before{
	content: "\25BC";
	color: #CCCCCC;
	font-weight: bold;
	margin-left:475px;
	width:25px;
	display:inline-block;
}

.selectbox select{
	background:transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
	outline:none;
	border:none;
	width:500px;
	margin-left:-500px;
	height:40px;
	padding-left:15px;
	padding-right:15px;
}

.selectbox select::-ms-expand {
    display: none;
}

.selectbox select:focus::-ms-value {
	background: white;
	color:#000000;
}

.selectbox select:hover{
	cursor:pointer;
}

.selectbox select option span{
	width:50px;
	display:inline-block;
}

.searchbox{
	display:inline-block;
	border:1px solid #CCCCCC;
	border-radius:5px;
	text-align:left;
	height:40px;
	line-height:40px;
	background-color:#EFEFEF;
	width:160px;
}

.searchbox input{
	border:none;
	background:none;
	padding-left:5px;
	width:135px;
	height:37px;
}

.searchbox input.start{
	color:#AAAAAA;
}

.searchbox a{
	color: #CCCCCC;
	font-weight: bold;
	text-decoration:none;
}

.searchbox a:hover{
	color:#333333;
}

table{
	border-collapse:collapse;
	width:100%;
}

td{
	height:32px;
}

.formation#xl{
	margin-left:-250px;
	width:1000px;
}

.formation th{
	border:1px dotted #AAAAAA;
	border-bottom:1px solid #AAAAAA;
	vertical-align:bottom;
	padding-top:5px;
	padding-bottom:5px;
	text-align:center;
}

.formation th span,.settings th span{
	-ms-writing-mode: tb-rl; 
	-webkit-writing-mode: vertical-rl;
	-moz-writing-mode: vertical-rl;
	-ms-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
}

.formation td{
	border-bottom:1px solid #AAAAAA;
	border-right:1px dotted #AAAAAA;
	text-align:center;
}

.formation td:first-child{
	width:180px;
}

.formation#xl td:first-child{
	width:250px;
}

.formation td:nth-child(2),.formation td:nth-child(3),.formation td:nth-child(4),.formation td:nth-child(5),.formation td:nth-child(6),.formation td:nth-child(7),.formation td:nth-child(8),.formation td:nth-last-child(2),.formation td:last-child,.formation td.small{
	width:30px;
}

.formation td.klas_afkorting{
	width:30px;
	border-right:none;
}

.formation td.klas_naam{
	width:160px;
	text-align:left;
}

.formation td.edit:hover, .assign td.edit:hover, .settings td.edit:hover{
	cursor:pointer;
	background-color:#73b9ff;
}

.formation td.alert,td.alert{
	background-color:#ffc6c6;
}

.formation td.linked{
	text-align:left;
	padding-left:5px;
	text-decoration:underline;
}

.assign th{
	height:32px;
	text-align:left;
	border-bottom:1px solid #AAAAAA;
}

.assign td{
	border-bottom:1px dotted #AAAAAA;
}

.assign tr:first-child td{
	border-top:1px dotted #AAAAAA;
}

.assign tr.totaal td,.settings tr.totaal td{
	border:none;
	border-top:1px solid #AAAAAA;
	font-weight:bold;
}

.assign tr.edit:hover td{
	cursor:pointer;
	background-color:#73b9ff;
}

.assign tr.checkbox:hover td{
	cursor:pointer;
}

.assign tr.edit input[type=checkbox],.assign tr.checkbox input[type=checkbox]{
	visibility: hidden;
}

.assign tr.edit span,.assign tr.checkbox span{
	float:left;
	height:32px;
	line-height:32px;
	padding-left:4px;
}

.assign tr.edit span:before,.assign tr.checkbox span:before{
	content:"\2714";
	visibility: visible;
	color:#DDDDDD;
	font-size:17px;
}

.assign tr.edit input[type=checkbox]:checked +span:before,.assign tr.checkbox input[type=checkbox]:checked +span:before{
	color:#000000;
}

.assign tr.redirect:hover,.assign tr.roosterwensen_redirect:hover{
	cursor:pointer;
	background-color:#73b9ff;
}

.assign tr.roosterwensen_redirect td,.assign tr.roosterwensen_dummy td{
	border-top:1px dotted #AAA;
	border-bottom:none;
}

.assign tr.roosterwensen_redirect td:last-child{
	text-align:right;
	padding-right:10px;
}

.assign tr.roosterwensen_taak_omschrijving{
	display:none;
}

.assign tr.roosterwensen_taak_omschrijving td,.assign tr.multiline td{
	height:auto;
	padding-top:10px;
	padding-bottom:10px;
}

.assign tr.inactive td{
	color:#CCC;
}

.assign tr.inactive td span{
	float:right;
	color:#000;
	font-style:italic;
	margin-right:20px;
}

.assign tr.LeerjarenDisabled{
	display:none;
}

.assign td.AlignWithInput{
	padding-left:6px;
}

.assign td.AlignRight{
	text-align:right;
	padding-right:5px;
}

.assign td.dropdown{
	position:relative;
}

.assign td.dropdown:before{
	position:absolute;
	right:5px;
	height:32px;
	line-height:32px;
	content:"\25BC";
	pointer-events:none;
}

.assign tr.redirect td:last-child a:hover{
	background-color:rgba(255,2555,255,0.7);
}

.assign td select{
	border:none;
	background:none;
	height: 32px;
	-webkit-appearance: none;
	-moz-appearance: none;
	margin: 0;
	outline: none;
	width:100%;
	padding-left:4px;
}

.assign td select::-ms-expand {
    display: none;
}

.assign td select:focus::-ms-value {
	background: white;
	color:#000000;
}

.assign td select:hover{
	cursor:pointer;
}

.assign td select[disabled]{
	color:#000000;
	cursor:default;
}

.assign td input[type=text]{
	text-align:left;
}

.assign td textarea{
	border:none;
	width:100%;
	height:75px;
	font-family:arial;
	padding-top:5px;
	padding-left:5px;
	padding-bottom:5px;
}

.settings th{
	font-weight:bold;
	text-align:center;
	border:1px dotted #AAAAAA;
	border-bottom:1px solid #AAAAAA;
	height:30px;
}

.settings th:first-child, .formation th:first-child{
	border:none;
	border-bottom:1px solid #AAAAAA;
}

.settings tr.ExtraTopRow th{
	border-right:1px dotted #AAAAAA;
}

.settings tr.ExtraTopRow th:first-child{
	border:none;
}

.settings tr.rotated th{
	vertical-align:bottom;
	padding-top:5px;
	padding-bottom:5px;
	height:150px;
}

.settings td, .formation td{
	border-bottom:1px solid #AAAAAA;
	border-right:1px dotted #AAAAAA;
	background-color:#FFFFFF;
	text-align:center;
	padding:0px;
}

.settings td:first-child, .formation td:first-child{
	text-align:left;
}

.settings td.disabled,.formation td.disabled{
	background-color:#DDDDDD;
}

.settings td input[type=text],.assign td input[type=text]{
	border:0px;
	height:30px;
	width:100%;
	background-color: #FFFFFF;
	margin:0px;
	font-size:14px;
}

.taakomvang  td input[type=text]{
	background:url('img/edit.png') no-repeat right 5px center;
	cursor:pointer;
}

.taakomvang  td input[type=text]:focus{
	background:none;
}

.taakomvang  td select{
	background:url('img/edit.png') no-repeat right center;
	cursor:pointer;
}

.taakomvang td.PeriodSelect{
	position:relative;
}

.taakomvang td.PeriodSelect select{
	background:none;
	padding-left:0px;
}

.taakomvang td.PeriodSelect:after{
	content:"\25BC";
	position:absolute;
	top:0px;
	line-height:32px;
	right:5px;
}

.assign td input[type=text]{
	padding-left:5px;
}

.assign td input[type=text].prefill{
	color:#777;
}

.assign td input[type=radio]{
	display:block;
	float:left;
	clear:left;
	height:26px;
}

.assign td label{
	display:block;
	float:left;
	height:30px;
	line-height:30px;
	padding-left:8px;
}

.settings td input[type=text]{
	text-align:center;
}

.settings td input[type=text]:focus,.assign td input[type=text]:focus{
	outline:2px solid #73b9ff;
}

.settings td input[value=""],.settings td.AverageEmpty{
	background-color:#DDDDDD;
}

.finances tr th:last-child,.finances tr td:last-child{
	text-align:right;
	padding-right:20px;
}

.finances tr.detail{
	display:none;
}

.export td{
	height:50px;
}

.export td:last-child{
	text-align:right;
}

.export tr:hover td{
	cursor:pointer;
	background-color:#EEE;
}

.roosterwensen th{
	text-align:left;
}

.roosterwensen td{
	border-bottom:1px dotted #AAAAAA;
}

.roosterwensen td input[type=text]{
	height:30px;
	border:1px solid #CCC;
	font-size:14px;
	padding-left:2%;
	padding-right:2%;
	border-radius:3px;
}

.roosterwensen td input[type=text].fullwidth{
	width:96%;
}

.roosterwensen td select{
	height:30px;
	border:1px solid #CCC;
	font-size:14px;
	padding-left:2%;
	padding-right:30px;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor:pointer;
	border-radius:3px;
}

.roosterwensen td select::-ms-expand {
    display: none;
}

.roosterwensen td span.RoosterwensenSelect:after{
	content: "\25BC";
	color: #000000;
	font-weight: bold;
	width:25px;
	display:inline-block;
	margin-left:-25px;
	pointer-events:none;
}

.roosterwensen td textarea{
	border:1px solid #CCC;
	font-size:14px;
	padding-left:2%;
	padding-top:2%;
	padding-bottom:2%;
	padding-right:2%;
	width:96%;
	font-family:arial;
	border-radius:3px;
}

.roosterwensen td input[type=radio],.roosterwensen td input[type=checkbox]{
	cursor:pointer;
}

.roosterwensen td label{
	cursor:pointer;
}

.filterbar{
	width:100%;
	height:40px;
	line-height:40px;
	border:1px solid #DDDDDD;
	border-radius:5px;
	margin-bottom:10px;
	font-family:arial;
	font-size:14px;
	text-align:left;
}

.filterbarsmall{
	float:right;
	width:250px;
}

.filterbar ul{
	margin:0px;
	padding:0px;
	list-style-type:none;
}

.filterbar li{
	display:block;
	float:left;
	height:40px;
	line-height:40px;
}

.filterbar span{
	display:block;
	float:left;
	background-color:#e6e6e6;
	padding-left:10px;
	padding-right:10px;	
	font-weight:bold;
}

.filterbar li#teacher span{
	width:50px;
}

.filterbar li#year span{
	width:75px;
}

.filterbar li#search span{
	width:50px;
}

.filterbar div{
	display:block;
	float:left;
}

.filterbar div::before{
	content: "\25BC";
	color: #000000;
	font-weight: bold;
	width:25px;
	display:inline-block;
}

.filterbar li#teacher div::before{
	margin-left:405px;
}

.filterbar li#year div::before{
	margin-left:130px;
}

.filterbar select{
	width:auto;
	border:none;
	height:40px;
	padding-left:10px;
	background:transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.filterbar select::-ms-expand {
    display: none;
}

.filterbar select:hover{
	cursor:pointer;
}

.filterbar li#teacher select{
	margin-left:-430px;
	width:430px;
}

.filterbar li#year select{
	margin-left:-155px;
	width:155px;
}

.filterbar input{
	border:none;
	background:none;
	padding-left:10px;
	padding-right:10px;
	width:130px;
	height:37px;
	font-size:14px;
	font-family:arial;
}

.filterbar a{
	display:inline-block;
	color: #000000;
	font-weight: bold;
	text-decoration:none;
	width:30px;
	text-align:center;
}

.filterbar a:hover{
	background-color:#e6e6e6;
}

.TaakomvangToggle, .TaakomvangToggleHide{
	display:none;
}

.TaakomvangToggle td:first-child,.TaakomvangSub td:first-child{
	padding-left:20px;
}

.TaakomvangToggleRedirect td:last-child:after{
	content:"\271A";
	float:right;
	margin-right:5px;
}

.TaakomvangToggleHide{
	display:none;
}

.edit td:last-child a{
	float:right;
	width:32px;
	height:32px;
	line-height:32px;
	color:#000000;
	text-decoration:none;
	text-align:center;
	border-left:1px dotted #CCCCCC;
}

.edit td:last-child a:hover{
	background-color:#E9E9E9;
}

#SettingsCopyHours{
	border:1px solid #CCCCCC;
	background-color:#FFFFFF;
	border-radius:5px;
	margin-bottom:10px;
	padding-left:10px;
	padding-top:10px;
	padding-right:10px;
	padding-bottom:10px;
}

.taakuren{
	display:none;
}

.RoosterwensenCategorie{
	height:50px;
	line-height:50px;
	font-weight:bold;
}

#schoolyear,#printdate{
	display:none;
}

.RoosterwensenAntwoord,.RoosterwensenAntwoordEmpty{
	color:#FFF;
	padding-top:5px;
	padding-right:10px;
	padding-bottom:5px;
	padding-left:10px;
	border:1px solid #888;
	border-radius:3px;
	line-height:1.5em;
}

p.RoosterwensenAntwoord,p.RoosterwensenAntwoordEmpty{
	margin:0px;
	margin-top:2px;
}

.RoosterwensenAntwoord{
	background-color:#888;
}

.RoosterwensenAntwoordEmpty:before{
	content:"\00a0\00a0-\00a0\00a0";
	color:#888;
	text-align:center;
}

.MaximumUrenDisabled{
	display:none;
}

span.inactive{
	float:right;
	background-color:#333;
	color:#FFF;
	border-radius:5px;
	padding-left:10px;
	padding-right:10px;
}

.timesheet{
	border-collapse:collapse;
	width:100%;
}

.timesheet th{
	border:1px dotted #AAA;
	border-bottom:1px solid #AAA;
	text-align:center;
	height:30px;
}

.timesheet th:first-child{
	border:none;
	border-bottom:1px solid #AAA;
}

.timesheet td{
	font-family:arial;
	border-bottom:1px solid #AAA;
	border-right:1px dotted #AAA;
	height:30px;
	position:relative;
}

.timesheet td:not(:first-child){
	width:50px;
}

.timesheet td:first-child{
	font-weight:bold;
}

.timesheet td:first-child span{
	font-weight:normal;
	margin-left:20px;
	font-style:italic;
}

.timesheet td input[type=text]{
	border:none;
	width:98%;
	height:30px;
	text-align:center;
}

.timesheet td input[type=text]:focus{
	outline:2px solid #73b9ff;
}

.timesheet td:not(:first-child) span{
	position:absolute;
	bottom:0px;
	right:1px;
	font-size:10px;
	color:#AAA;
	font-style:italic;
}

.timesheet td:last-child{
	text-align:center;
}

.timesheet tr:last-child td{
	border:none;
	font-weight:bold;
}

.PeriodLink{
	text-decoration:none;
	color:#000;
}

.PeriodLink:hover{
	text-decoration:underline;
}