@charset "utf-8";
/* CSS Document */

html, body {padding: 0; margin: 0;}

/* Color */
.green-dark { background: #5b811d; }
.green-medium { background: #7aa732; }
.green-light { background: #86b043; }

.grey-dark { background: #7e7e7f; }
.grey-medium { background: #efefef; }
.grey-light { background: #f5f5f5; }

.black-dark { background: #111111; }
.black-medium { background: #282828; }
.black-light { background: #585858; }


/* Header */
header {
	background: #282828;
}

#logo img {
	min-width: 200px;
	padding: 4% 0% 3% 0%;
}

#top-menu {
	color: #ffffff;
	font-size: 90%;
	margin-top: 0.5%;
	margin-bottom: 0.6%;
}

#mobile-menu ul li .active {
	color: #ffffff;
	background: var(--bk-green);
}

#top-menu li a{
	color: #ffffff;
}

#top-menu li a:hover{
	text-decoration: underline;
}

#main-menu {
	font-size: 80%;
	font-weight: 600;
}

#main-menu ul li a{
	color: #f0f0f0;
	text-transform: uppercase;
}

#main-menu ul li a:hover {
	color: #ffffff;
}

#main-menu ul li .active {
	color: #ffffff;
	background: var(--bk-green);
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

#sub-menu {
	background: var(--bk-green);
	padding-top: 0.5%;
	padding-bottom: 0.5%;
	font-size: 90%;
}

#sub-menu ul li a{
	color: #f0f0f0;
}

#sub-menu ul li a:hover {
	color: #ffffff;
}

#sub-menu ul li .active {
	color: #ffffff;
	text-decoration: underline;
}


/* Sidebar */
#side-menu {
	color: #7e7e7f;
	padding: 0; margin: 0;
	background: #f5f5f5;
}

#side-menu .menu-text {
	text-transform: uppercase;
	font-size: 100%;
	margin-top: 2%;
	color: #7e7e7f;
}

#side-menu ul li a {
	font-size: 90%;
	color: #7e7e7f;
	border-bottom: #dfdfdf 1px solid;
}

#side-menu ul li a:hover {
	color: #585858;
}

#side-menu .active, .side-menu .active:hover {
	color: #5b811d;
	background: #ffffff;
	border-bottom: #dfdfdf 1px solid;
}


/* Main Body */
section {
	margin: 0;
	padding: 2%;
	padding-top: 1%;
}


/* Footer */
footer {
	font-size: 90%;
	font-style: oblique;
	background: #f5f5f5;
}

footer p {
	margin: 0;
	padding: 1% 0%;
}

/* Login */

.login {
	position: absolute;
	left: 50%;
	top: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: 50%;
	color: #b8b8b8;
}

.login a,
.login a:hover {
	color: #b8b8b8;
}

.login input,
.login .input-group-label,
.login input:focus,
.login .input-group-label:focus {
	background-color: #282828;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: #b8b8b8 1px solid;
	box-shadow: none;
	color: #b8b8b8;
}

.login .is-invalid-input:not(:focus) {
	background-color: #282828;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: #b8b8b8 1px solid;
}

.login .is-invalid-input:not(:focus)::-webkit-input-placeholder { color: #ffb5a6; }
.login .is-invalid-input:not(:focus)::-moz-placeholder { color: #ffb5a6; }
.login .is-invalid-input:not(:focus):-ms-input-placeholder { color: #ffb5a6; }
.login .is-invalid-input:not(:focus)::placeholder { color: #ffb5a6; }
.login .is-invalid-label { color: #ffb5a6; }

.system-msg {
	margin : 0em;
	padding: 0em 1em;
	text-align: center;
}

/* Small only */
@media screen and (max-width: 39.9375em) {
	#logo img {
	min-width: 30%;
	}
}

/* Medium and up */
@media screen and (min-width: 40em) {

}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {

}

/* Large and up */
@media screen and (min-width: 64em) {

}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {

}