/* noto-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-v39-latin-regular.woff2') format('woff2');
}

/* noto-sans-600 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/noto-sans-v39-latin-600.woff2') format('woff2'); 
}

/* noto-sans-800 - latin */
@font-face {
  font-display: swap;
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/noto-sans-v39-latin-800.woff2') format('woff2');
}

html {
	height:100%;
	padding:0px;
	margin:0px;
	top:0px;
	display:flex;
	align-items:center;
}

body {
	width:100%;
	font-family: 'Noto Sans';
	background: radial-gradient(290% 90% at 25% 90%, rgba(70, 160, 240, 0.4) 55%, rgba(102, 198, 253, 0.3) 100%),radial-gradient(230% 173% at 17% 7%, #286BA1 0%, #112072 42%);
	background-attachment: fixed;
}
body:before {
	content: " ";
	display:block;
	position: fixed;
	width: 100vw;
	height: 100vh;
	background:url(../images/background.jpg);
	background-size:cover;
	background-position:center center;
	top:0px;
	left:0px;
	opacity:0.6;
	filter:blur(4px);
}

body.login:before {
	background-image:url(../images/login.jpg);
	filter:blur(1px);
	opacity: 0.2;
}

body:after {
	content: " ";
	display:block;
	position: fixed;
	width: 100vw;
	height: 100vh;
	background: #004983;
	background: linear-gradient(295deg, rgba(244, 155, 0, 0.3) 0%, rgba(244, 155, 0, 0.5) 25%, rgba(0, 73, 131, 0.7) 50%, #004983 100%);
	top:0px;
	left:0px;
	opacity:0.7;
}

.main {
	position:relative;
	z-index:9;
	/* padding-bottom:100px; */
}

.infotext {
	font-size:0.8em;
}

footer, footer a {
	color:#fff;
	font-size:0.8em;
}

.error-text {
	max-width:800px;
}

.error-text a {
	color:#fff;
	text-decoration:underline;
}

.login-card {
	max-width: 1070px;
	background: url(../images/login_inner.jpg);
	background-size: cover;
	overflow:hidden;
	padding: 50px;
	border: 0px !important;
}

.login-card .card-body {
    position: relative;
}

.login-card:before {
	background: linear-gradient(295deg, rgba(244, 155, 0, 0.3) 0%, rgba(244, 155, 0, 0.5) 25%, rgba(0, 73, 131, 0.7) 50%, #004983 100%);
	display:block;
	content:" ";
	width: 102%;
	height: 102%;
	position:absolute;
	left: -1px;
	top: -1px;
}

.login-form {
    padding: 30px;
    border-radius: 21px;
    position: relative;
    background: #ffffffb5;
    backdrop-filter: blur(3px);
}

.login-form form {
    position: relative;
    z-index: 999;
}

.login-form:after {
    content: " ";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    filter: blur(7px);
    top: 0;
    left: 0;
}

label.form-label {
    display: none;
}

.text-small {
    font-size: 0.75em;
    margin-right: 11px;
}

.or {
    margin-top: 10px;
    margin-bottom: 10px;
}

.or span:before, .or span:after {
    width: 50px;
    height: 1px;
    background: #000;
    display: inline-block;
    content: " ";
    margin: 4px 10px;
}

.login-text {
	align-content:center;
}

.login footer {
	position:relative;
	z-index:2;
	padding-bottom:0px;
}

.login footer a {
	color:#fff !important;
}

@media(max-width:576px) {
    
.card-body.p-5 {
    padding: 0px !important;
}

.card.login-card {
    padding: 30px !important;
    border-radius: 0px !important;
    max-width: initial;
    width: 100%;
    height: 100%;
}

.login .main {
    width: 100% !important;
    padding: 0px !important;
    margin: 0px !important;
    top: 0;
    position: static;
    height: 100% !important;
}

	body.login:before, body.login:after {
    display: none;
}

	html {
    display: block;
    height: 100% !important;
}
body.login {
    height: 100% !important;
}

	.logo {
    max-width: 90px;
}

	.error-text {
    font-size: 0.8em;
}

.error-text h1 {
    font-size: 1.7em;
}
}
