@import url('variables.css');
@import url('fonts.css');

body {
	background: var(--app-background) !important;
	font-family: 'Roboto';
	font-weight: normal;
	font-style: normal;
	font-size: 1rem;
}

.main-login-container {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.main-login-container-bg {
	top: 75%;
	background: -webkit-linear-gradient(180deg, #FFFFFF, #008BEF);
    background: -o-linear-gradient(180deg, #FFFFFF, #008BEF);
    background: -moz-linear-gradient(180deg, #FFFFFF, #008BEF);
    background: linear-gradient(180deg, #FFFFFF, #008BEF);
}

.login-container-base {
	width: 340pt;
}

.login-container-title-container {
	padding-top: 8pt;
	padding-bottom: 8pt;
}

.login-container-content-container {
	padding-top: 8pt;
	padding-bottom: 8pt;
}

.login-container-footer-container {
	padding-top: 8pt;
	padding-bottom: 8pt;
}

.asseco-solutions-logo {
	display: inline-block;
	align-self: center center;
	width: 162px;
	height: 50px;
	background: url(../images/asseco_solutions_white.svg) no-repeat center
		center;
	background-size: 120px 28px !important;
}

.nav-link:hover {
  background-color: var(--bs-blue);
  color: #fff;
}

.header {
	height: 50px;
}

.header-logo {
	display: inline-block;
	background-color: #0066cc;
	width: 200px;
}

.header-title {
	display: inline-block;
	background: url(../images/top-panel-bg.png) no-repeat center center;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	opacity: 0.6;
	left: 200px;
	height: 100%;
}

.main-content {
	margin-left: 200px;
	margin-top: 50px;
	background-color: transparent;
	overflow-y: auto;
}

.main-menu {
    margin-left: 0px;
    margin-top: 50px;
    width: 200px;
    background-color: transparent;
    overflow-y: auto;
}

.code-box {
	width: 50px;
	height: 60px;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	margin: 0 10px;
	border: 2px solid #ced4da !important;
	border-radius: 8px;
}

.code-box:focus {
	border-color: #007bff;
	outline: none;
	box-shadow: none;
}

@media (max-width: 480px) {
	.code-box {
		width: 42px;
		height: 54px;
		font-size: 20px;
		margin: 0 4px;
	}
}

.d-flex {
	justify-content: center;
}