body {
	font-family: sans-serif;
	background-color: #2f4f4f;
}

.logo {
	height: 50px;
	margin: 30px auto;
	margin-top: 0px;
	text-align: center;
	margin-bottom: 45px;
}

.logo>h1 {
	color: #121916;
}

.login-block {
	width: 428px;
	padding: 20px;
	background: #ffffff85;
	border-radius: 5px;
	border-top: 5px solid #ff656c;
	margin: 0 auto;
	margin-top: 116px;
}

.login-block h1 {
	text-align: center;
	color: #000;
	font-size: 18px;
	text-transform: uppercase;
	margin-top: 0;
	margin-bottom: 20px;
	font-weight: 300;
}

.login-block input {
	width: 100%;
	height: 42px;
	box-sizing: border-box;
	border-radius: 5px;
	border: 1px solid #ccc;
	margin-bottom: 20px;
	font-size: 14px;
	font-family: Montserrat;
	padding: 0 20px 0 50px;
	outline: none;
	color: #4c4c4c;
}

.login-block input#username {
	background: #fff url('/login/login2/user.png') 20px top no-repeat;
	background-size: 16px 80px;
}

.login-block input#username:focus {
	background: #fff url('/login/login2/user.png') 20px bottom no-repeat;
	background-size: 16px 80px;
}

.login-block input#password {
	background: #fff url('/login/login2/pwd.png') 20px top no-repeat;
	background-size: 16px 80px;
}

.login-block input#password:focus {
	background: #fff url('/login/login2/pwd.png') 20px bottom no-repeat;
	background-size: 16px 80px;
}

.login-block input:active, .login-block input:focus {
	border: 1px solid #ff656c;
}

.footer {
	margin-top: 22px;
	color: rgb(68, 88, 88);
}

.footer>div>h5 {
	text-align: center;
}

.footer>div>h5>a {
	color: rgb(38, 49, 49);
}

.txt-left {
	text-align: left;
}

.login-block button {
	height: 40px;
	background: #ff656c;
	box-sizing: border-box;
	border-radius: 4px;
	border: 1px solid #e15960;
	color: #fff;
	font-weight: bold;
	font-size: 14px;
	font-family: sans-serif;
	outline: none;
	cursor: pointer;
}

.login-block button:hover {
	background: #ff7b81;
}

.sel {
	width: 100%;
	height: 40px;
	border-radius: 6px;
	background: none;
	color: #4c4c4c;
	padding: 7px 20px;
	font-size: 14px;
}

.elm:hover {
	border-color: red;
}

.lbl {
	font-size: 15px;
	color: #8e8d8d;
	line-height: 40px;
}

.one {
	width: 40%;
	text-align: right;
	padding-right: 10px;
	display: table-cell
}

.two {
	width: 60%;
	text-align: right;
	padding-right: 10px;
	display: table-cell
}

.top {
	display: inline-flex;
	width: 100%;
	margin-bottom: 20px;
}

.res {
	width: 100%;
	font-size: 15px;
	padding: 40px;
	color: #777070;
}

.no-dis {
	display: none;
}

.forgotten {
	width: 100%;
	text-align: right;
	padding-top: 5px;
	text-decoration: underline;
	font-size: 12px;
	color: #29467b;
}
/* CENTER ALIGNMENT */
.center-box {
	display: flex;
	justify-content: center;
}

/* PRIMARY BUTTON */
.btn-primary {
	width: 110px;
	border-radius: 8px;
	border: none;
	background: linear-gradient(135deg, #4CAF50, #2E7D32);
	color: white;
	font-weight: bold;
	cursor: pointer;
	transition: 0.3s;
}

.btn-primary:hover {
	background: linear-gradient(135deg, #43A047, #1B5E20);
}

/* SECONDARY BUTTON (Resend) */
.btn-secondary {
	width: 220px;
	padding: 10px;
	border-radius: 8px;
	border: 1px solid #4CAF50;
	background: white;
	color: #4CAF50;
	cursor: pointer;
}

.btn-secondary:hover {
	background: #f1f1f1;
}

/* DISABLED */
button:disabled {
	background: #ccc !important;
	cursor: not-allowed;
}

/* OTP INPUT */
.otp-input {
	text-align: center;
	font-size: 18px;
	letter-spacing: 4px;
	font-weight: bold;
	margin-top: 5px;
}

/* ERROR */
.error {
	text-align: center;
	color: #d32f2f;
	padding: 8px;
	border-radius: 6px;
	font-size: 16px;
}

/* SUCCESS */
.success {
	text-align: center;
	color: #7d2e2e;
	border-radius: 6px;
	font-size: 16px;
	margin-bottom:10px;
}


.msg-box {
	text-align: center;
	border-radius: 6px;
	font-size: 13px;
}
/* ERROR */
.msg-box.error {
	text-align: center;
	font-size: 16px;
	color: #d32f2f;
}
/* SUCCESS */
.msg-box.success {
	text-align: center;
	font-size: 16px;
	color: #2e7d32;
}

.captcha-section {
	margin-top: 10px;
	text-align: center;
}


.captcha-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 10px;
}
.captcha-input {
    width: 150px;
}
.otp-input {
    width: 180px;
}

.captcha-img {
    height: 42px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-top: -18px;
}

.refresh-icon {
    font-size: 18px;
    color: #007bff;
    cursor: pointer;
    margin-top: -15px;
}
.refresh-icon:hover {
    color: #0056b3;
}

.row-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 12px;
}