.login-form {
	max-width: 720px;
	margin: 30px auto;
	padding: 50px 130px;
	box-sizing: border-box;
	background-color: rgba(255,255,255,.85);
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0,0,0,.1);
	position: relative
}

.login-avatar {
	text-align: center;
	margin-bottom: 20px
}

.login-avatar img {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0 2px 8px rgba(0,0,0,.1)
}

.login-form h2 {
	text-align: center;
	margin-bottom: 20px;
	color: #333
}

.error-message {
	text-align: center;
	margin-bottom: 20px;
	color: red;
	font-size: 16px;
	font-weight: 700
}

.form-group {
	display: flex;
	align-items: center;
	margin-bottom: 15px
}

.form-group label {
	display: none
}

.login-form input {
	flex: 1;
	padding: 8px 8px 8px 48px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 16px;
	background-repeat: no-repeat;
	background-position: 12px center;
	background-size: 24px 24px
}

#username {
	background-image: url(/images/user5.png)
}

#password {
	background-image: url(/images/word5.png)
}

.captcha-group {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 15px
}

.captcha-group input {
	flex: 1
}

.captcha-container {
	margin-right: 10px
}

.captcha-image {
	border: 1px solid #ccc;
	height: 40px;
	width: auto
}

.forgot-password {
	text-align: right;
	margin-bottom: 15px
}

.forgot-password a {
	text-decoration: none;
	color: #007bff;
	font-size: 16px
}

.forgot-password a:hover {
	text-decoration: underline
}

.form-buttons {
	text-align: center
}

.login-image-btn {
	padding: 0;
	border: none;
	background: 0 0;
	cursor: pointer
}

.login-image-btn img {
	display: inline-block;
	max-width: 110px;
	width: 100%;
	height: auto
}

.login-image-btn:hover img {
	opacity: .9
}

.login-image-btn:active img {
	opacity: .7
}

@media (max-width:720px) {
	.login-form {
		padding: 30px
	}

	.form-group {
		flex-direction: column;
		align-items: flex-start
	}

	.login-form input {
		width: 100%
	}

	.captcha-container {
		margin-bottom: 10px
	}

	.forgot-password {
		text-align: center
	}

	.forgot-password a {
		font-size: 14px
	}

	.login-avatar img {
		width: 60px;
		height: 60px
	}

	.login-image-btn img {
		max-width: 100px
	}

	.captcha-group {
		flex-direction: row!important;
		align-items: center!important
	}
}

@media (max-width:300px) {
	.captcha-group {
		flex-direction: column!important;
		align-items: stretch!important
	}

	.captcha-group .captcha-container {
		margin-bottom: 10px
	}
}
