@charset "UTF-8";




/* ============== Elements - Start ============== */

.page-title {
	color: #979797;
	border-bottom: 1px solid #ebebeb;
	display: block;
	position: relative;
	float: right;
	width: 100%;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
.page-title i {
	font-size: 24px;
	float: left;
	color: #cfcfcf;
	margin-top: -5px;
}
.page-title h1 {
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 0;
	float: right;
	line-height: 25px;
	margin-top: -5px;
}


.content {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.status-options {
	position: relative;
	display: block;
	width: 480px;
	max-width: 100%;
	font-size: 13px;
}
.status-options .form-check-input:checked+label {
	color: #00757a;
}
.status-options h6 {
    color: #737373;
    font-size: 11px;
    margin-top: 2px;
    font-weight: 300;
}
.status-options h6 a {}
.status-options h6 a:hover {}
.status-options h6 a i {
    vertical-align: middle;
    font-size: 15px;
}


.status-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 100%;
}
.status-btn .status-flag {
	width: 480px;
	border-radius: 6px;
	padding: 8px 12px;
	height: 80px;
	position: relative;
	max-width: 100%;
}
.status-btn .status-flag > span {
	font-size: 10px;
	line-height: 9px;
	display: block;
	margin-bottom: 0px;
	margin-top: 11px;
}
.status-btn .status-flag p {
	margin: 4px 0 0 0;
	font-weight: bold;
	display: block;
	font-size: 16px;
}
.status-btn .status-flag p span {
	vertical-align: -6.5px;
}
.status-btn .status-flag i {
	font-size: 40px;
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
}
.status-btn .status-flag.deactive { background: #ffe9e7; }
.status-btn .status-flag.deactive i { color: #e2bbb8; }
.status-btn .status-flag.deactive span {color: #e2bbb8;margin-right: 0;}
.status-btn .status-flag.deactive p { color: #5c0600; }

.status-btn .status-flag.active { background: #deefde; }
.status-btn .status-flag.active i { color: #abdfab; }
.status-btn .status-flag.active span { color: #9ecaa0; }
.status-btn .status-flag.active p { color: #006446; }

.status-btn .status-flag.pending { background: #ffebc4; }
.status-btn .status-flag.pending i { color: #ffd994; }
.status-btn .status-flag.pending span { color: #ebc98d; }
.status-btn .status-flag.pending p { color: #a56f0c; }

.status-btn a {
	width: 480px;
	max-width: 100%;
	margin-top: 6px;
	font-size: 15px;
	padding: 8px 8px;
	border-radius: 6px;
}
.status-btn a:hover {}
.status-btn a i {
	font-size: 22px;
	vertical-align: middle;
}



.request-box {
	position: relative;
	display: block;
	width: 480px;
	max-width: 100%;
}
.request-box h5 {
	font-size: 13px;
	border-top: 1px solid #eaeaea;
	padding-top: 12px;
	margin-top: 12px;
	margin-bottom: 9px;
}
.request-box h5 i {
	vertical-align: -3px;
	font-size: 19px;
}
.request-box .request-list {}
.request-box .request-list .rquest-none {
	background: #f1f1f1;
	border-radius: 6px;
	padding: 12px 10px;
	text-align: center;
}
.request-box .request-list .rquest-none i {
	font-size: 36px;
	color: #cbcbcb;
}
.request-box .request-list .rquest-none p {
	margin: 0;
	color: #949494;
	font-size: 13px;
}
.request-box .request-list .rquest-none.inner {
	background: none;
	margin-top: calc(50% - 30px);
}
.request-box .request-list .rquest-none.inner i {
	font-size: 46px;
	color: #e4e4e4;
	margin-bottom: 8px;
}
.request-box .request-list .rquest-none.inner p {
	margin: 0;
	color: #a6a6a6;
	font-size: 13px;
}

.rquest-item {
	display: flex;
	border: 1px solid #eaeaea;
	border-radius: 6px;
	padding: 8px 10px 7px 38px;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	flex-direction: row;
	justify-content: space-between;
	position: relative;
	margin-bottom: 10px;
}
.rquest-item:hover {
	border-color: #f69e00;
}
.rquest-item div i {
    font-size: 16px !important;
    vertical-align: middle;
    font-weight: 600;
}
.rquest-item .request-type {
    font-size: 12px;
    font-weight: 300;
    color: #f69e00;
    margin-bottom: 3px;
}
.rquest-item .request-skill {
	font-weight: 600;
	font-size: 15px;
	margin-bottom: 3px;
	color: #023873;
}
.rquest-item .request-skill a {
	color: #023873;
}
.rquest-item .request-location {
    color: #959595;
    font-size: 12px;
}
.rquest-item .request-date {
    color: #959595;
    font-size: 12px;
    margin-bottom: 3px;
}
.rquest-item .request-timing {
    color: #af11aa;
    /* color: crimson; */
    font-size: 13px;
    margin-bottom: 3px;
}
.rquest-item .request-price {
    font-weight: 600;
    color: #129d9d;
}
.rquest-item .request-price small {
	font-weight: 400;
	font-size: 7px;
	display: inline-block;
	width: 20px;
	vertical-align: middle;
	line-height: 8px;
	margin-right: 1px;
}
.rquest-item .request-btn {
    display: flex;
    position: absolute;
    left: 4px;
    top: 4px;
    bottom: 4px;
    background: #e7e7e7;
    color: #023873;
    border-radius: 4px;
    padding: 2px 4px 4px;
    font-size: 19px;
    align-items: center;
}
.rquest-item .request-btn:hover {
	background: #023873;
	color: #ffffff;
}




.orders-box {
	position: relative;
	display: block;
	width: 480px;
	max-width: 100%;
}
.orders-box h5 {
	font-size: 13px;
	border-top: 1px solid #eaeaea;
	padding-top: 12px;
	margin-top: 12px;
	margin-bottom: 9px;
}
.orders-box h5 i {
	vertical-align: -3px;
	font-size: 19px;
}
.orders-box .orders-list {}
.orders-box .orders-list .orders-none {
	background: #f1f1f1;
	border-radius: 6px;
	padding: 12px 10px;
	text-align: center;
}
.orders-box .orders-list .orders-none i {
	font-size: 36px;
	color: #cbcbcb;
}
.orders-box .orders-list .orders-none p {
	margin: 0;
	color: #949494;
	font-size: 13px;
}
.orders-box .orders-list .orders-none.inner {
	background: none;
	margin-top: calc(50% - 30px);
}
.orders-box .orders-list .orders-none.inner i {
	font-size: 46px;
	color: #e4e4e4;
	margin-bottom: 8px;
}
.orders-box .orders-list .orders-none.inner p {
	margin: 0;
	color: #a6a6a6;
	font-size: 13px;
}

.orders-item {
	display: flex;
	border: 1px solid #eaeaea;
	border-radius: 6px;
	padding: 8px 10px 7px 38px;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	flex-direction: row;
	justify-content: space-between;
	position: relative;
	margin-bottom: 10px;
}
.orders-item:hover {
	border-color: #f69e00;
}
.orders-item div i {
    font-size: 16px !important;
    vertical-align: middle;
    font-weight: 600;
}
.orders-item .orders-type {
    font-size: 12px;
    font-weight: 300;
    color: #f69e00;
    margin-bottom: 3px;
}
.orders-item .orders-skill {
	font-weight: 500;
	font-size: 13px;
	margin-bottom: 3px;
	color: #023873;
}
.orders-item .orders-customer {
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 3px;
	color: #E91E63;
}
.orders-item .orders-skill a {
	color: #023873;
}
.orders-item .orders-location {
    color: #959595;
    font-size: 12px;
}
.orders-item .orders-status {
    color: #2e009f;
    font-size: 12px;
    margin-bottom: 4px;
}
.orders-item .orders-date {
    color: #959595;
    font-size: 11px;
    margin-bottom: 3px;
}
.orders-item .orders-code {
    color: #6f116c;
    /* color: crimson; */
    font-size: 13px;
    margin-bottom: 3px;
    font-weight: 500;
}
.orders-item .orders-price {
    font-weight: 500;
    color: #129d9d;
}
.orders-item .orders-price small {
	font-weight: 400;
	font-size: 7px;
	display: inline-block;
	width: 20px;
	vertical-align: middle;
	line-height: 8px;
	margin-right: 1px;
}
.orders-item .orders-btn {
    display: flex;
    position: absolute;
    left: 4px;
    top: 4px;
    bottom: 4px;
    background: #e7e7e7;
    color: #023873;
    border-radius: 4px;
    padding: 2px 4px 4px;
    font-size: 19px;
    align-items: center;
}
.orders-item .orders-btn:hover {
	background: #023873;
	color: #ffffff;
}




.state-box {
	position: relative;
	display: block;
	width: 480px;
	max-width: 100%;
	border-top: 1px solid #eaeaea;
	padding-top: 20px;
	margin-top: 20px;
}
.state-box .state-item {
	text-align: center;
	display: block;
	opacity: 0.8;
}
.state-box .state-item:hover {
	opacity: 1.0;
}
.state-box .state-item i {
	display: block;
	font-size: 30px;
	margin-bottom: 6px;
	margin-top: 2px;
}
.state-box .state-item span {
	font-size: 11px;
	margin-bottom: 4px;
	display: block;
}
.state-box .state-item p {
	margin: 0;
	font-weight: 500;
}

.state-box .state-item {
	text-align: center;
	display: block;
	border-radius: 6px;
	padding: 9px 3px;
}

.state-box .state-item.point { background: #f6e8d6; }
.state-box .state-item.point i { color: #f69e00; }
.state-box .state-item.point span { color: #c5b298; }
.state-box .state-item.point p { color: #4a3000; }

.state-box .state-item.wallet { background: #ddeaf9; }
.state-box .state-item.wallet i { color: #023a77; }
.state-box .state-item.wallet span { color: #8aaad0; }
.state-box .state-item.wallet p { color: #001e3e; }

.state-box .state-item.income { background: #e9f2e8; }
.state-box .state-item.income i { color: #198754; }
.state-box .state-item.income span { color: #97b893; }
.state-box .state-item.income p {color: #002e19; }

.state-box .state-item.comment { background: #f0e8f2; }
.state-box .state-item.comment i { color: #721987; }
.state-box .state-item.comment span { color: #af93b8; }
.state-box .state-item.comment p {color: #20002e; }



.wallet-box {
	position: relative;
	display: block;
	width: 480px;
	max-width: 100%;
}
.wallet-box .wallet-item {
	text-align: center;
	display: block;
	opacity: 0.8;
}
.wallet-box .wallet-item:hover {
	opacity: 1.0;
}
.wallet-box .wallet-item i {
	display: block;
	font-size: 30px;
	margin-bottom: 6px;
	margin-top: 2px;
}
.wallet-box .wallet-item span {
	font-size: 11px;
	margin-bottom: 4px;
	display: block;
}
.wallet-box .wallet-item p {
	margin: 0;
	font-weight: 500;
}

.wallet-box .wallet-item {
	text-align: center;
	display: block;
	border-radius: 6px;
	padding: 9px 3px;
}

.wallet-box .wallet-item.wallet { background: #ddeaf9; }
.wallet-box .wallet-item.wallet i { color: #023a77; }
.wallet-box .wallet-item.wallet span { color: #8aaad0; }
.wallet-box .wallet-item.wallet p { color: #001e3e; }

.wallet-box .wallet-list .wallet-none {
	background: #f1f1f1;
	border-radius: 6px;
	padding: 12px 10px;
	text-align: center;
}
.wallet-box .wallet-list .wallet-none i {
	font-size: 36px;
	color: #cbcbcb;
}
.wallet-box .wallet-list .wallet-none p {
	margin: 0;
	color: #949494;
	font-size: 13px;
}
.wallet-box .wallet-list .wallet-none.inner {
	background: none;
	margin-top: calc(50% - 30px);
}
.wallet-box .wallet-list .wallet-none.inner i {
	font-size: 46px;
	color: #e4e4e4;
	margin-bottom: 8px;
}
.wallet-box .wallet-list .wallet-none.inner p {
	margin: 0;
	color: #a6a6a6;
	font-size: 13px;
}



.page-tab {
    margin-bottom: 12px;
    display: block;
}
.page-tab a {
    display: inline-block;
    background: #ededed;
    padding: 5px 12px 4px;
    border-radius: 30px;
    font-size: 13px;
    color: #357302;
}
.page-tab a:hover {
	background: #e3e3e3;
}
.page-tab a.active {
    background: #307302;
    color: #fff;
    cursor: default;
}

/* ============== Elements - End ================ */








/* ============== Inner Page - Start ============== */
.inner-page {
	position: relative;
	height: max-content;
	padding-bottom: 32px;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	z-index: 0;
	background: linear-gradient(25deg, #004008, #00891c);
}
.inner-page:before {
	display: block;
	content: "";
	background-image: url("../images/login-pattern.svg?7");
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top left;
	transform: scaleX(-1);
	background-size: contain;
	position: absolute;
	z-index: 0;
}


.inner-page .inner-header {
	width: 100%;
	height: 100%;
	float: right;
	text-align: center;
	padding: 8px 0;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	z-index: 1;
	position: relative;
}
.inner-page .inner-header .inner-logo {
	text-align: right;
	display: flex;
	align-content: center;
	align-items: center;
}
.inner-page .inner-header .inner-logo .inner-title-box {
	float: right;
	margin-right: 4px;
}
.inner-page .inner-header .inner-logo .inner-icon {
	height: 60px;
	width: 47px;
	float: right;
	margin-bottom: 0;
	background-image: url("../images/logo-icon.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
.inner-page .inner-header .inner-logo .inner-title {
	color: #fff;
	font-size: 17px;
	font-weight: 500;
	margin-bottom: 3px;
	display: block;
	width: auto;
}
.inner-page .inner-header .inner-logo .inner-subtitle {
	color: #c3f1f5;
	font-weight: 300;
	font-size: 11px;
	margin-bottom: 0;
	letter-spacing: -0.3px;
}


.inner-page .inner-box {
	width: 100%;
	/* display: block; */
	display: flex;
	position: relative;
	height: calc(100% - 50px);
	background: #fff;
	border-radius: 15px;
	padding: 15px 15px 38px;
	min-height: calc(100vh - 108px);
	flex-direction: column;
}

.inner-page .inner-box .inner-copyright {
	position: absolute;
	width: 100%;
	bottom: 10px;
	right: 0;
	left: 0;
	text-align: center;
	color: #afafaf;
	font-size: 12px;
}
.inner-page .inner-version {
	display: block;
	position: absolute;
	right: 10px;
	left: 10px;
	bottom: 9px;
	color: #8fbe80;
	line-height: 10px;
	font-size: 10px;
	text-align: center;
}



.header-profile {
	display: block;
}
.header-profile>a {
	line-height: 61px;
	height: 60px;
	display: block;
	float: left;
}
.header-profile>a img {
	border-radius: 50px;
	height: 48px;
	width: 48px;
	border: 1px solid #bdbdbd;
	background: #f7f7f7;
}
.header-profile>a img:hover {
	border-color: #c3c3c3 !important;
}




.header-menu {
	display: block;
	float: right;
	background: #ffffff;
	border-radius: 15px 15px 15px 15px;
	margin-left: -10px;
	margin-top: 7px;
	height: 46px;
}
.header-menu ul {
	list-style: none;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin: 0;
	padding: 0;
}
.header-menu ul li {
	display: flex;
	padding: 6px 10px;
	color: #136901;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	position: relative;
}
.header-menu ul li:first-child {margin-right: 4px;}
.header-menu ul li:last-child {margin-left: 4px;}

.header-menu ul li:hover a {
	z-index: 1;
}
.header-menu ul li a {
	font-size: 10px;
	letter-spacing: -0.3px;
	line-height: 10px;
	color: #216901;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}
.header-menu ul li a:hover {
	color:#f69e00;
}
.header-menu ul li a i {
	display: block;
	font-size: 21px;
	margin-bottom: 3px;
	line-height: 20.99px;
	height: 20.99px;
}
.header-menu ul li a.active1:before {
	background-image: url("../images/icon_cap.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 24px;
	height: 14px;
	position: absolute;
	z-index: 1;
	right: calc(50% - 12px);
	top: 2px;
}
.header-menu ul li a.active i {color:#f69e00;}



.footer-menu {
	display: none;
	background: #ffffff;
	border-radius: 15px 15px 15px 15px;
	right: calc(var(--bs-gutter-x)* .5);
	left: calc(var(--bs-gutter-x)* .5);
	height: 46px;
	position: fixed;
	bottom: 10px;
	--bs-gutter-x: 1.5rem;
	z-index: 5;
	box-shadow: 0px 0px 10px #17620129;
}
.footer-menu-top {display: none;}
.footer-menu-bg {display: none;}
.footer-menu ul {
	list-style: none;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin: 0;
	padding: 0;
}
.footer-menu ul li {
	display: flex;
	padding: 6px 10px;
	color: #096901;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	position: relative;
	text-align: center;
}
.footer-menu ul li:first-child {margin-right: 4px;}
.footer-menu ul li:last-child {margin-left: 4px;}
.footer-menu ul li:hover a {
	z-index: 1;
}
.footer-menu ul li a {
	font-size: 10px;
	letter-spacing: -0.3px;
	line-height: 10px;
	color: #1d6901;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}
.footer-menu ul li a:hover {
	color:#f69e00;
}
.footer-menu ul li a i {
	display: block;
	font-size: 21px;
	margin-bottom: 3px;
	line-height: 20.99px;
	height: 20.99px;
}
.footer-menu ul li a.active1:before {
	background-image: url("../images/icon_cap.png");
	background-repeat: no-repeat;
	background-size: contain;
	width: 24px;
	height: 14px;
	position: absolute;
	z-index: 1;
	right: calc(50% - 12px);
	top: 2px;
}
.footer-menu ul li a.active i {color:#f69e00;}

@media (max-width: 540px) {
	.inner-page {
		padding-bottom: 84px;
	}
	.inner-page .inner-version {
		bottom: 64px;
		font-size: 9.5px;
		z-index: 2;
	}
	
	.header-menu {
		display: none;
	}
	.footer-menu {
		display: block;
	}
	.footer-menu-top {
		position: fixed;
		height: 0px;
		bottom: 68px;
		right: 0;
		left: 0px;
		z-index: 1;
		display: block;
	}
	.footer-menu-top::before,
	.footer-menu-top::after {
		content: "";
		width: 20px;
		height: 20px;
		border-radius: 0 0 15px 0;
		background-color: transparent;
		position: absolute;
		top: -20px;
		box-shadow: 1em 1em 0 1em #004008;
		right: calc(var(--bs-gutter-x)* .5);
		--bs-gutter-x: 1.5rem;
	}
	.footer-menu-top::after {
		border-radius: 0 0 0 15px;
		right: auto;
		--bs-gutter-x: 1.5rem;
		left: calc(var(--bs-gutter-x)* .5);
		box-shadow: -1em 1em 0 1em #004008;
	}

	.footer-menu-bg {
		position: fixed;
		background: #004008;
		/* background: linear-gradient(360deg, #004008 25%, #004008d6 50%, transparent 100%); */
		height: 68px;
		bottom: 0;
		right: 0;
		left: 0;
		z-index: 1;
		display: block;
	}
	.footer-menu-bg:before {
		content: "";
		display: block;
		position: absolute;
		--bs-gutter-x: 1.5rem;
		width: calc(var(--bs-gutter-x)* .5);
		height: 30px;
		right:0;
		bottom: 86px;
		background: linear-gradient(360deg, #004008 25%, #004008d6 50%, transparent 100%);
	}
	.footer-menu-bg:after {
		content: "";
		display: block;
		position: absolute;
		--bs-gutter-x: 1.5rem;
		width: calc(var(--bs-gutter-x)* .5);
		height: 30px;
		left: 0;
		bottom: 86px;
		background: linear-gradient(360deg, #004008 25%, #004008d6 50%, transparent 100%);
	}

	.inner-page .inner-box {
		min-height: calc(100vh - 144px);
		padding: 12px 12px 32px;
	}
	.inner-page .inner-box .inner-copyright {
		bottom: 8px;
		font-size: 11px;
	}
}



/* ============== Inner Page - End ================ */







/* ============== Register Page - Start ============== */
.register-page {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(25deg, #002605, #00891c);
	z-index: 0;
}
.register-page:before {
	display: block;
	content: "";
	background-image: url("../images/login-pattern.svg?7");
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top left;
	transform: scaleX(-1);
	background-size: contain;
	position: fixed;
	z-index: -2;
	top: 0;
}


.register-page .register-side {
	width: 50%;
	height: 100%;
	float: right;
	text-align: center;
	padding: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: fixed;
}
.register-page .register-side .register-logo {}
.register-page .register-side .register-logo .register-icon {
	height: 140px;
	width: 100%;
	background-image: url("../images/logo-icon.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	margin-bottom: 25px;
}
.register-page .register-side .register-logo .register-title {
	color: #fff;
	font-weight: 500;
	font-size: 40px;
	margin-bottom: 12px;
}
.register-page .register-side .register-logo .register-subsitle {
	font-size: 14px;
	color: #f69e00;
	font-weight: 300;
	margin-bottom: 10px;
}
.register-page .register-side .register-logo .register-description {
	color: #41832f;
	font-size: 19px;
}

.register-page .register-side .register-version {
	position: absolute;
	right: 25px;
	bottom: 25px;
	color: #b0be80;
	line-height: 14px;
	font-size: 12px;
}


.register-page .register-box {
	width: calc(50% - 25px);
	height: calc(100% - 50px);
	position: relative;
	left: 0;
	background: #fff;
	border-radius: 25px;
	margin: 25px;
	padding: 30px 30px 60px;
	display: flex;
	align-content: flex-start;
	flex-direction: column;
	justify-content: center;
	top: 0;
	float: left;
}
.register-page .register-box h6 {
	text-align: center;
	font-size: 17px;
	color: #c3c3c3;
	margin-bottom: 8px;
}
.register-page .register-box h6 i {
	vertical-align: -3px;
	font-size: 24px;
}
.register-page .register-box .register-form {}
.register-page .register-box .register-form .form-control {
	background: #f7fef4;
	height: 54px;
	font-size: 14px;
	color: #003a03;
	padding-bottom: 1px;
	border-radius: 7px;
	padding-top: 20px;
	border: 1px solid #f4f9fe;
}
.register-page .register-box .register-form .form-control:focus {
   box-shadow: 0 0 0 2px #0b620126;
}
.register-page .register-box .register-form .form-floating>label {
	font-size: 14px;
	color: #54964b;
	font-weight: 400;
	line-height: 20px;
}
.register-page .register-box .register-form .form-floating>.form-control:not(:placeholder-shown)~label,
.register-page .register-box .register-form .form-floating>.form-control:focus~label{
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
}

.skills-options {
	position: relative;
	display: block;
	font-size: 13px;
}
.skills-options .form-check-input:checked+label {
	color: #1b7a00;
}

.register-page .register-box .register-form #reg_btn {
	height: 54px !important;
	font-size: 17px;
	border-radius: 10px;
}
.register-page .register-box .register-form .form-control #reg_btn:hover {}
.register-page .register-box .register-form .register-register-text {
	text-align: center;
}
.register-page .register-box .register-form .register-register-text p {
	font-size: 16px;
	color: #8e8e8e;
	margin-top: 20px;
}
.register-page .register-box .register-form .register-register-text p a {
	color: #2c6c01;
}
.register-page .register-box .register-form .register-register-text p a:hover {
	color: #f69e01;
}

.register-page .register-box .register-copyright {
	position: absolute;
	width: 100%;
	bottom: 20px;
	right: 0;
	left: 0;
	text-align: center;
	color: #afafaf;
	font-size: 14px;
}
.register-page>.register-version {
	display: none;
}

@media (max-width: 860px) {
	.register-page .register-box {
		width: calc(60% - 25px);
	}

	.register-page .register-side {
		width: 40%;
	}
}

@media (max-width: 770px) {
	.register-page {
		position: relative;
		height: max-content;
		padding-bottom: 40px;
		min-height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.register-page:before {
		z-index: 0;
	}
	
	.register-page .register-box {
		width: calc(100% - 20px);
		margin: 0 10px;
		display: block;
		float: none;
		position: relative;
	}

	.register-page .register-side {
		width: 100%;
		display: flex;
		position: relative;
		flex-direction: row;
		justify-content: center;
		margin-bottom: 12px;
	}

	.register-page .register-side .register-logo {
		text-align: right;
	}
	.register-page .register-side .register-logo .register-icon {
		height: 80px;
		width: 80px;
		float: right;
		margin-bottom: 0;
	}
	.register-page .register-side .register-logo .register-title-box {
		float: right;
		margin-top: 6px;
		margin-right: 3px;
	}
	.register-page .register-side .register-logo .register-title {
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 5px;
		display: block;
		width: auto;
	}
	.register-page .register-side .register-logo .register-subsitle {
		font-size: 12px;
		word-spacing: -1.0px;
		margin-bottom: 5px;
	}
	.register-page .register-side .register-logo .register-description {
		font-size: 16px;
		margin-bottom: 0;
	}
	
	.register-page .register-side .register-version {
		display: none;
	}
	.register-page>.register-version {
		display: block;
		position: absolute;
		right: 10px;
		left: 10px;
		bottom: 12px;
		color: #809ebe;
		line-height: 14px;
		font-size: 12px;
		text-align: center;
	}

	.register-page .register-box h6 {
		font-size: 18px;
		margin-bottom: 15px;
	}
	.register-page .register-box h6 i {
		font-size: 24px;
		vertical-align: -3px;
	}
}


@media (max-height: 500px) {
	.register-page .register-box {
		overflow-y: auto;
		display: block;
	}
	.register-page .register-box .register-copyright {
		position:relative;
		bottom: -30px;
	}
	.register-page .register-side .register-logo .register-icon {
		height: 76px;
		margin-bottom: 15px;
	}

	.register-page .register-side .register-logo .register-title {
		/* font-size: 26px; */
		/* margin-bottom: 10px; */
	}
	.register-page .register-side .register-logo .register-subsitle {
		font-size: 12px;
		letter-spacing: -0.4px;
		margin-bottom: 8px;
	}
	.register-page .register-side .register-logo .register-description {
		font-size: 15px;
	}
}

/* ============== Register Page - End ================ */






/* ============== Login Page - Start ============== */
.login-page {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: linear-gradient(25deg, #002605, #00891c);
	/* z-index: -2; */
}
.login-page:before {
	display: block;
	content: "";
	background-image: url("../images/login-pattern.svg?7");
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top left;
	transform: scaleX(-1);
	background-size: contain;
	position: absolute;
	z-index: -2;
}


.login-page .login-side {
	width: 50%;
	height: 100%;
	float: right;
	text-align: center;
	padding: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.login-page .login-side .login-logo {}
.login-page .login-side .login-logo .login-icon {
	height: 140px;
	width: 100%;
	background-image: url("../images/logo-icon.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	margin-bottom: 25px;
}
.login-page .login-side .login-logo .login-title {
	color: #fff;
	font-weight: 500;
	font-size: 40px;
	margin-bottom: 12px;
}
.login-page .login-side .login-logo .login-subsitle {
	font-size: 14px;
	color: #f69e00;
	font-weight: 300;
	margin-bottom: 10px;
}
.login-page .login-side .login-logo .login-description {
	color: #5d832f;
	font-size: 19px;
}

.login-page .login-side .login-version {
	position: absolute;
	right: 25px;
	bottom: 25px;
	color: #80be81;
	line-height: 14px;
	font-size: 12px;
}


.login-page .login-box {
	width: calc(50% - 25px);
	height: calc(100% - 50px);
	position: absolute;
	left: 0;
	background: #fff;
	border-radius: 25px;
	margin: 25px;
	padding: 30px 30px 60px;
	display: flex;
	align-content: flex-start;
	flex-direction: column;
	justify-content: center;
	top: 0;
}
.login-page .login-box h6 {
	text-align: center;
	font-size: 26px;
	color: #e3e3e3;
	margin-bottom: 27px;
}
.login-page .login-box h6 i {
	vertical-align: -4px;
	font-size: 31px;
}
.login-page .login-box .login-form {}
.login-page .login-box .login-form .form-control {
	background: #f4fef5;
	border-color: #f7fef4;
	height: 74px;
	font-size: 22px;
	color: #123a00;
	padding-bottom: 1px;
	border-radius: 15px;
}
.login-page .login-box .login-form .form-control:focus {
   box-shadow: 0 0 0 0.25rem #32620126;
}
.login-page .login-box .login-form .form-floating>label {
	font-size: 18px;
	color: #4b6e96;
	font-weight: 500;
	line-height: 42px;
}
.login-page .login-box .login-form .form-floating>.form-control:not(:placeholder-shown)~label,
.login-page .login-box .login-form .form-floating>.form-control:focus~label{
	font-size: 14px;
	font-weight: 400;
	line-height: 28px;
}
.login-page .login-box .login-form #login_btn {
	height: 74px !important;
	font-size: 20px;
}
.login-page .login-box .login-form .form-control #login_btn:hover {}
.login-page .login-box .login-form .login-register-text {
	text-align: center;
}
.login-page .login-box .login-form .login-register-text p {
	font-size: 16px;
	color: #8e8e8e;
	margin-top: 20px;
}
.login-page .login-box .login-form .login-register-text p a {
	color: #056c01;
}
.login-page .login-box .login-form .login-register-text p a:hover {
	color: #f69e01;
}

.login-page .login-box .login-copyright {
	position: absolute;
	width: 100%;
	bottom: 20px;
	right: 0;
	left: 0;
	text-align: center;
	color: #afafaf;
	font-size: 14px;
}
.login-page>.login-version {
	display: none;
}

@media (max-width: 860px) {
	.login-page .login-box {
		width: calc(60% - 25px);
	}

	.login-page .login-side {
		width: 40%;
	}
}

@media (max-width: 770px) {
	.login-page {
		position: relative;
		height: max-content;
		padding-bottom: 40px;
		min-height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.login-page:before {
		z-index: 0;
	}
	
	.login-page .login-box {
		width: calc(100% - 20px);
		margin: 0 10px;
		display: block;
		float: none;
		position: relative;
	}

	.login-page .login-side {
		width: 100%;
		display: flex;
		position: relative;
		flex-direction: row;
		justify-content: center;
		margin-bottom: 12px;
	}

	.login-page .login-side .login-logo {
		text-align: right;
	}
	.login-page .login-side .login-logo .login-icon {
		height: 80px;
		width: 80px;
		float: right;
		margin-bottom: 0;
	}
	.login-page .login-side .login-logo .login-title-box {
		float: right;
		margin-top: 6px;
		margin-right: 3px;
	}
	.login-page .login-side .login-logo .login-title {
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 5px;
		display: block;
		width: auto;
	}
	.login-page .login-side .login-logo .login-subsitle {
		font-size: 12px;
		word-spacing: -1.0px;
		margin-bottom: 5px;
	}
	.login-page .login-side .login-logo .login-description {
		font-size: 16px;
		margin-bottom: 0;
	}
	
	.login-page .login-side .login-version {
		display: none;
	}
	.login-page>.login-version {
		display: block;
		position: absolute;
		right: 10px;
		left: 10px;
		bottom: 12px;
		color: #809ebe;
		line-height: 14px;
		font-size: 12px;
		text-align: center;
	}

	.login-page .login-box h6 {
		font-size: 18px;
		margin-bottom: 15px;
	}
	.login-page .login-box h6 i {
		font-size: 24px;
		vertical-align: -3px;
	}
}

@media ( max-width: 460px ) {
	.login-page .login-box .login-form .form-control {
		height: 60px;
		font-size: 20px;
		padding-bottom: 1px;
	}
	.login-page .login-box .login-form .form-floating>label {
		font-size: 16px;
		line-height: 27px;
	}
	.login-page .login-box .login-form .form-floating>.form-control:not(:placeholder-shown)~label,
	.login-page .login-box .login-form .form-floating>.form-control:focus~label{
		font-size: 13px;
		line-height: 16px;
	}
	.login-page .login-box .login-form #login_btn {
		height: 66px !important;
		font-size: 20px;
	}

	#captchaimg, .captchaimg {
		height: 45px !important;
	}
	#captchaimg+.captcha_refresh {
		left: 137px;
		top: 7px;
	}
}

@media (max-height: 500px) {
	.login-page .login-box {
		overflow-y: auto;
		display: block;
	}
	.login-page .login-box .login-copyright {
		position:relative;
		bottom: -30px;
	}
	.login-page .login-side .login-logo .login-icon {
		height: 76px;
		margin-bottom: 15px;
	}

	.login-page .login-side .login-logo .login-title {
		/* font-size: 26px; */
		/* margin-bottom: 10px; */
	}
	.login-page .login-side .login-logo .login-subsitle {
		font-size: 12px;
		letter-spacing: -0.4px;
		margin-bottom: 8px;
	}
	.login-page .login-side .login-logo .login-description {
		font-size: 15px;
	}
}

/* ============== Login Page - End ================ */