@font-face {
	font-family: AnuphanRegular;
	src: url(../assets/fonts/prompt/PromptRegular.eot);
	src: url(../assets/fonts/prompt/PromptRegular.eot) format("embedded-opentype"), url(../assets/fonts/prompt/PromptRegular.woff2) format("woff2"), url(../assets/fonts/prompt/PromptRegular.woff) format("woff"), url(../assets/fonts/prompt/PromptRegular.ttf) format("truetype"), url(../assets/fonts/prompt/PromptRegular.svg#PromptRegular) format("svg")
}

@font-face {
	font-family: AnuphanRegular;
	src: url(../assets/fonts/Anuphan/AnuphanRegular.eot);
	src: url(../assets/fonts/Anuphan/AnuphanRegular.eot) format("embedded-opentype"), url(../assets/fonts/Anuphan/AnuphanRegular.woff2) format("woff2"), url(../assets/fonts/Anuphan/AnuphanRegular.woff) format("woff"), url(../assets/fonts/Anuphan/AnuphanRegular.ttf) format("truetype"), url(../assets/fonts/Anuphan/AnuphanRegular.svg#AnuphanRegular) format("svg")
}

body {
	background-color: #fff;
	color: #242a38;
	font-family: AnuphanRegular, sans-serif;
	font-size: 18px !important
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: AnuphanRegular, sans-serif;
	font-weight: 700
}

p.login {
	margin-bottom: 20px;
	text-align: center
}

p.login,
p.register {
	color: #5a6573;
	font-size: 20px;
	font-weight: 500
}

p.register {
	margin-bottom: 10px;
	text-align: left
}

a {
	transition: all .3s ease
}

a:hover {
	text-decoration: none !important
}

.content {
	padding: 7rem 0
}

h2 {
	font-size: 20px
}

.half {
	height: 100vh
}

.half .logo-login img {
	margin: 30px;
	width: 300px
}

.half .bg {
	width: 40%
}

@media (max-width:767.98px) {
	.half .bg {
		height: 0
	}
}

.half .contents {
	width: 60%
}

@media (max-width:991.98px) {
	.half .contents {
		width: 100%
	}
}

.half .contents .content-body {
	height: calc(100vh - 170px);
	overflow-y: scroll;
	padding-bottom: 3rem
}

.half .contents .content-body::-webkit-scrollbar {
	display: none
}

.half .contents .form-group {
	border: 1px solid #d0d9e5;
	border-bottom: none;
	margin-bottom: 0;
	overflow: hidden;
	padding: 15px;
	position: relative
}

.half .contents .form-group label {
	position: absolute;
	top: 30%;
	transform: translateY(-50%);
	transition: all .3s ease
}

.half .contents .form-group input:focus+label {
	margin-top: -20px
}

.half .contents .form-group.first {
	border-top-left-radius: 7px;
	border-top-right-radius: 7px
}

.half .contents .form-group.last {
	border-bottom: 1px solid #d0d9e5;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px
}

.half .contents .form-group label {
	color: #afbed3;
	display: block;
	font-size: 12px;
	margin-bottom: 0
}

.half .contents .form-group.field--not-empty label {
	margin-top: -20px
}

.half .contents label span {
	color: #e03434
}

.half .contents .form-control {
	border-radius: 50px;
	padding: 10px
}

.half .contents .form-control:active,
.half .contents .form-control:focus {
	box-shadow: none;
	outline: none
}

.half .contents .form-control:focus {
	border-color: #242a38;
	outline: 0
}

.half .contents .form-select {
	border-radius: 50px;
	padding: 10px
}

.half .contents .form-select:focus {
	border-color: #242a38;
	box-shadow: 0 0 0 .25rem rgba(36, 42, 56, .2);
	outline: 0
}

.half .contents .input-icons {
	margin-bottom: 10px;
	position: relative;
	width: 100%
}

.half .contents .input-icons i {
	color: #d0d9e5;
	font-size: 20px;
	position: absolute
}

.half .contents .icon,
.half .contents .icon-password {
	min-width: 40px;
	padding: 8px 15px 7px 17px
}

.half .contents .icon-password {
	right: 10px
}

.half .contents .input-field {
	border: 1px solid #d0d9e5;
	border-radius: 50px;
	padding: 10px 10px 10px 50px;
	width: 100%
}

.half .bg {
	background-position: 50%;
	background-size: cover
}

.half .regis {
	color: #0785ec;
	text-decoration: none
}

.half .regis:hover {
	color: rgba(36, 42, 56, .2)
}

.half .forget {
	color: #5a6573;
	text-decoration: none
}

.half .forget:hover {
	color: rgba(36, 42, 56, .2)
}

.half .link {
	color: #5a6573;
	text-decoration: underline
}

.half .link:hover {
	color: rgba(36, 42, 56, .2)
}

.half .btn {
	border-radius: 50px;
	font-size: 20px;
	font-weight: 500;
	height: 54px;
	padding-left: 30px;
	padding-right: 30px
}
.half .usermanual .btn {
	border-radius: 50px;
	font-size: 20px;
	font-weight: 500;
	height: auto;
	padding-left: 30px;
	padding-right: 30px
}
.half .forgot-pass {
	font-size: 14px;
	position: relative;
	top: 2px
}

.half .login-usermanual {
	background: #e6f2e6;
	color: #1a3a1c
}

.half .login-usermanual:hover {
	background: #c9e3c9
}

.btn-Ocean-Deep {
	background: #1a3a1c;
	color: #fff
}

.btn-Ocean-Deep:hover {
	background: #3e6a22
}

.btn-Shine {
	background: #f6da7a;
	color: #1a3a1c
}

.btn-Shine:hover {
	background: #f7c932
}

.btn-border-Ocean {
	border: 2px solid #345336;
	color: #345336
}

.btn-border-Ocean:hover {
	background: #345336;
	color: #fff
}

ul {
	list-style-type: none;
	margin: 0;
	padding: 0
}

ul li.menu-card {
	background-color: #e0e8f1;
	border-radius: 8px;
	display: inline-block;
	margin: 0 5px 8px 0;
	padding: 10px 20px 10px 18px
}

ul li.menu-card img {
	margin-right: 3px;
    margin-top: -5px;
    width: 20px;
    min-width: 0px !important;
    top: 0px;
    position: relative;
}

.card-bg-Haze-color {
	background-color: #f2f5fa;
	border-radius: 16px;
	margin-bottom: 20px;
	padding: 20px 20px 1px
}

.badge {
	font-size: 18px;
	font-weight: 500
}

/*# sourceMappingURL=login.css.map */