@import url('https://api.opanel.net/source/fonts/font.css');
:root {
	--pass-reset: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" image-rendering="optimizeQuality" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" viewBox="0 0 512 512"><path d="M299 16c21-2 30 8 26 30-8 13-19 16-32 9-9-7-12-17-8-27 3-6 7-10 14-12Zm6 13c7 1 9 6 6 13-7 4-11 3-13-5 0-5 2-7 7-8ZM113 30c18 2 36 6 54 13 6 2 8 6 6 13-2 2-5 3-8 2-16-7-33-12-49-14-2 0-3 1-2 3 2 8 3 16 3 25-6 4-10 3-13-3-3-10-4-19-4-28 3-6 7-10 13-11ZM271 66c14 0 22 7 25 22-3 17-13 24-30 20-14-8-18-18-11-32 4-6 9-9 16-10Zm1 14c5 0 8 2 10 8-2 6-6 8-12 6-6-6-5-10 2-14ZM158 71c23-2 44 2 65 14 23 14 43 32 60 54 5 7 5 14 0 22-75 90-151 90-226 1l-31 31c-9 3-16 1-20-7v-72c4-9 11-11 20-8l31 32 24-26c21-21 47-35 77-41Zm2 14c18-2 36 2 53 11-18 36-18 71 0 107a86 86 0 0 1-84 1c-25-14-46-32-62-54 20-29 46-49 79-62l14-3Zm65 19c18 12 34 27 48 46-14 18-29 33-48 46-15-31-15-62 0-92ZM19 119c10 9 19 20 28 31l-28 31v-62Zm216 24c3 0 4 3 3 6-4 1-5 0-5-3l2-3Z" opacity=".9"/><path d="M233 129c16 1 22 9 18 26-6 8-14 11-23 7-9-6-12-14-8-24 3-5 7-8 13-9Zm2 14-2 3c0 3 1 4 5 3 1-3 0-6-3-6ZM274 200c26 2 52 8 77 20l7 7c3 6 1 10-5 12-11-8-23-13-35-17-14-4-28-7-41-8-2 1-2 2-2 4 2 11 4 22 8 33-2 6-5 8-11 6-2-1-4-3-4-5-3-12-6-23-7-34 0-9 4-15 13-18ZM450 206c19 0 27 10 24 30-4 8-11 13-20 14-20-5-26-16-19-34 4-6 9-9 15-10Zm2 14c7 0 10 4 8 12-7 5-11 4-14-4 0-4 2-7 6-8ZM110 225c3-1 5 1 7 4l-3 24c0 1 0 2 2 3 17-4 34-9 50-15 6 1 8 4 6 11-8 5-18 9-27 11l-30 7c-9-2-15-7-15-16l5-26c1-2 3-3 5-3ZM346 250c27 0 52 8 75 23 25 17 48 38 67 63 5 8 4 17-1 26-95 112-188 111-281-2l-38 39c-11 5-19 3-25-7v-88c6-11 14-13 25-8l37 41c25-33 55-58 92-76 15-7 32-11 49-11Zm-3 14c21 0 41 5 60 16-22 45-22 90 0 136-35 19-70 21-105 3-33-18-60-41-82-71 17-24 38-44 63-61 19-13 40-21 64-23Zm72 23c22 15 43 33 60 55 3 4 3 8 0 12-17 21-37 39-60 55-19-41-19-82 0-122Zm-258 21a1653 1653 0 0 0 39 40l-38 41c-1-27-2-54-1-81Zm271 30c5-1 8 2 7 8-4 5-7 5-11 0-1-4 0-7 4-8ZM480 261c12-2 20 3 25 15 2 22-9 31-30 26-12-7-15-18-10-30 4-6 8-10 15-11Zm2 14c9 0 12 4 8 13-9 3-13 1-13-8 1-3 3-4 5-5Z" opacity=".9"/><path d="M425 324c17-1 25 7 24 25-4 11-12 16-24 14-12-4-17-12-15-24 2-8 7-13 15-15Zm3 14c-4 1-5 4-4 8 4 5 7 5 11 0 1-6-2-9-7-8ZM272 438c8-1 11 3 9 12l-6 28c2 3 5 4 9 3 16-3 32-7 48-13l17-10c7-1 11 2 9 10l-8 7c-25 12-51 19-77 20-8-3-12-9-12-16a466 466 0 0 1 11-41Z" opacity=".9"/></svg>');
	--login-user:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512"><path d="M139 147c0-15-11 3-11-39-1-14 13-13 14-16 8-54 34-92 117-92 88 0 112 29 118 88 1 2 9 6 11 19 7 35-8 27-8 40 0 103-85 146-121 146-35 0-120-43-120-146Zm18 0c-1 37 13 73 40 99 24 22 50 29 62 29 23-2 45-13 61-29 20-17 42-48 42-99v-28c-116 25-140-31-140-31-39-2-56 18-65 34v25Zm147-3c10-1 14 18 1 20-13 1-18-19-1-20Zm-94 0c16-1 15 20 2 20-13-1-13-20-2-20Zm49 82c19 1 28-10 45-6 19 6-33 21-44 21-13 1-65-14-48-20 12-5 25 4 47 5Zm-1-77s26 49 2 49c-26 1-2-49-2-49Zm224 286c-6-38-20-87-45-105-16-12-77-44-103-58h-10c-14 11-28 18-43 23-3 0-6 1-6 4l-17 42-16-42c-2-3-3-4-6-4-16-5-30-12-45-23h-9c-25 14-86 46-104 58-28 20-42 91-43 105v4c1 3 28 73 223 73s222-70 224-73v-4Zm-90-23-38 12-39-12v-21h77v21Z"/></svg>');
}
.op-ico {
    display: inline-flex;
    align-items: center;
    align-content: center;
    gap: 10px;
    padding: 10px;
    border-radius: 10px;
}
.op-ico:hover {
    background-color: #f5f6fa;
}
.op-ico::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.pass-reset::before {
    background-image: var(--pass-reset);
}
.login-user::before {
    background-image: var(--login-user);
}
*,*::before, *::after {
    box-sizing: border-box;
	font-family: "Montserrat", sans-serif!important;
}
a {
    text-decoration: none;
    color: #2f3640;
}
body {
	background-color: #ecf0f1;
	display: flex;
	height: 100vh;
	margin: 0;
	justify-content: center;
	align-items: center;
}
form{
	height: min-content;
	max-width: min(90%, 560px);
}
form .login {
	background-color: #fff;
	border-radius: 10px;
	padding: 25px;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
img[alt="Logo"] {
	max-width: min(100%,150px);
	max-height:40px; 
	display: block;
	margin: 0 auto;
}
form .login h1 {
	margin: 0;
	text-align: center;
	border-bottom: 1px solid gainsboro;
	line-height: 80px;
	font-size: min(12vw,30px);
}
form .login .form-control {
	width: 100%;
	background-color: #dcdde1;
	color: #000;
	border-radius: 20px;
	line-height: 40px;
	border: 0;
	text-indent: 10px;
	font-size: 16px;
	caret-color: #FF6C2C;
	margin-top: 25px;
}
form .login .form-control:focus {
	border: 0;
	outline: 2px solid #FF6C2C;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
form .login button {
	background-color: #FF6C2C;
	border: 0;
	width: 100%;
	border-radius: 20px;
	outline: none;
	border: 0;
	font-size: 18px;
	font-weight: 500;
	color: #FFF;
	margin-top: 25px;
	margin-bottom: 25px;
	line-height: 40px;
	cursor: pointer;
}
form .login button:hover {
	background-color: #000;
}
form .login button:focus,
form .login button:hover {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
span.copyright {
	margin: 5px auto;
	display: block;
	text-align: center;
	font-size: 14px;
}