
/****** colour template ******/
.green, a:hover, .loginwrp a:hover, #head #utility a.on, #head #utility a:hover, #head #utility a.util:hover, td.hasfa .ep, td.hasfa .svg-inline--fa, td a .ep, td a .svg-inline--fa, td a.ext .ep, td a.ext .svg-inline--fa, .tile.gall .file_buttons a:hover, #notification .noticon ul li:hover, #logo #csys:hover { color: #61ba4e; }
.bod.sys, input.btn, a.btn, span.btn, button, input[type="button"], .toolbox .btn:hover, #form_beacon_content input[type="button"]:focus, .ui-button, .fom *.btn:focus, input[type="button"].ui-state-focus, .input, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .mce-container .mce-close, /*.progwrp .progcon,*/ .fc-button, .toolbox .btn.normal.blue, div.jfilestyle label, .admin .mce-container.mce-panel.mce-foot .mce-widget.mce-btn button, .admin .mce-container.mce-panel.mce-foot .mce-widget .mce-primary, #snav li.on, .tbltab a:hover, .paging span.pgnum, button.mfp-close, button.mfp-arrow, #calendar td.fc-day.fc-today, .timepicker_wrap .prev, .timepicker_wrap .next, #snav ul li span.on, .toolbox li a:hover, .toolbox li a.active, .toolbox li ul li a.btn:hover, .tbltab a.active { background-color: #61ba4e; }
.tbltab a.active { border-bottom: 1px solid #61ba4e; }

.blue .heading.blue, a, .toolbox ul li ul li a.btn:not(.normal) { color: #152d6a; }
.blue_bg, .btn.blue, .toolbox .btn { background-color: #152d6a; }

.toolbox .btn:not(.normal), .toolbox .btn, .toolbox.btn:hover, .toolbox ul li ul li a.btn:not(.normal):hover { color: #fff; }

#fotsys { color: #fff; }



/* site */
.bod.sys #utility .wrp, .bod.sys .wrp, .bod.sys .wrp.viw, .bod.sys #fot .wrp { width: 1280px; margin: 0 auto; }

.bod.sys {  }
.bod.sys .emspace.hedspace { height: 100px; }
.bod.sys #utility { background: #fff; border-bottom: 1px solid #eee; -webkit-box-shadow: 0px 5px 5px 0px rgba(204,204,204,0.75); -moz-box-shadow: 0px 5px 5px 0px rgba(204,204,204,0.75); box-shadow: 0px 5px 5px 0px rgba(204,204,204,0.75);

	position: relative; z-index: 2;
}
.bod.sys #utility .wrp { padding: 25px 0 10px 0; }
.bod.sys #utility .wrp h1 { float: left; margin: 0; padding: 0; font-size: 21px; font-weight: 400; text-transform: none; }
.bod.sys #utility .wrp span, .bod.sys #utility .wrp a { float: right; }
.bod.sys #utility .wrp span { margin-right: 7px; font-size: 14px; }
.bod.sys #utility .wrp a { margin-left: 7px; }
.bod.sys #utility .wrp .fa { font-size: 21px; }

.bod.sys #utility .wrp h1 a.btn { float: left; display: inline-block; height: 18px; line-height: 18px; margin-right: 14px; padding: 4px 7px; color: #fff; }
.bod.sys #utility .wrp h1 a.btn .fa { font-size: 12px; }

.bod.sys .wrp.mwrp { width: 95%; padding: 20px 30px; background: #fff; -webkit-box-shadow: 0px 0px 7px 0px rgba(204,204,204,1); -moz-box-shadow: 0px 0px 7px 0px rgba(204,204,204,1); box-shadow: 0px 0px 7px 0px rgba(204,204,204,1); }

#bod { background: #fafafa; min-height: 640px; height: auto !important; height: 640px;

	position: relative; z-index: 1;
}

.bod.sys table { border: 0; }
.bod.sys table thead { background: #fafafa; border: 1px solid #ebedf2; }

.whitebox {
	padding: 10px 20px;
	background: #fff;
	border: 1px solid #cfd9db;
}
.whitebox .heading { background: none; border: 0; }






/* specifics || overwrites */
.bod.sys #hed ul { top: 0; }
.bod.sys #mnav #logo, .bod.sys #mnav ul { float: none; display: block; text-align: center; }
.bod.sys #mnav #logo { width: 100px; margin: 0 auto; }
.bod.sys #mnav li a { margin: 0 7px; font-size: 14px; }

#hed {
	padding-top: 30px;
}






.bod.sys, .bod.sys .fom * { font: 300 14px/21px 'Open Sans',arial,sans-serif; }
.bod.sys h1, .bod.sys h2, .bod.sys h3, .bod.sys h4, .bod.sys h5, .bod.sys h6, .bod.sys #mnav li a { font-family: 'Open Sans',sans-serif; }
.bod.sys h1, .bod.sys h2, .bod.sys h3, .bod.sys h4, .bod.sys h5, .bod.sys h6 { font-weight: 600px; }

.bod.sys .heading { margin: 0 0 20px 0; padding: 10px 0; font-size: 1.17em; border: none; }

p a.btn { margin: 0; }
.toolbox .btn, .toolbox ul li a.btn { padding: 0 14px; font-size: 14px; line-height: 42px; }
.toolbox .btn { margin: 0 4px 0 0; }
.toolbox ul li ul li a.btn { margin: 0; padding: 0 14px; }






.bod.sys #hed .mbnav { background-color: #61ba4e; z-index: 999; }






/* base.css overwrites 210412 */
#con { background: #fff; }
.tblwrp { background: none; }

.fwrp.fgrp .fwrp.split { width: 24%; margin-right: 1%; }
.fwrp.fgrp .fwrp.split input:not(.radiof) { width: 90%; }
.fwrp.fgrp .fwrp.split select { width: 98%; }
.fwrp.fgrp .fwrp.split input.hasDatepicker, .fwrp.fgrp .fwrp.split input#date { width: 110px; }










/* base.css overwrites login page (post framework upgrade) */
@keyframes loginContentIntro {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0px);
	}
}

.login { background: #61ba4e; height: 100vh; }

.loginwrp { display: grid; place-items: center; height: 100%; background: none }

.logincontent { font-family: sans-serif; opacity: 0; animation: loginContentIntro 0.4s ease-out forwards 0.5s; display: grid; place-items: center; box-shadow: 0 0 1rem rgba(0,0,0,0.2); padding: 48px; background: #fff; border-radius: 12px }

.logincontent > .resp { max-width: 200px }

@media only screen and (max-width: 1280px) {

.bod.sys #utility .wrp, .bod.sys .wrp, .bod.sys .wrp.viw, .bod.sys #fot .wrp { width: 92%; }

}
@media only screen and (max-width: 1024px) {

.bod.sys .wrp.mwrp { width: 92%; }
.coltwo, .coltre, .coltre.mid, .coltre.dbl, .colfor, .colfor.dbl, .colfiv { width: 100%; float: none; display: block; }

}
@media only screen and (max-width: 959px) {

.fom input, .fom select, .fom textarea, .fom .textbox { width: 218px; }
.fom textarea, .fwrp *.double, .fwrp *.triple { width: 756px; }
.fom select, *.auto, input.btn, a.btn, span.btn, button, input[type="button"], .ui-button { width: auto; }
.coltwo, .coltre, .coltre.mid, .coltre.dbl, .colfor, .colfor.dbl, .colfiv { width: 100%; float: none; display: block; }
.coltwo.floatr, .coltre.floatr, .colfor.floatr, .colfiv.floatr { float: none; margin-top: 20px; }

}
@media only screen and (max-width: 840px) {

.bod.sys { font-size: 14px; }
.bod.sys #utility .wrp h1 { font-size: 18px; padding-top: 20px;}

}
@media only screen and (max-width: 767px) {

.bod.sys .emspace.hedspace { height: 70px; }
/*
.bod.sys { width: 768px; }
.bod.sys .wrp.viw { width: 98%; }
.bod.sys .wrp.mwrp { width: 94%; padding: 10px; }
*/
table { overflow-x: visible; }

.bod.sys #hed.sys { position:absolute; }
.bod.sys #mnav { position: relative; }

}








