div.login {
	max-width: 96rem;
	margin: 0 auto;
	padding: 1rem;
}

div.login p.logo {
	margin: 3rem 0 1rem;
	text-align: center;
	color: #4b3002;
}

div.login p.logo img {
	display: block;
	width: 80%;
	max-width: 24rem;
	margin: 1rem auto;
}

div.login label {
	font-size: 3rem;
}



label.kbn-lbl {
	width: 100%;
	margin: 0.25rem 0;
	border-radius: 3rem;
	padding: 0.25rem 2rem;
	color: #FFF;
}

label.bg-l-p {
	background-color: #F29344;
	box-shadow: 0 0 0 1px #fff, 0 0 0 4px #F29344;
}

label.bg-l-m {
	background-color: #255BA7;
	box-shadow: 0 0 0 1px #fff, 0 0 0 4px #255BA7;
}

label.bg-l-b {
	background-color: #AFC60A;
	box-shadow: 0 0 0 1px #fff, 0 0 0 4px #AFC60A;
}

label.bg-l-g {
	background-color: #29a725;
	box-shadow: 0 0 0 1px #fff, 0 0 0 4px #29a725;
}



div.login div.message {
	width: 100%;
	padding: 0.5rem 0.7rem;
	margin: 0 auto;
	color: #4b3002;
	background: #bcddff;
	text-align: center;
}

div.login form.login {
	text-align: center;
	font-size: 2.4rem;
	color: #4b3002;
}

div.login form.login dl {
	margin: 1rem 0 2rem;
}

div.login form.login dl dt {
	font-size: 2.4rem;
}

div.login form.login dl dd {
	margin: 0 0 1.5rem;
	font-size: 2.4rem;
}

div.login form.login dl dd input[type=text],
div.login form.login dl dd input[type=password] {
	width: 80%;
	line-height: 4rem;
	border: 2px #4b3002 solid;
	border-radius: 0.5rem;
	text-align: center;
	font-size: 3rem;
}

div.login form.login dl dd input[type=text]:focus,
div.login form.login dl dd input[type=password]:focus {
	border: 2px #FFA100 solid;
	box-shadow: inset 1px 2px 4px 0px rgb(0 0 0 / 15%), inset 0px 0px 3px 0px #FFA100;
}

div.login form.login dl dd label {
	display: flex;
	width: 80%;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
}

div.login button {
	display: inline-block;
	min-width: 20rem;
	min-height: 4.2rem;
	margin: 0.3rem 0;
	padding: 1rem 5rem;
	border-color: 2px #4B3002 solid;
	border-radius: 0.5rem;
	background-color: #4B3002;
	color: #F0F0F0;
	font-size: 3rem;
	text-decoration: none;
	box-shadow: 1px 2px 4px 1px #AAAAAA;
	cursor: pointer;
}

div.login button:hover {
	background-color: #4B3002CC;
	color: #F0F0F0;
}

div.login button:focus {
	border-color: #FFA100;
	color: #F0F0F0;
	box-shadow: 1px 2px 4px 1px #AAAAAA, 1px 2px 4px 1px #FFA100;
}

div.login button:active {
	background-color: #FFA100AA;
	box-shadow: 1px 2px 4px 1px #CCCCCC;
	color: #4B3002;
}



div.loginMobile {
	max-width: 96rem;
	margin: 0 auto;
	padding: 1rem 1rem 0;
}

div.loginMobile p.logo {
	margin: 3rem 0 1rem;
	text-align: center;
	color: #4b3002;
}

div.loginMobile p.logo img {
	display: block;
	width: 80%;
	max-width: 24rem;
	margin: 1rem auto;
}

div.loginMobile label {
	font-size: 3rem;
}

div.loginMobile div.message {
	width: 100%;
	padding: 0.5rem 0.7rem;
	margin: 0 auto;
	color: #4b3002;
	background: #bcddff;
	text-align: center;
}

div.loginMobile form.login {
	text-align: center;
	font-size: 2.4rem;
	color: #4b3002;
}

div.loginMobile form.login dl {
	margin: 1rem 0 2rem;
}

div.loginMobile form.login dl dt {
	font-size: 2.4rem;
}

div.loginMobile form.login dl dd {
	margin: 0 0 1.5rem;
}

div.loginMobile form.login dl dd input[type=text],
div.loginMobile form.login dl dd input[type=password] {
	width: 80%;
	line-height: 4rem;
	border: 2px #4b3002 solid;
	border-radius: 0.5rem;
	text-align: center;
	font-size: 3rem;
}

div.loginMobile form.login dl dd label {
	display: flex;
	width: 80%;
	margin: 0 auto;
	justify-content: center;
	align-items: center;
}

div.loginMobile button {
	display: inline-block;
	min-width: 20rem;
	min-height: 4.2rem;
	margin: 0.3rem 0;
	padding: 1rem 5rem;
	border-color: 2px #4B3002 solid;
	border-radius: 0.5rem;
	background-color: #4B3002;
	color: #F0F0F0;
	font-size: 3rem;
	text-decoration: none;
	box-shadow: 1px 2px 4px 1px #AAAAAA;
	cursor: pointer;
}

div.loginMobile button:hover {
	background-color: #4B3002CC;
	color: #F0F0F0;
}

div.loginMobile button:focus {
	border-color: #FFA100;
	color: #F0F0F0;
	box-shadow: 1px 2px 4px 1px #AAAAAA, 1px 2px 4px 1px #FFA100;
}

div.loginMobile button:active {
	background-color: #FFA100AA;
	box-shadow: 1px 2px 4px 1px #CCCCCC;
	color: #4B3002;
}



.menu-footer{
	position: sticky;
	margin-top: 6rem;
	top: 100vh;
	min-height: 4rem;
}

.menu-footer img {
	position: absolute;
	width: 3rem;
}

.menu-footer img#mf-1 {
	height: 10rem;
	top: -6rem;
	left: 3rem;
}

.menu-footer img#mf-2 {
	height: 6rem;
	top: -3rem;
	left: 7rem;
}

.menu-footer img#mf-3 {
	height: 6rem;
	top: -3rem;
	left: 11rem;
}



.bg-f-p {
	background-color: #f9c9a1;
}

.bg-f-m {
	background-color: #92add3;
}

.bg-f-b {
	background-color: #CFE090;
}
