.lesionItem{
	pointer-events: none;
	position: relative;
}
.lesionItem::before{
	content: '\f023';
	position: absolute;
	font: normal normal normal 14px/1 FontAwesome;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 99;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
}
.lesionItem.ok{
	pointer-events: all;
}
.lesionItem.ok::before{
	content: unset;
}
body{
	font-family: Arial;
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
	background:#f0f0f0;
}
body.newsbody{
	/*overflow: hidden;*/
	/*Background.jpg
	RM10105208.jpg
	RM14100178.jpg
	*/
	/*background: url(../images/RM14100178.jpg);*/
	height: 100vh;
	width: 100%;
	background-size: cover; 
	background-position: center bottom;
	position: relative;
}
.left{
	float: left!important;
}
.modal.fade.in.popup {
	display: block;
	background: #00000024;
	z-index: 1053;
}
.modal.fade.in.popup1,.modal.fade.in.popupck {
	display: block;
	background: #00000024;
	z-index: 5053;
}
.modal.fade.in.popup2 {
	display: block;
	background: #00000024;
	z-index: 1053;
}
form.savebutton{
	padding: 0px;
	font-size: 28px;
	display: inline-block;
	margin: 0;
	background-color: #f8fbfc;
	/* width: 30px; */
	height: 36px;
	color: #108bb1;
	border: none;
	border-radius: 5px;
	bottom: 2px;
	right: -10px;
	position: absolute;
	z-index: 1;
}

.menu1{
	cursor: pointer;
}
.right{
	float: right!important;
}
.center{
	text-align: center;
}
#signin, #tientrinh{
	/*RM14100178
	RM10105208
	Background.jpg*/
	background: url('../images/RM14100178.jpg');
	min-height: 100vh;
	width: 100%;
	background-size: cover;
	position: relative;
	background-position: center bottom;
}
.logo{
	padding: 20px 0 25px;
	/* padding-top: 5px; */
}
.logo1{
	/* padding: 20px 0 25px; */
	padding: 5px 0 0;
}
.form-group{
	position: relative;
	z-index: 1;
	width: 700px;
	/* height: 390px ;*/
	margin: 0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
.footer-aside ul li{
	font-size: 12px!important;
}
.left-content-signin{
	text-align: center;
	color: #fff;
	padding: 25px;
	width: 42.8%;
	float: left;
	background: rgba(21, 147, 182,.9);
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
}
.left-content-signin p{
	padding-top: 20px;
	padding-bottom: 15px;
}
.left-content-signin a.btn-default,.left-content-signin .btn-default:hover{
	color:#008ab0;
	border: 1px solid #dddddd;
	border-radius: 5px;
	font-weight: 700;
	font-family: Arial;
	background: #fff;
}
.register .right-form{
	padding: 10px;
}
.right-form{
	text-align: center;
	padding: 25px;
	width: 57.2%;
	float: right;
	background-color:  rgba(255, 255, 255, 0.9);
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}
.right-form h5{
	color:  #008ab0;
	font-size: 24px;
	padding-top: 8px;
}
.right-form >p{
	color:  #333;
	font-weight: normal!important;
	font-size: 12px;
	margin-bottom: 5px;
}
.usernamespa{
	font-weight: bold;
	color: #333!important;
}
.right-form button,.right-form input{
	width: 100%;
	margin: 5px 0;
}
.right-form button,.right-form button:active:hover{
	border: none;
	background: transparent;
	border-radius: 20px;
	color: #008ab0;
	box-shadow: none;
}
.right-form button:hover{
	color: #fff;
	background: #008ab0;
}
.right-form input::-webkit-input-placeholder{
	font-family: Arial;
	color:  #aaaaaa;
	font-size: 14px;
	font-style: italic;
	line-height: 30px;
}

.right-form input::-webkit-input-placeholder,.right-form input::-moz-placeholder,.right-form input:-ms-input-placeholder{
	font-family: Arial;
	color:  #aaaaaa;
	font-size: 14px;
	font-style: italic;
	line-height: 30px;
}
.right-form input{
	padding: 2px 5px;
	border-radius: 5px;
	border-width: 1px;
	border-color:  #dddddd;
	border-style: solid;
	background-color:  #ffffff;
}

.register .right-form select{
	width: 96%;
	height: 32px;
    padding: 0 5px;
    margin: 5px 0;
}

.right-form select{
	padding: 2px 5px;
	border-radius: 5px;
	border-width: 1px;
	border-color:  #dddddd;
	border-style: solid;
	background-color:  #ffffff;
}

.footer-singin{
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 0;
	color: #fff;
	line-height: 36px;
}
.footer-singin h1{
	margin: 0;
	font-size: 60px;
}
.footer-singin p{
	/*margin-bottom: 20px;
	font-size: 38px;*/
	font-size: 23px;
}
.dn{
	width: 80%;
	margin: 0 auto;
	border-radius: 20px;
	padding: 3px;	
	color: #fff;
	background: #008ab0;
	margin-top: 20px;
}
.dn:hover{
	cursor: pointer;
}
/*-----------------------register------------------*/
.register .right-form a{
	width: 95%;
	margin-top: 5px;
	border: none;
	background: transparent;
	border-radius: 20px;
	color: #008ab0;
}
.register .right-form a:hover{
	color: #fff;
	background: #008ab0;
}
.register .right-form input{
	width: 96%;
	padding: 0 5px;
	margin: 5px 0;
}
.chuaco,.daco{
	display: none;	
}

.chuaco,.chuaco:active:hover{
	padding: 10px 0;
	background: #008ab0;
	color: #fff;
	margin-bottom: 20px;

}
.register .right-form span{
	color: red;
	padding-left: 3px;
}
.register .right-form input[name='cmnd']{
	width: 45%;
	margin-right: 15px;
}
.register .right-form input[name='nc']{
	width: 100%;	
}
.cala{
	display: inline-block;
	width: 46%;
}
#myModal .modal-dialog{
	width: 500px;
	/* height: 450px; */
	margin-top: 145px;
}
#myModal .modal-content,.content-modal{
	padding: 30px 30px 20px;
	background: url('../images/professor.png');
	background-position: center center;
}
#myModal .modal-header,#myModal .modal-footer{
	border: none;
}
#myModal email{
	font-weight: 700;
}
#myModal a:hover,#myModal a{
	background: transparent;
	color: #2493b6;
	font-weight: 700;
	font-size: 16px;
}
#myModal span{
	color: #363636;
	font-size: 16px;
}
#myModal .modal-title{
	font-family: Arial;
	color:  #1694b7;
	font-size: 30px;
	font-weight: 700;
	line-height: 30px;
	text-align: center;
	padding-top: 15px;
}
.notice{
	/* display: none; */
	font-size: 12px;
	color: #f44336;
	/*line-height: 28px;*/
	line-height: 15px;
	margin-bottom: 0;
}
.notice i.fa{
	color: #f44336;
}
.register .notice{
	width: 100%;
	text-align: left;
}
.ht.in {
	display: block;
	background: rgba(0, 0, 0, 0.25);
}
/*--------------------------DASHBOARD-----------------------*/
body{
	min-height: 100vh;
	/* overflow: hidden; */
}
.navigation{
	width: 100%;
	overflow: hidden;
	background: #363636;
}
.navigation ul{
	color: #fff;
	list-style: none;
	float: right;
	margin-bottom: 0;
}
.navigation ul li{
	float: left;
	padding: 8px 15px;
}
.navigation ul li a{
	color: #fff;
}
.navigation ul li.close-nav{
	background: #4a4a4a;
}
.aside{
	width: 30%;
	background: rgba(16, 139, 177, 0.7);
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1053;
	height: 100vh;
	padding-left: 10px;
	padding-right: 10px;
	color: #fff;
}
.nav-aside{
	position: relative;
	width: 100%;
	height: 100%;
}
.nav-aside>h5{
	margin: 0;
	text-align: center;
	padding: 15.5px 0;
}
.nav-aside>h5 i{
	padding-right: 10px;
}
.content-sidebar{
	margin-left: -10px;
	margin-right: -10px;
	background: #108bb1;
	/*min-height: calc(100vh - 86px);	*/
	max-height: calc(100vh - 86px);	
	height: calc(100vh - 86px);	
	overflow-y: auto;
}
.content-sidebar::-webkit-scrollbar {
	width: 6px;
}

.content-sidebar::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(51, 51, 51, 0.9); 
	/* background: rgba(51, 51, 51, 0.5); */
	border-radius: 0px;
}
.content-sidebar::-webkit-scrollbar-thumb {
	border-radius: 0px;
	-webkit-box-shadow: inset 0 0 6px #33322c; 
	background: #33322c;
}
.menu-lesion:hover,.menu-lesion.active{
	cursor: pointer;
	border-left-color: #02627c;
	background: #40a2c1;
}
.menu-lesion{
	border-left: 5px solid transparent;
	/* background: #108bb1; */
	width: 100%;
	overflow: hidden;
	padding: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.left-les{
	float: left;
	width: 70%;
}
.left-les a{
	color: #fff;
	font-size: 18px;
}
.left-les p.title{
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 0;
}
.left-les p.last{
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 0;
	/* 	margin-top: -5px; */
	padding-left: 15px;
	position: relative;
}
.left-les p.last1{
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 0;
	/* 	margin-top: -5px; */
	padding-left: 15px;
}
.right-time{
	background: rgba(0, 0, 0, 0.2);
	border-radius: 30px;
	font-size: 12px;
	float: right;
	text-align: center;
	width: 30%;
	padding: 3px;
}
.right-time i.fa{
	/* padding-left: 2px; */
	color: #000;
	padding-top: 10px;
}
.right-time p{
	margin-bottom: 0;
}
.time-les p{
	line-height: 16px;
	padding-left: 40px;
	text-align: left;
}
.right-time .play{
	background: #fff;    
	border-radius: 100%;
	width: 32px;
	height: 32px;
	margin-bottom: 0;
	float: left;
}
.footer-aside{
	width: 100%;
	position: absolute;
	bottom: 0;
}
.footer-aside ul{
	list-style: none;
	padding-left: 0;
	margin: 0;
}
.footer-aside ul li{
	float: right;
	padding: 5px 18px;
	border-left: 1px solid #0a6780;
}
.footer-aside ul li:first-child{
	padding-left: 15px;
	padding-right: 5px;

}
.footer-aside ul li:last-child{
	border-left-width:0;
}
.footer-nice{
	/* height: 40px; */
	width: 100%;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	background: #363636;
	/* color: #5d5d5d; */
	color: #fff;
	z-index: 1052;
}
footer.footer-nice .col-md-8.col-md-offset-4.col-sm-9.col-sm-offset-3{
	width: 70%;
	margin-left: 30%;
	padding-left: 0;
	padding-right: 0;
	transition: all 1s ease;
}
footer.footer-nice .col-md-8.col-md-offset-4.col-sm-9.col-sm-offset-3.full{
	width: calc(100% - 46px)
}
.icon-left{
	padding: 0;
	width: 21%;
	position: relative;
}
.icon-left span{
	background: #4a4a4a;
	float: left;
	padding: 5px 15px;
}
.center-topic{
	display: flex;
	text-align: center;
	width: 58%;
}
.center-topic ul{
	list-style: none;
	margin: 0 auto;
	overflow: hidden;
	display: inline-table;
}
.center-topic ul li{
	float: left;
	padding: 5px 15px;
}
.center-topic ul li.next,.center-topic ul li.prev,.center-topic ul li.lession{
	background: #4a4a4a;
}
.center-topic ul li.lession{
	padding: 5px 7px;
}
.center-topic ul li.lession span{
	padding: 8px 10px;
	border-radius: 25px;
	background: #363636;
}
.icon-right{
	padding: 0;
	width: 21%;
}
.icon-right span{
	background: #4a4a4a;
	padding: 5px 15px;
	float: right;	
}
.done2{color:#66bb6a;}
.comming2{color:#ffeb3b;}
.fail2{color:red;}
p.done:before,p.comming:before,p.fail:before{
	content: '';
	width: 10px;
	height: 10px;
	background: #66bb6a;
	left: 0px;
	margin-top: 3px;
	position: absolute;
	z-index: 12;
}
p.comming:before{
	background: #ffeb3b;
}
p.fail:before{	
	background: red;
}
p.done1:before,p.comming1:before,p.fail1:before{
	content: '';
	width: 10px;
	height: 10px;
	background: #66bb6a;
	left: 5px;
	margin-top: 3px;
	position: absolute;
	z-index: 12;
}
p.comming1:before{
	background: #ffeb3b;
}
p.fail1:before{	
	background: red;
}
.one{
	padding-top: 8px;
}
.hidden{
	display: none;
}
.show{
	display: block;
}
.saved{
	background-color: #030305ad;
	color: #ffffff;
	text-align: center;
}
.synctext{
	background-color: #030305ad;
	color: #ffffff;
	text-align: center;
}
#syncalert {
    width: 155px;
    height: 100px;
    position: absolute;
    z-index: 1;
    margin-left: 60%;
    margin-top: 5px;
}
.hide-menu{
	color: #fff;
	/* position: absolute;
	left: 30%;
	top: 0; */
	font-size: 16px;/* Approximation due to font substitution */
	line-height: 30px;/* Approximation due to font substitution */
	text-align: center;
	margin-bottom: 0;
	margin-top: -46px;
	float: left;
	/* padding-top: 10px; */
}
.hide-menu:after{
	clear: both;
}
.hide-menu span{
	display: inline-block;
}
.hide-menu i{
	text-align: center;
	background-color:  #108bb1;
	width: 46px;
	height: 46px;
	padding-top: 15px;
	/*margin-right: 15px;*/
}
.hide-menu i:hover{
	cursor: pointer;
}
.dashboard{
	/*background: #f0f0f0;*/
	/*background: #00000040;*/
	overflow: hidden;
	display: none;
	margin-left: 30%;
	text-align: center;
	/* transition: margin-left 1s ease; */
	position: relative;
	height: calc(100vh - 86px);
}
.picture-center{
	/* 	display: none; */
}
.full{
	margin-left: 46px!important;
}
.menu-hide-left{
	margin-left: -46px;
}
.full .picture-center img{
	width: 80%;
	margin-bottom: 13px;
	/* margin-top: 4%; */
	transition: all 1s ease;

}
.full .picture-center{

	transition: all 1s ease;
}
.picture-center{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	width: 85%;
	/* transition: all 1s ease; */

}
.picture-center img{
	width: 100%;
	margin: 0 auto;
	/* margin-top: 12%; */
	margin-bottom: 20px;
	transition: all 1s ease;
}
.button{
	/*display: block;*/
	display: inline-block;
	margin: 0 auto;
	background-color:  #108bb1;
	width: 180px;
	height: 56px;
	font-size: 14px;
	line-height: 55px;
	text-align: center;
	color: #fff;
	border: none;
	border-radius: 30px;
	margin-left: 20px;
}
.makequestion{
	display: inline-block;
	margin: 0 auto;
	background-color: #f8fbfc;
	width: 115px;
	height: 37px;
	color: #108bb1;
	border: none;
	/* border-radius: 5px; */
	font-weight: 700;
	bottom: 1px;
	left: 45px;
	position: absolute;
}
.gui {
	background-color: #108bb1;
	width: 85px;
	height: 40px;
	font-size: 14px;
	color: #fff;
	border: none;
	border-radius: 30px;
	position: absolute;
	left: 0;
	bottom: 0;
	margin-left: 30px;
	margin-bottom: 10px;
}
.footer-aside li.first:hover {
	cursor: pointer;
}
#myModal12.modal,#myModal123.modal {
	padding-left: 30%;
}
#myModal12.modal.in,#myModal123.modal.in {
	display: block;
	background: rgba(0, 0, 0, 0.25);
	height: 100vh;
	/* padding: 10px!important; */

}
#myModal12 .modal-dialog,#myModal123 .modal-dialog {
	margin: 0 auto;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
#myModal12 .modal-content,#myModal123 .modal-content {
	/*height: 50%;*/
	width: 100%;
	padding: 15px;
	/* overflow-y: scroll; */
}
/*.popup{
	padding-left: 30%;
	}*/
	.popup1 .modal-dialog,.popupck .modal-dialog{
		/*width: 350px;*/
		height: 100%;
		text-align: center;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0px auto;
	}
	.popup1 .modal-content,.popupck .modal-content{
		background: #1894b6;
		border: none;
		margin-left: 10px;
	}
	.popup1 .modal-header,.popupck .modal-header{
		border-bottom-width: 0; 
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.popup1 .modal-footer,.popupck .modal-footer{
		border-top-width: 0;
		text-align: center;
		padding: 15px 0 30px;
	}
	.popup1 .modal-body,.popupck .modal-body{
		padding: 0 45px;
	}
	/* */
    .popup2 .modal-dialog{
		/*width: 350px;*/
		height: 100%;
		text-align: center;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0px auto;
	}
	.popup2 .modal-content{
		background: #1894b6;
		border: none;
		margin-left: 10px;
	}
	.popup2 .modal-header{
		border-bottom-width: 0; 
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.popup2 .modal-footer{
		border-top-width: 0;
		text-align: center;
		padding: 15px 0 30px;
	}
	.popup2 .modal-body{
		padding: 0 45px;
	}
	.popup .modal-dialog{
		/*width: 350px;*/
		height: 100%;
		text-align: center;
		color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0px auto;
	}
	.popup .modal-content{
		background: #1894b6;
		border: none;
		margin-left: 10px;
	}
	.popup .modal-header{
		border-bottom-width: 0; 
		padding-top: 40px;
		padding-bottom: 20px;
	}
	.popup .modal-footer{
		border-top-width: 0;
		text-align: center;
		padding: 15px 0 30px;
	}
	.popup .modal-body{
		padding: 0 45px;
	}
	.join,.join:hover{
		color: #008ab0;
		padding: 8px 12px;
		font-weight: 700;
		line-height: 30px;
		font-size: 16px;
		border: none;
		background: #fff;
	}
	.aside-menu-sub{
		position: relative;
		z-index: 1;
		height: calc(100vh - 46px);
		opacity: 0;
		margin-left: -3%;
		width: 46px;
		float: left;
		background: #108bb1;
		text-align: center;
		transition: all 1s ease;
	}
	.menu-sub-margin-left{
		opacity: 1;
		margin-left: 0;
	}
	.aside-menu-sub p.play{
		margin: 0 auto;
		background: #fff;
		border-radius: 50%;
		text-align: center;
		width: 32px;
		margin-bottom: 0;
		height: 32px;
		line-height: 32px;
	}
	.menu-item{
		position: relative;
		margin: 20px 0;
	}
	.menu-item:hover{
		cursor: pointer;
	}
	.menu-item:hover .tmp_time,.menu-item.active .tmp_time{
		opacity: 1;
	}
	.tmp_time{
		opacity: 0;
		background: #108bb1;
		position: absolute;
		left: 100%;
		top: 50%;
		border-radius: 0px 30px 30px 0px;
		color: #fff;
		width: 80px;
		padding: 4px 0;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transition: opacity 1s ease;
	}
	.tmp_time .one{
		margin: 0;
		padding: 0;
		padding-left: 5px;
	}
	.tmp_time p{
		line-height: 16px;
		text-align: left;
		margin-bottom: 0;
		padding-left: 5px;
	}
	.lession-1{
		display: none;
		min-height: 366px;
		max-height: 500px;
		overflow-y: auto;
		text-align: left;
		position: absolute;
		top: 49%;
		left: 50%;
		width: 81%;
		background: url('../images/person.png') #fff;
		background-position: right;
		background-size: cover;
		/* background: rgba(255, 255, 255, 0.85); */
		transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		-moz-transform: translate(-50%,-50%);
		-ms-transform: translate(-50%,-50%);
		padding: 35px 30px 45px;
		/* transition: all 1s ease; */
	}
	.lession-1 h5{
		font-size: 18px;
		color: #108bb1;
		line-height: 30px;
		font-weight: 700;
		padding-bottom: 10px;
		margin: 0;
	}
	.lession-1 h5 i{
		padding-right: 5px;
	}
	.lession-1 p{
		line-height: 24px;
		padding-bottom: 15px;
	}
	.full .lession-1{
		height: 408px;
		/* top: 50%; */
		width: 65%;
		padding: 50px 65px 60px;

	}
	.animation-all .checkbox {padding-left: 20px; }
	.animation-all .checkbox label {
			display: inline-block;
			position: relative;
			padding-left: 5px; }
	.animation-all .checkbox label::before {
		content: "";
		display: inline-block;
		position: absolute;
		width: 17px;
		height: 17px;
		left: 0;
		top: 7px;
		margin-left: -20px;
		border: 1px solid #cccccc;
		border-radius: 10%;
		background-color: #fff;
		-webkit-transition: border 0.15s ease-in-out;
		-o-transition: border 0.15s ease-in-out;
		transition: border 0.15s ease-in-out;
	}
	.animation-all .checkbox label::after {
		display: inline-block;
		position: absolute;
		content: " ";
		width: 11px;
		height: 11px;
		left: 3px;
		top: 10px;
		margin-left: -20px;
		border-radius: 10%;
		background-color: #555555;
		-webkit-transform: scale(0, 0);
		-ms-transform: scale(0, 0);
		-o-transform: scale(0, 0);
		transform: scale(0, 0);
		-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
		-moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
		-o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
		transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
	}
	.animation-all .checkbox input[type="checkbox"] {opacity: 0; }
	.animation-all .checkbox input[type="checkbox"]:focus + label::before {
		outline: thin dotted;
		outline: 5px auto -webkit-focus-ring-color;
		outline-offset: -2px; 
	}
	.animation-all .checkbox input[type="checkbox"]:checked + label::after {
		-webkit-transform: scale(1, 1);
		-ms-transform: scale(1, 1);
		-o-transform: scale(1, 1);
		transform: scale(1, 1); 
	}
	.animation-all .radio-primary input[type="checkbox"] + label::after {
		background-color: #428bca; 
	}
	.animation-all .radio-primary input[type="checkbox"]:checked + label::before {
		border-color: #428bca; 
	}
	.animation-all .radio-primary input[type="checkbox"]:checked + label::after {
		background-color: #428bca; 
	}

	.radio {
		padding-left: 20px; }
		.radio label {
			display: inline-block;
			position: relative;
			padding-left: 5px; }
			.radio label::before {
				content: "";
				display: inline-block;
				position: absolute;
				width: 17px;
				height: 17px;
				left: 0;
				top: 7px;
				margin-left: -20px;
				border: 1px solid #cccccc;
				border-radius: 50%;
				background-color: #fff;
				-webkit-transition: border 0.15s ease-in-out;
				-o-transition: border 0.15s ease-in-out;
				transition: border 0.15s ease-in-out; }
				.radio label::after {
					display: inline-block;
					position: absolute;
					content: " ";
					width: 11px;
					height: 11px;
					left: 3px;
					top: 10px;
					margin-left: -20px;
					border-radius: 50%;
					background-color: #555555;
					-webkit-transform: scale(0, 0);
					-ms-transform: scale(0, 0);
					-o-transform: scale(0, 0);
					transform: scale(0, 0);
					-webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
					-moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
					-o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
					transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); }
					.radio input[type="radio"] {
						opacity: 0; }
						.radio input[type="radio"]:focus + label::before {
							outline: thin dotted;
							outline: 5px auto -webkit-focus-ring-color;
							outline-offset: -2px; }
							.radio input[type="radio"]:checked + label::after {
								-webkit-transform: scale(1, 1);
								-ms-transform: scale(1, 1);
								-o-transform: scale(1, 1);
								transform: scale(1, 1); }

								.radio-primary input[type="radio"] + label::after {
									background-color: #428bca; }
									.radio-primary input[type="radio"]:checked + label::before {
										border-color: #428bca; }
										.radio-primary input[type="radio"]:checked + label::after {
											background-color: #428bca; }
											.submit-btn{
												overflow: hidden;
												padding-top: 25px;
											}
											.submit-btn p{
												width: 130px;
												height: 45px;
												text-align: center;
												float: left;
												color: #fff;
												margin-bottom: 0;
												padding: 10px 20px;
												background: #108bb1;
												border-radius: 30px;
												margin-right: 10px;
											}    
											.quiz-test-btn{
												height: 45px;
												line-height: 24px;
												float: left;
											}
											.quiz-test-btn:hover,.submit-btn p:hover{
												background: #02627c;
												cursor: pointer;
											}
											.animation-all{
												transition: all 1s ease;
											}
											/*--------------------------slider----------------------*/
											.slider-question .lession-1:not(:first-child),.translateX-prev{
												transform: translate(100%,-50%);
												-webkit-transform: translate(100%,-50%);
												-ms-transform: translate(100%,-50%);
												-moz-transform: translate(100%,-50%);
											}
											.translateX{
												transform: translate(-200%,-50%)!important;	
												-moz-transform: translate(-200%,-50%)!important;	
												-ms-transform: translate(-200%,-50%)!important;	
												-webkit-transform: translate(-200%,-50%)!important;	
											}
											.translateXenter{
												transform: translate(-50%,-50%)!important;
												-ms-transform: translate(-50%,-50%)!important;
												-moz-transform: translate(-50%,-50%)!important;
												-webkit-transform: translate(-50%,-50%)!important;
											}
											/* ---------------------------end-slider------------------*/
											.navigation{
												padding-left: 30%;
												transition: all 1s ease;
											}
											.navigation.left-46{
												padding-left: 46px;	
											}
											.hide-menu.menu-hide{
												margin-top: 0;
												transition: all 1s ease;
											}
											.finish{
												text-align: center;
												margin-left: 30%;
											}
											.finish.in {
												background: #00000026;
												display: flex!important;
												justify-content: center;
												align-items: center;
											}
											.finish h5{
												text-align: center;
												color: #1694b7;
												font-weight: 700;
												font-size: 36px;
												line-height: 30px;
												padding-bottom: 20px;
											}
											.finish .modal-footer{
												text-align: center;
											}
											.finish .btn{
												width: 80%;
												border-radius: 30px;
												background: #1694b7;
												color: #fff;
											}
											#myModal.finish .modal-dialog{
												width: 465px;
											}
											.finish .modal-body p{
												margin: 0;
											}
											.print{
												width: 70%;
												overflow: hidden;
												position: absolute;
												margin-left: 30%;
												height: calc(100vh - 86px);
												transform: translateY(-200%);
												-webkit-transform: translateY(-200%);
												-ms-transform: translateY(-200%);
												-moz-transform: translateY(-200%);
												transition: all 1s ease; 
												z-index: 15;
											}
											.print.success-12 {
	/* transform: translateY(-240%);
    -webkit-transform: translateY(-240%);
    -ms-transform: translateY(-240%);
    -moz-transform: translateY(-240%); */
    transform: initial;
    -webkit-transform: initial;
    -ms-transform: initial;
    -moz-transform: initial;
}
.print .lession-1 {
	display: block;
	z-index: 1;
	transition: all 1s ease; 
	/* overflow-y: scroll; */
}
.blue{
	background: #108bb1;
	color: #fff;
	padding: 10px 20px;
	width: 70%;
	margin-bottom: 20px;
	border-radius: 5px;
}
.upload{
	border-radius: 5px;
	border-width: 1px;
	border-color:  #dddddd;
	border-style: solid;
	background-color:  #f0f0f0;
	width: 66px;
	height: 34px;
}
.ccspan{
	padding-left: 15px
}
.upcc{
	display: initial;
	margin-right: 15px;
}
.print .submit-btn{
	padding-top: 65px;
}
.opacity1{
	transform: translateY(0);
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	/*z-index: 10;*/
	z-index: 1051;
}
.full.print{
	width: calc(100% - 46px);
}
.translateY{
	transform: translate(-50%,200%)!important;
	-webkit-transform: translate(-50%,200%)!important;
	-ms-transform: translate(-50%,200%)!important;
	-moz-transform: translate(-50%,200%)!important;
}
.modal-footer a {
	color: #008ab0;
	padding: 8px 12px;
	font-weight: 700;
	line-height: 30px;
	font-size: 16px;
	border: none;
	background: #fff;
}
.modal-footer a:hover {
	text-decoration: none;
}
#result_test{
	/* display: flex; */
	display: none;
	justify-content: center;
	align-items: center;
	background: #f0f0f0;
	overflow: hidden;
	margin-left: 30%;
	text-align: center;
	transition: transform 1s ease, margin-left 1s ease;
	position: relative;
	height: calc(100vh - 86px);
	font-size: 16px;
	line-height: 30px;
	opacity: 0
}
#result_test.showTranslateY{
	transform: translate(0,-100%);
	-ms-transform: translate(0,-100%);
	-moz-transform: translate(0,-100%);
	-webkit-transform: translate(0,-100%);
	opacity: 1;
}
.result{
	width: 700px;
	overflow: hidden;
	margin: 0 auto;
	background: #fff;
	margin-bottom: 8px;
	padding: 5px 30px 15px;
}
.result>h5,.result>p{
	text-align: left;
}

.result>h5{
	font-size: 18px;
	color: #108bb1;
	font-weight: 700;
}
.result_tk{
	width: 700px;
	overflow: hidden;	
	margin: 0 auto;
	background: #fff;
}
.details{
	padding: 0px;
	width: 100%;
	display: inline-block;
}
.details table{
	width: 100%;
}
.tk{
	width: 100%;
	padding-left: 30px;
	overflow: hidden;
}
.tk>h5{
	font-size: 18px;
	color: #108bb1;
	font-weight: 700;
	float: left;
	padding-top: 8px;
}
.tabs-result{
	float: right;
	padding: 10px 15px;
	color:  #363636;
	font-size: 14px;
}
.tabs-result:hover,.tabs-result.active{
	color: #108bb1;
	background: #fafafa;
	cursor: pointer;
}
.result>.col-md-6 p{
	font-size: 16px;
	line-height: 30px;
	color: #1a1d36;
}
.result>.col-md-6 i.fa{
	color: #108bb1;
	font-size: 36px;
}
.agains{
	background-color:  #108bb1;
	width: 190px;
	height: 36px;
	color:  #ffffff;
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	outline: none;
	border-radius: 30px;
	border: none;
}
.details td:first-child{
	text-align: left;
	padding-left: 30px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	max-width: 350px;
}
.details th{
	background: #fafafa;
	padding: 8px 15px;
}
.details th:first-child{
	padding-left: 30px;
}
.khung{
	border-width: 1px;
	border-color:  #eeeeee;
	border-style: solid;
	background-color:  #ffffff;
	width: 640px;
	height: 26px;
	border-radius: 30px;
	margin: 0 auto;
}
.diem{
	width: 50%;
	height: 26px;
	border-radius: 30px;
	overflow: hidden;
}
.mau{
	background: url('../images/diem.png');
	background-size: cover;
	width: 660px;
	height: 26px;
	margin-left: -10px;
	margin-right: -10px;
}
.summary{
	padding: 28px 30px;
	text-align: left;
}
.summary h5{
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
}
.icon-after{
	text-align: center;
	width: 640px;
	margin: 0 auto;
	position: relative;
	left: 0%;
	top: -6px;
}
.icon-after p{
	margin-top: -10px;
}
.agains{
	transition: all 1s ease;
}
.pencil{
	display: none;
}
.footer-mobile{
	display: none;
}
.table-mobile{
	display: none;
}
.relative{
	position: relative;
}
.cala i,.cala1 i{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	right: 13px;
	color: #aaaaaa;
}
.cala i{
	right: 10px;
}
.cala1{
	display: inline;
}
.pleft0{
	padding-left: 0!important;
}
.cc-logo {
	padding: 15px 0;
}
.cc-logo.cc-logo1{
	padding: 0;
}
.active-tabs{
	transition: margin-left 1s ease;
}
.hide-menu.menu-hide{
	display: flex;
}
.show_print{
	line-height: 45px;
	margin-left: 6px;
	
}
.a-color{
color: #23527c!important;
}
/*------------------------------------------------
Tablet Landscape ( min-width: 981px ) and ( max-width: 1099px )
--------------------------------------------------*/
@media ( min-width: 768px ) and ( max-width: 1099px ){
	
	.left-les{
		width: 65%;
	}
	.right-time{
		width: 45%;
	}
	.picture-center{
		width: 100%;
	}
	.lession-1{
		width: 100%;
	}
	.icon-left{
		width: 19%;
	}
	.icon-left span{
		padding: 5px 10px;
	}
	.center-topic{
		width: 65%;
	}
	.center-topic ul{
		padding-left: 0;
	}
	.icon-right{
		width: 16%;
	}
	.icon-right span{
		padding: 5px 10px;
	}
	.footer-aside{
		font-size: 12px;
	}
	
	.footer-aside i.fa.fa-floppy-o{
		font-size: 14px;
	}
	.footer-aside ul li:first-child{
		padding-left: 10px;
		padding-right: 0px;
	}
	.footer-aside ul li{
		padding: 4px 5px;
	}
	.full .picture-center img{
		width: 95%;
	}
	.full .lession-1{
		width: 90%;
	}
	.submit-btn{
		padding-top: 10px;
	}
}
/*------------------------------------------------------------------
Tablet Portrait ( min-width: 768px ) and ( max-width: 980px )

-------------------------------------------------------------------*/

@media( min-width: 768px ) and ( max-width: 980px ){
	#myModal12 .modal-dialog, #myModal123 .modal-dialog {
		width: 100%;
	}
	.footer-aside ul li:first-child{
		padding-left: 8px;
	}
	.center-topic ul li{
		padding: 5px 10px;
	}
	.icon-left{
		width: 20%;
	}
	.icon-right{
		width: 15%;
	}
	.footer-aside ul li{
		padding: 4px 3px;
	}
	.full .lession-1{
		top: 50%;
	}
	.full .lession-1{
		width: 88%;
		height: 45vh;
	}
	.hide-menu span{
		display: none!important;
	}
	.time-les p{
		padding-left: 35px;
	}
	.right-time{
		width: 50%;
	}
	.left-les{
		width: 50%;
	}
	.picture-center img{
		height: 50vh;
		object-fit: cover;
	}
	.picture-center{
		height: 50vh;
	}
	.lession-1{
		height: 400px;
	}
	.result,.result_tk{
		width: 90%;
	}
	.result{
		/* padding: 5px 15px 15px; */
	}
	.blue{
		width: 100%;
	}
	.details th{
		text-align: center;
		padding: 8px 7.5px;
	}
	.details td:first-child{
		max-width: 250px;
		padding-left: 15px;
	}
	.noicter{
		width: 100%;
	}
	.khung,.icon-after{
		width: 90%;
	}
	.center-topic {
		width: 58%;
		padding: 0;
		font-size: 12px;
	}
	.icon-left {
		width: 24%;
		font-size: 12px;
	}
	.icon-right {
		width: 18%;
		font-size: 12px;
	}
	.center-topic ul li{
		padding: 5px 4px;
	}
	.footer-aside ul li{
		float: left;
	}
	.footer-aside ul li{
		border-width: 0;
	}
	.left-les p.title{
		font-size: 14px;
		line-height: 21px;
	}
}
.menu-hide marquee#finish1{
	line-height: 45px;
	animation: color-animation 5s linear infinite alternate,background 5s linear 3 alternate;
	width:  300px;

	/*background:url('/templates/Nushin/images/phaohoa.gif');*/
	background-position: center left;
	font-weight: bold;
}
.footer-qs {
	display: none;
}
/*-----------------------------------------
Mobile ( max-width: 767px ) (edited)
-------------------------------------------*/
@media ( max-width: 767px ){
	.mgbt24{
		margin-bottom: 24px!important;
	}
	div.text-chucmung{
		font-size: 20px;
		margin-top: 12%;
	}
	div.text-chucmung2{
		font-size: 20px;
		margin-top: 17%;
	}
	.footer-qs {
		display: flex;
		position: absolute;
		left: 50%;
		bottom: 9px;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		width: 100%;
		text-align: center;
		z-index: 1231;
	}
	.dashboard {
		z-index: 12;
	}
	.makequestion {
		position: initial;
		height: initial;
	}
	a.show_print.upload4 {
		float: none;
		margin: 0;
		line-height: 1.1;
	}
	#myModal12.modal,#myModal123.modal {
		padding: 10px;
	}
	.show_print {
		float: left;
		margin-top: -99px;
		margin-left: 60px;
	}
	.navigation ul {
		padding-left: 0;
	}
	.menu-hide marquee#finish1 {
		width: 100%;

	}
	.hide-menu span{
		display: none!important;
	}
	.footer-nice{
		height: 50px;
	}
	.footer-mobile{
		text-align: center;
		display: block;
	}	
	.navigation{
		height: auto;
		padding-left: 0;
		font-size: 16px;
	}
	.hide-menu.menu-hide {
		margin-top: 0px;
		display: block;
	}
	.hide-menu i {
		/*margin-top: -46px;*/
		float: left;
	}
	.popup.in{
		padding-left: 0;
		background: transparent;
	}
	.popup .modal-dialog{
		width: 100%;
		padding-bottom: 50px;
		padding-top: 45px;
	}
	.popup .modal-content{
		/* height: calc(100vh - 83px); */
		height: 100%;
		box-shadow: none;
		border-radius: 0;
		margin-left: 0;
	}
	.popup1.in,.popupck.in{
		padding-left: 0;
		background: transparent;
	}
	.popup1 .modal-dialog,.popupck .modal-dialog{
		width: 100%;
		padding-bottom: 50px;
		padding-top: 45px;
	}
	.popup1 .modal-content,.popupck .modal-content{
		/* height: calc(100vh - 83px); */
		height: 100%;
		box-shadow: none;
		border-radius: 0;
		margin-left: 0;
	}
	.popup2.in{
		padding-left: 0;
		background: transparent;
	}
	.popup2 .modal-dialog{
		width: 100%;
		padding-bottom: 50px;
		padding-top: 45px;
	}
	.popup2 .modal-content{
		/* height: calc(100vh - 83px); */
		height: 100%;
		box-shadow: none;
		border-radius: 0;
		margin-left: 0;
	}
	.aside{
		display: none;
	}
	.footer-default{
		display: none;
	}
	.footer-nice span>i{
		padding: 16px 20px;
		font-size: 17px;
		color: #737373;
	}
	.footer-mobile>div{
		padding: 0;
		margin: 0 auto;
	}
	.footer-nice.cwhite span>i{
		color: #fff;
	}
	.aside-sub{
		display: none;
	}
	.dashboard{
		height: calc(100vh - 96px);
		margin-left: 0;

	}
	.picture-center{
		width: 100%;
		height: 50vh;
		
	}
	.picture-center video {
		height: 100%!important;
	}
	.picture-center img{
		height: 100%;
		object-fit: cover;
	}
	button.button.quiz-test{
		display: none;
	}
	.pencil{
		display: block;
		/*position: absolute;
	    padding: 12px 20px;
	    background: #80bdd0;
	    border-radius: 100%;
	    right: 50%;
	    transform: translateX(-50%);
	    -webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	    bottom: 25px;
	    width: 56px;
	    color: #fff;
	    height: 56px;*/
	}
	.menu-mobile{
		color: #fff;
		padding-left: 46px;
		z-index: 1252;
	}
	.menu-mobile .modal-dialog{
		margin: 0;
	}
	.menu-mobile .modal-dialog{
		background: #108bb1;	
		height: 100%;
	}
	.menu-mobile .modal-content{
		background: transparent;
		border: none;
		border-radius: 0;
		box-shadow: none;
	}
	.menu-mobile .modal-body{
		padding: 0 10px;
		height: calc(100vh - 50px);
	}
	.left-les{
		width: 100%;
	}
	.navigation ul li{
		font-size: 12px;
		padding: 8px 5px;
	}
	.navigation ul li.close-nav{
		background: transparent;
	}
	.left-les p.last.ec{
		margin-right: 0;
	}
	.left-les p.last{
		margin-right: 52px;
	}
	.left-les p.last1.ec{
		margin-right: 0;
	}
	.left-les p.last1{
		margin-right: 52px;
	}
	.menu-mobile .footer-aside {
		width: 100%;
		position: relative;
		bottom: 0;
		overflow: hidden;
		height: 50px;
		background: #02627c;
	}
	.menu-mobile .footer-aside ul li {
		float: left;
		padding: 1px 14px;
		border-left: 1px solid #0a6780;
		line-height: 21px;
	}
	.menu-mobile .footer-aside ul li:first-child{
		float: right;
		padding-left: 15px;
		padding: 15px;
		padding-right: 5px;
		font-size: 18px;
	}
	.lession-1{
		width: 100%;
		height: 100%;
		background: #f0f0f0;
		padding: 30px 15px;
	}
	.print .lession-1 {
		overflow-y: scroll;
	}
	.submit-btn p{
		margin-right: 0;
		width: 47%;
	}
	.submit-btn p.prev{
		float: right;
	}
	button.button.quiz-test-btn{
		width: 100%;
		margin-top: 20px;
	}
	.finish{
		margin-left: 0;
	}
	#myModal.finish .modal-dialog{
		width: 100%;
		margin: 30% auto;
	}
	#myModal .modal-content{
		padding: 20px;
	}
	.print{
		width: 100%;
		margin-left: 0;
	}
	.blue{
		width: 100%;
	}
	.result_test{
		float: right;
	}
	.upcc{
		margin-right: 0;
		width: 48%;
		height: 48px;
		line-height: 48px;
	}
	.finish h5{
		font-size: 28px;
		line-height: 28px;
	}
	.finish .btn{
		width: 100%
	}
	.result>.col-md-6 i.fa{
		display: none;
	}
	#result_test{
		/* display: block; */
		display: none;
		position: relative;
		margin-left: 0;
		width: 100%;
		overflow: hidden;
		min-height: calc(100vh - 86px);
		height: auto;
		/* top: 200%;
		transition: top 1s ease, margin-left 1s ease; */
	}
	.result{
		width: 100%;
	}
	.result_tk{
		width: 100%;
	}
	.agains{
		width: 90%;
	}
	#result_test.showTranslateY{
	   /*  position: absolute;
    	top: 46px;
    	overflow: initial; */
    }
    .footer-nice{
    	position: fixed;
    }
    body.overflow{
    	overflow: auto;
    }
    .mot,.hai{
    	display: none;
    }
    .result{
    	margin-bottom: 0;
    }
    .mau{
    	width: 200%;
    }
    .khung,.icon-after{
    	width: 100%;
    }
    .result,.summary,.tk,.result_tk{
    	background: #f0f0f0;
    }
    .summary{
    	padding: 0 30px;
    }
    .tabs-result:hover, .tabs-result.active{
    	background: transparent;
    }
    .details table{
    	display: none;
    }
    .table-mobile{
    	display: block;
    	text-align: left;
    	padding-left: 30px;
    	padding-bottom: 50px;
    }
    .object h5{
    	font-size: 20px;
    	margin-bottom: 0;
    	font-weight: 700;
    }
    .tabs-result{
    	padding: 12px 10px 10px;
    }
    .register .right-form input[name='nc']{
    	width: 95%;
    }

}
@media ( max-width: 360px ){
	div.text-chucmung{
		font-size: 18px;
		margin-top: 20%;
	}
	div.text-chucmung2{
		font-size: 18px;
		margin-top: 27%;
	}
	.hide-menu.menu-hide{
		/* margin-top: -46px; */
	}
	.pencil {
		top: 5px;
		padding: 9px 18px;
		width: 48px;
		height: 48px;
	}
}
@media ( width: 320px ){
	.left-les p.last {
		margin-right: 0px;
	}
	.left-les p.last1 {
		margin-right: 0px;
	}
}
/*---------------------------------responsive for singin--------------------------------*/
@media (width: 1366px ) and (height: 1024px){
	div.text-chucmung{
		font-size: 44px;
	}
	div.text-chucmung2{
		font-size: 44px;
	}
	.footer-singin p{
		margin-bottom: 40px;
	}
	#signin{
		background-position: left top;
	}
	.cc-logo{
		padding: 45px 15px;
	}
	.logo img{
		/* width: 40%; */
	}
}


/* Tablet Landscape ( min-width: 981px ) and ( max-width: 1099px ) */
@media (height: 1366px) and (width: 1024px) {
	div.text-chucmung{
		font-size: 30px;
	}
	div.text-chucmung2{
		font-size: 30px;
	}
	.footer-singin p{
		margin-bottom: 70px;
	}
	.cc-logo{
		padding: 70px 15px;
	}
	.logo img{
		/* width: 50%; */
	}
}
@media ( min-width: 981px ) and ( max-width: 1099px ) and (max-height: 1099px){
	.logo{
		padding: 0;
	}
	.container.cc-logo{
		padding: 30px 15px;
	}
	#signin{
		background-position: center left;
	}
}

/* Tablet Portrait ( min-width: 768px ) and ( max-width: 980px ) */
@media ( min-width: 1200px )and ( max-width: 1339px ){
	div.text-chucmung{
		margin-top: 5%;
	}
	div.text-chucmung2{
		margin-top: 11%;
	}
}
@media ( min-width: 1340px )and ( max-width: 1599px ){
	div.text-chucmung{
		margin-top: 5%;
	}
	div.text-chucmung2{
		margin-top: 10%;
	}
}
@media (min-width: 1600px ) and ( max-width: 2199px ){
	div.text-chucmung{
		margin-top: 4%;
	}
	div.text-chucmung2{
		margin-top: 8%;
	}
}
@media (min-width: 2200px ) and ( max-width: 2699px ){
	div.text-chucmung{
		margin-top: 3%;
	}
	div.text-chucmung2{
		margin-top: 6%;
	}
}
@media (min-width: 2700px )and ( max-width: 2999px ){
	div.text-chucmung{
		margin-top: 3%;
	}
	div.text-chucmung2{
		margin-top: 6%;
	}
}
@media (min-width: 3000px ){
	div.text-chucmung{
		margin-top: 4%;
	}
	div.text-chucmung2{
		margin-top: 7%;
	}
}
@media ( min-width: 768px ) and ( max-width: 980px ) {
	div.text-chucmung{
		font-size: 30px;
	}
	div.text-chucmung2{
		font-size: 30px;
	}
	.logo{
		padding: 0;
	}
	.container.cc-logo{
		padding: 70px 15px;
	}
	.footer-singin p{
		/*margin-bottom: 40px;*/
	}
}


/* Mobile ( max-width: 767px ) (edited) */
@media ( max-width: 600px ){
#pcmante{
	display: none!important;
	}
	#mobimante{
		display: block!important;
	}
}
@media ( max-width: 767px ){
	
	.modalmakequest {
		margin-left: 0!important;
		height: 100%!important;
	}
	.show_print1 {
		margin-top: -55px;
	}
	#detail {
		width: 100%!important;
	}
	.left-content-signin{
		display: none;
	}
	.form-group{
		width: 100%;
	}
	.right-form{
		width: 100%;
	}
	.cc-logo{
		padding: 25px 15px;
	}
	.cc-logo1{
		padding: 10px 15px;	
	}
	.logo{
		padding: 0;
	}
	.footer-singin{
		padding: 0 15px;
	}
	.footer-singin h1{
		/*font-size: 44px;*/
		font-size: 35px;
	}
	.footer-singin p{
		/*font-size: 28px;*/
		font-size: 20px;
		margin-bottom: 15px;
	}
	.right-form{
		padding: 10px;
		border-radius: 10px;
	}
	#signin .container{
		padding: 0 10px;
	}
	.notice{
		padding-left: 7px;
	}
	.chuaco{
		display: block;
	}
	.daco{
		padding: 6px;
	}
	.right-form h5{
		padding-top: 5px;
	}
	.register .right-form>a{
		margin: 12px 5px 7px;
		width: 45%;
		
		display: inline-block;
		color: #fff;
		background: #008ab0;
	}
	#myModal.success-modal .modal-dialog{
		width: 100%;
		margin: 0;
		margin-top: 60px;
	}
	#myModal.success-modal .modal-dialog .modal-content{
		padding-top: 0px;
		padding-bottom: 0px;
		border-radius: 30px;
		margin: 15px;
		overflow: hidden;
		height: 100%;
	}
	#myModal .modal-content, .content-modal{
		/* background: #fff; */
		background-size: cover;
	}
	#myModal .modal-header{
		padding: 35px 15px 5px;
	}
	#myModal .modal-title{
		font-size: 22px;
	}
	.register .right-form>span{
		display: none;
	}
	.success-modal .modal-body{
		padding: 5px 5px 15px;
	}
	#myModal.ht .modal-dialog{
		width: 94%;
	}
}
@media (width: 320px){
	.show_print {
		/*width: 50px;
	    height: 46px;
	    margin-left: 50px;*/
	}
	.popup .modal-header {
		padding-top: 15px;
		padding-bottom: 10px;
	}
	.popup1 .modal-header,.popupck .modal-header {
		padding-top: 15px;
		padding-bottom: 10px;
	}
	.popup2 .modal-header {
		padding-top: 15px;
		padding-bottom: 10px;
	}
	.lession-1{
		padding: 10px;
	}
	.lession-1 h5{
		padding-bottom: 0;
		padding-top: 4px;
	}
	.lession-1 p{
		padding-bottom: 0;
	}
	.submit-btn{
		padding-top: 10px;
	}
	.submit-btn p:nth-of-type(2){
		margin-left: 18px;
	}
	.finish h5{
		font-size: 24px;
	}
	.table-mobile{
		padding-left: 10px;
	}
	.result{
		padding: 5px 10px 15px;
	}
	.tk{
		padding-left: 10px;
	}
	.tabs-result{
		padding: 12px 6px 10px;
	}
	#myModal .modal-header{
		padding: 20px 0px 0px;
	}
	.success-modal .modal-body{
		padding: 15px 5px 15px;
	}
	#myModal .modal-title{
		font-size: 20px;
	}
	.footer-singin h1{
		font-size: 38px;
	}
	.footer-singin p{
		font-size: 24px;
	}
	.cc-logo{
		padding: 10px 15px;
	}
	.rel{
		position: relative;
		z-index: 1050;
	}
	.register .right-form>a{
		margin: 12px 0px 7px;
		width: 49%;
		font-size: 12px;
	}
}

input.errorform::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:    #f44336;
}
input.errorform:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:    #f44336;
	opacity:  1;
}
input.errorform::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:    #f44336;
	opacity:  1;
}
input.errorform:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:    #f44336;
}
input.errorform::-ms-input-placeholder { /* Microsoft Edge */
	color:    #f44336;
}
.errorform{
	color: red;
}
input.errorform::placeholder { /* Most modern browsers support this now. */
	color:    #f44336;
}
.group {
	display: inline-flex;
	flex-direction: column;
	text-align: center;
	-webkit-border-radius: 2px;
	-webkit-border-top-right-radius: 2px;
	-webkit-border-bottom-left-radius: 2px;
	-moz-border-radius: 2px;
	-moz-border-radius-topright: 2px;
	-moz-border-radius-bottomleft: 2px;
	border-radius: 2px;
	border-top-right-radius: 2px;
	border-bottom-left-radius: 2px;
	background-color: #9262ff66;
	padding: 5px;
	width: 75px;
	height: 91px;
}
.separator {
	font-weight: 300;
	font-size: 3em;
	margin-right: 5px;
	font-family: "proxima-nova",sans-serif;
	margin-left: 5px;
}
.number {
	font-size: 24px;
	color: #fff;
	padding: 15px 0;
}
.label {
	width: 100%;
	font-size: 11px;
	letter-spacing: 1px;
	padding: 5px 0 15px;
	text-transform: uppercase;
	-webkit-border-bottom-right-radius: 2px;
	-webkit-border-bottom-left-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-right-radius: 2px;
	border-bottom-left-radius: 2px;
}
.show_print{
	color:#14f44b;
	cursor: pointer;
}
.show_print:hover{
	color: #3affcf;
}
.fa-bars{
	display: inline-table;
}
.fa-download{
	display: inline-table;
}

@keyframes color-animation {
	0% {
		color: yellow;
	}
	50% {
		color:#ed008b;
	} 
	100% {
		color: yellow;
	} 
}
@keyframes  background  {
	0% {
		background-image: url('/templates/Nushin/images/phaohoa.gif');
	}

	100% {
		background-image: none;
	} 
}

100% {
	background: none;
} 
}
#ttbutton {
	color: #1694b7;
}
.modalmakequest h5{
	text-align: center;
	color: #1694b7;
	font-weight: 700;
	font-size: 36px;
	line-height: 30px;
	padding-bottom: 20px;
}
.modalmakequest{
	margin-left: 30%;
	color: black;
	height: calc(100vh - 86px);
}
.modalmakequest #makeq1{
	left: 15px;
	border: 1px solid;
	/* margin-top: 43px; */
	margin-bottom: 10px;
}
.modalmakequest .modal-footer{
	border-top:0;
}
.modalmakequest textarea{
	width: 100%;
	margin-top: 5px;
}
.btnok{
	text-align: center;
}
#sendokay{
	text-align: center;
}
#selectcate{
	width: 60%;
}
.nodisplay{
	display: none;
}

.imgupload1{
	line-height: 10px;
}
#mobimante{
	display: none;
}
#pcmante{
	display: block;
}
@media ( min-width: 1100px )and ( max-width: 1199px ){
	div.text-chucmung{
		margin-top: 8%;
	}
	div.text-chucmung2{
		margin-top: 13%;
	}
}
@media ( min-width: 1100px ){
	div.text-chucmung{
		font-size: 33px;
	}
	div.text-chucmung2{
		font-size: 33px;
	}
}
/* Tablet Landscape ( min-width: 981px ) and ( max-width: 1099px ) */

@media ( min-width: 981px ) and ( max-width: 1099px ) {
	div.text-chucmung{
		font-size: 33px;
		margin-top: 8%;
	}
	div.text-chucmung2{
		font-size: 33px;
		margin-top: 13%;
	}
	.menu-hide marquee#finish1 {
		width: 248px;
	}
	.navigation ul {
		padding-left: 0;
	}
}
@media ( min-width: 370px ) and ( max-width: 766px ) {
	div.text-chucmung2 {
		margin-top: 18%;
	}
}

/* Tablet Portrait ( min-width: 768px ) and ( max-width: 980px ) */
@media ( min-width: 768px ) and ( max-width: 980px ) {
	div.text-chucmung {
		margin-top: 8%;
	}
	div.text-chucmung2 {
		margin-top: 13%;
	}
	.menu-hide marquee#finish1 {
		width: 200px;
	}
	.show_print {
		margin-left: 0;
	}
	.navigation ul li {
		padding: 8px 3px;
	}
	.navigation ul {
		padding-left: 0;
	}
}
#datcauhoi .modal-dialog {
	width: auto;

}
.modalmakequest.modal.in {
	display: flex!important;
	align-items: center;
}
.modalmakequest.modal {
	display: none!important;
}
.menu-mobile.in {
	display: block;
}
.img-uploaded{
	width: 160px;
	height: 200px;
	float: right;
}
.opacity1.traslateY-100 {
	transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
}
.print.success-12 {
	/* transform: translateY(-240%);
    -webkit-transform: translateY(-240%);
    -ms-transform: translateY(-240%);
    -moz-transform: translateY(-240%); */
    transform: initial;
    -webkit-transform: initial;
    -ms-transform: initial;
    -moz-transform: initial;
}
.bgt i {
	text-align: center;
	background-color: #108bb1;
	width: 46px;
	height: 46px;
	padding-top: 15px;	
}
.ph-12 {
	animation: color-animation 55s linear infinite alternate/*, background 5s linear 3 alternate */;
	/*bg-taichungchi-nonetext.gif*/
	/*chucmung.gif*/
	background: url(/templates/Nushin/images/bg-taichungchi-nonetext.gif) no-repeat #fff;
	background-position: center ;
	background-size: contain;

}
.congg1{
	/* font-weight: bold; */
	font-size: 18px;
	text-transform: uppercase;
	background-color: rgb(16, 139, 177);
	padding: 10px 15px;
	color: #fff;
	border-radius: 30px;
	box-shadow: 1px 2px 2px #ddd;
	margin: 0;
}
.congg1:hover {
	color: #fff;
	text-decoration: none;
}

.ph-12 #finish1 {
	font-size: 26px;
	font-weight: 700;
	animation: color-animation 55s linear infinite alternate;
}
.print .lession-1.ph-12 {
	overflow: hidden;

}
.bgt.bgt1 {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 200px;
}
@media (max-width: 767px) {
	.print .lession-1.ph-12 {
		overflow-y: scroll;
		height: 75%;
	}
	.opacity1.traslateY-100 {
		transform: translateY(0);
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
	}
	a.show_print1.show_print.click-hide {
		margin: 0;
	}
	.congg1 {
		padding: 2px 20px;
	}
}
p.ndt #finish1{
	background: #00000069!important;
	padding: 7px;
}
.btn-default-nuskin a {
	display: inline-flex;
	padding: 0px 15px;
	justify-content: center;
	width: 85px;
	background: rgb(16, 139, 177);
	border: 1px solid rgb(16, 139, 177);
	color: #fff;
	border-radius: 30px;
	/* box-shadow: 1px 2px 2px #ddd; */
	margin-right: 15px;

	text-decoration: none;

}
.btn-default-nuskin  {
	display: inline;
}
.btn-default-nuskin a:hover {
	background: rgb(16, 139, 177); 
	color: #fff;
}
.cc-card span {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 35px;
	height: 35px;
	margin-right: 8px;
	border: 1px solid rgb(16, 139, 177);
	border-radius: 50%;
	color: rgb(16, 139, 177);
}
button.close.close-modal-custom {
	position: absolute;
	top: 30px;
	right: 30px;
	width: 30px;
	height: 30px;
	background: rgb(16, 139, 177);
	z-index: 1;
	opacity: 1;
	font-size: 16px;
	color: #fff;
	text-shadow: none;
}
#myModal12 .modal-content, #myModal123 .modal-content {
	border-radius: 20px;	
	background: url('../images/icon-loi-tai-anh.png') no-repeat #fff;
	background-position: left bottom;
	/*background-size: contain;*/
}
.subtract-new h5 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
}
.cc-card.mt-20 {
	margin-top: 20px;
}
.dta {
	padding: 10px 0;
	display: flex;
	justify-content: flex-end;
	clear: both;
	margin-bottom: 0;
}
.dta span {
	line-height: 17px;
	color: #ccc;
	font-size: 12px;
	margin: 0;
	margin-left: 6px;
}
.dta span.show_print {
	color: #121111;
}
.dta .span-1st {
	font-size: 16px;
	width: 31px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #ccc;
	

}
.d-block {
	display: block;
}
.dta i.d-block{
	font-size: 10px;
}
#myModal12 .modal-dialog, #myModal123 .modal-dialog {
	width: 700px;
}
.pding-15 {
	padding: 15px;
}
@media (max-width: 980px) and (min-width: 768px) {
	.dta {
		justify-content: flex-start;
		clear: none;
		padding-left: 10px;
	}
	.img-uploaded {
		float: left;
	}
	#myModal12 .modal-dialog, #myModal123 .modal-dialog {
		width: 100%;
	}
}
@media (max-width: 767px) {
	.dta {
		justify-content: flex-start;
		clear: none;
	}
	.img-uploaded {
		float: left;
	}
	#myModal12 .modal-dialog, #myModal123 .modal-dialog {
		width: 100%;
		height: 70%;
		overflow-y: scroll;
	}
	#myModal12 .modal-content, #myModal123 .modal-content {
		overflow: scroll;
	}
	.dta span.show_print {
		margin-left: 5px;
	}
}
.success-courses {
	position: absolute;
	top: 50px;
	right: 6px;
	width: 318px;
	display: flex;
	align-content: center;
	justify-content: center;
	z-index: 1052;
	background: #fff;
	padding: 6px 12px;
	border-radius: 15px;
	box-shadow: 0px 10px 24px 0px rgba(0, 0, 0, 0.2);
}

.success-courses p {
	position: relative;
	margin-bottom: 0;
	line-height: 20px;
	padding-top: 4px;
	padding-left: 10px;
}
.success-courses p a {
	display: block;
}
.success-courses .close-success-courses {
	position: absolute;
	top: 0;
	right: 0;
	color: #aaaaaa;
}
.success-courses .close-success-courses:hover {
	cursor: pointer;
}
.img1-fig img {
	width: 69px;
}
.print.d-none.traslateY-100.success-12 {
	display: none;
}
.modalmakequest.ml-0 {
	margin-left: 0;
}
@media (max-width: 767px) {
	.success-courses {
		width: 100%;
		right: 0;
	}
	#myModal12 .modal-content, #myModal123 .modal-content {
		height: 100%;
		overflow: inherit;
	}
	#myModal12 .modal-dialog, #myModal123 .modal-dialog {
		width: 100%;
		margin-top: 40%;
	}
	.success-courses p {
		padding-right: 20px;
	}
}	
.blue p{
	padding-bottom: 0;
}
img.line-chungchi{
	width: 100%;
	opacity: 0.5;
}
div.text-chucmung{
	height:  40px;
	color: #008ab0;
	/*font-size: 33px;*/
	font-weight: bold;
	line-height:  35px;
	position:  absolute;
	top: inherit;
	text-align:  center;
	bottom: 0;
	text-transform: uppercase;
}
div.text-batbuoc{
	height:  80px;
	line-height:  40px;
}
div.text-chucmung2{
	height:  40px;
	color: #008ab0;
	/*font-size: 33px;*/
	font-weight: bold;
	line-height:  35px;
	position:  absolute;
	top: inherit;
	text-align:  center;
	bottom: 0;
	text-transform: uppercase;

}
.text-chucmung {
	background-color: #008ab0;
	-webkit-background-clip: text;
	background-size: contain;
	width: 100%;
	text-align: center;
	color: transparent;
}
.text-chucmung::before {
	content: attr(data-heading);
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	background: linear-gradient(45deg, rgba(255, 255, 255, 0) 45%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 55%, rgba(255, 255, 255, 0) 100%);
	-webkit-background-clip: text;
	color: transparent;
	mix-blend-mode: screen;
	-webkit-animation: shine 2s infinite;
	animation: shine 2s infinite;
	background-size: 200%;
}
.text-chucmung2 {
	background-color: #008ab0;
	-webkit-background-clip: text;
	background-size: contain;
	width: 100%;
	text-align: center;
	color: transparent;
}
.text-chucmung2::before {
	content: attr(data-heading);
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	background: linear-gradient(45deg, rgba(255, 255, 255, 0) 45%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 55%, rgba(255, 255, 255, 0) 100%);
	-webkit-background-clip: text;
	color: transparent;
	mix-blend-mode: screen;
	-webkit-animation: shine 2s infinite;
	animation: shine 2s infinite;
	background-size: 200%;
}

@-webkit-keyframes shine {
	0% {
		background-position: 100%;
	}
	100% {
		background-position: -100%;
	}
}

@keyframes shine {
	0% {
		background-position: 100%;
	}
	100% {
		background-position: -100%;
	}
}
/* Not needed for demo */
.text-chucmung {
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	position: absolute;
	font-size: 44px;
	margin: 0;
}
.text-chucmung2 {
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	position: absolute;
	font-size: 44px;
	margin: 0;
}
.finish-light{
	width: 100px;
}
.popup-ct{
	border-radius: 15px!important;
	background-color: #fff!important;
}
.finish-text{
	font-size: 36px;
	font-weight: bold;
	color: rgb(22,148,183)!important;
}
.finishbold{
	font-weight: bold;
} 
p.text-grat{
	color: #333;
	line-height: 20px;
}
.popup-ct a{
	font-size: 16px;
	text-transform: uppercase;
	background-color: rgb(16, 139, 177);
	padding: 15px 35px;
	color: #fff;
	border-radius: 30px;
	/*box-shadow: 1px 2px 2px #ddd;*/
	margin: 0;
	cursor: pointer;
	text-decoration: none;
	line-height: 45px;
}
.close-popup1 i,.close-popupck i{
	float: right;
    color: #828282;
    padding: 10px;
}
.close-popup1:hover, .close-popupck:hover{
	cursor: pointer;
}
.close-popupm i{
	float: right;
    color: #828282;
    padding: 10px;
}
.close-popupm:hover{
	cursor: pointer;
}
.close-popup2 i{
	float: right;
    color: #828282;
    padding: 10px;
}
.close-popup2:hover{
	cursor: pointer;
}
.right-co{
	    line-height: 10px;
    text-align: left;
}
.logouttext a{
	color: #b7b7b7!important;
}
.logouttext a:hover{
	background: none!important;
	color: none!important;
	text-decoration:none!important;
}
.img-profile{
	width: 90px;
	max-width: 90px;
	height: 120px;
}
.left-co{
	padding-right: 0px;
    padding-left: 7px;
    float: left;
    display: inline-block;
    width: 25%;
}
.right-co{
	float: right;
    width: 70%;
}
.edit-profile{
	font-size: 16px;
    color: white;
    right: 0;
    position: absolute;
    background: #008ab0;
    padding: 7px;
}
.left-co{
	position: relative;
}
.top-profile{
	height: 125px;
}
#imgupload{
	position: absolute;
	opacity: 0;

}


.headingTable {
	color: #008ab0;
    font-size: 24px;
}
.table-responsive {
	cursor: pointer;
}
.table-responsive thead tr th {
	font-size: 13px;
	vertical-align: top;
}

.table-responsive tbody tr td {
	vertical-align: middle;
}

@media screen and (max-width: 767px) {
  table caption {
    border-bottom: 1px solid #ddd;
  }
  .headingTable {
	    font-size: 18px;
	    line-height: 24px;
	}
}
.wrapperTableuser {
	width: 700px;
	margin: 0 auto;
}
.panelUser .panelItems {
	display: inline-block;
	margin-left: 10px;
}
.backgroundwrapper {
	background: rgba(255, 255, 255, 0.9);
	padding: 10px;
	margin-top: 5px;
}
.my-custom-scrollbar {
  position: relative;
  max-height: 56vh;
  overflow: auto;
}
table thead {
	background: #cccccc;
	color: #333333;
}    
.table-wrapper-scroll-y {
  display: block;
}
/*.table::-webkit-scrollbar {
  width: 5px;
}
.table::-webkit-scrollbar-track
{
  background: rgba(0, 0, 0, 0.2);
}

.table::-webkit-scrollbar-thumb
{
  background: #008ab0;
}*/
.fa-home{
	font-size: 20px;
	cursor: pointer;
}
.nameKHTable{
	font-size: 20px;
	color:#333;
	font-weight: 500;
}
.megamain {
	position: relative;
}
.megamenuaccount {
	position: absolute;
    right: 41px;
    width: 225px;
    height: auto;
    top: 55px;
    z-index: 9999999;
    text-align: right;
    background: #333;
    padding: 10px;
}
.megamenuaccount:before {
	content: "";
	position: absolute;
    top: -7px;
    right: 18px;
    width: 15px;
    height: 15px;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    background-color: #333;;
}
.megamenuaccount ul {
	padding: 0;
	list-style: none;
}
.megamenuaccount ul li {
	padding: 10px 0;
	border-bottom: 1px dotted #eaeaea;
}
.megamenuaccount ul li:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
.megamenuaccount ul li a:hover {
	text-decoration: none;
}
.megamenuaccount ul li a {
	color: white;
}

.quick-alo-phone{
	/*display: none;*/
}

.quick-alo-phone.quick-alo-static {
	opacity:.6;
}
.quick-alo-phone.quick-alo-hover,
.quick-alo-phone:hover {
	opacity:1;
}
.quick-alo-ph-circle {
	width:30px;
	height:30px;
	top:1px;
	left:110px;
	position:absolute;
	background-color:transparent;
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	border-radius:100%;
	border:2px solid rgba(30,30,30,0.4);
	border:2px solid #bfebfc 9;
	opacity:.1;
	-webkit-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
	-moz-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
	-ms-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
	-o-animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
	animation:quick-alo-circle-anim 1.2s infinite ease-in-out;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s;
	-webkit-transform-origin:50% 50%;
	-moz-transform-origin:50% 50%;
	-ms-transform-origin:50% 50%;
	-o-transform-origin:50% 50%;
	transform-origin:50% 50%;
}
.quick-alo-phone.quick-alo-active .quick-alo-ph-circle {
	-webkit-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
	animation:quick-alo-circle-anim 1.1s infinite ease-in-out !important;
}
.quick-alo-phone.quick-alo-static .quick-alo-ph-circle {
	-webkit-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
	animation:quick-alo-circle-anim 2.2s infinite ease-in-out !important;
}
.quick-alo-phone.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone:hover .quick-alo-ph-circle {
	border-color:#00aff2;
	opacity:.5;
}
.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-circle {
	border-color:red;
	border-color:#baf5a7 9;
	opacity:.5;
}
.quick-alo-phone.quick-alo-green .quick-alo-ph-circle {
	border-color:red;
	border-color:#bfebfc 9;
	opacity:.5;
}
.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-circle,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-circle {
	border-color:#ccc;
	opacity:.5;
}
.quick-alo-phone.quick-alo-gray .quick-alo-ph-circle {
	border-color:#75eb50;
	opacity:.5;
}
.quick-alo-ph-circle-fill {
	width:20px;
	height:20px;
	top:6px;
	left:115px;
	position:absolute;
	background-color:#000;
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	border-radius:100%;
	border:2px solid transparent;
	opacity:.1;
	-webkit-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
	-moz-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
	-ms-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
	-o-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
	animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s;
	-webkit-transform-origin:50% 50%;
	-moz-transform-origin:50% 50%;
	-ms-transform-origin:50% 50%;
	-o-transform-origin:50% 50%;
	transform-origin:50% 50%;
}
.quick-alo-phone.quick-alo-active .quick-alo-ph-circle-fill {
	-webkit-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
	animation:quick-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
}
.quick-alo-phone.quick-alo-static .quick-alo-ph-circle-fill {
	-webkit-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
	animation:quick-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
	opacity:0 !important;
}
.quick-alo-phone.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone:hover .quick-alo-ph-circle-fill {
	background-color:rgba(0,175,242,0.5);
	background-color:#00aff2 9;
	opacity:.75 !important;
}
.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-circle-fill {
	background-color:rgba(236, 38, 38, 0.5);
	background-color:#baf5a7 9;
	opacity:.75 !important;
}
.quick-alo-phone.quick-alo-green .quick-alo-ph-circle-fill {
	background-color:rgba(236, 38, 38, 0.5);
	background-color:#a6e3fa 9;
	opacity:.75 !important;
}
.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-circle-fill,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-circle-fill {
	background-color:rgba(204,204,204,0.5);
	background-color:#ccc 9;
	opacity:.75 !important;
}
.quick-alo-phone.quick-alo-gray .quick-alo-ph-circle-fill {
	background-color:rgba(117,235,80,0.5);
	opacity:.75 !important;
}
.quick-alo-ph-img-circle {
	width:10px;
	height:10px;
	top:11px;
	left:120px;
	position:absolute;
	/*background:rgba(30,30,30,0.1) url("https://i.imgur.com/YWJeVO2.png") no-repeat center center;*/
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	border-radius:100%;
	border:2px solid transparent;
	opacity:.7;
	-webkit-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
	-moz-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
	-ms-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
	-o-animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
	animation:quick-alo-circle-img-anim 1s infinite ease-in-out;
	-webkit-transform-origin:50% 50%;
	-moz-transform-origin:50% 50%;
	-ms-transform-origin:50% 50%;
	-o-transform-origin:50% 50%;
	transform-origin:50% 50%;
}
.quick-alo-phone.quick-alo-active .quick-alo-ph-img-circle {
	-webkit-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
	animation:quick-alo-circle-img-anim 1s infinite ease-in-out !important;
}
.quick-alo-phone.quick-alo-static .quick-alo-ph-img-circle {
	-webkit-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
	-moz-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
	-ms-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
	-o-animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
	animation:quick-alo-circle-img-anim 0s infinite ease-in-out !important;
}
.quick-alo-phone.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone:hover .quick-alo-ph-img-circle {
	background-color: red;
}
.quick-alo-phone.quick-alo-green.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone.quick-alo-green:hover .quick-alo-ph-img-circle {
	background-color:red;
}
.quick-alo-phone.quick-alo-green .quick-alo-ph-img-circle {
	background-color:red;
}
.quick-alo-phone.quick-alo-gray.quick-alo-hover .quick-alo-ph-img-circle,
.quick-alo-phone.quick-alo-gray:hover .quick-alo-ph-img-circle {
	background-color:#ccc;
}
.quick-alo-phone.quick-alo-gray .quick-alo-ph-img-circle {
	background-color:#75eb50;
}
@-moz-keyframes quick-alo-circle-anim {
	0% {
		-moz-transform:rotate(0) scale(.5) skew(1deg);
		opacity:.1;
		-moz-opacity:.1;
		-webkit-opacity:.1;
		-o-opacity:.1;
	}
	30% {
		-moz-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.5;
		-moz-opacity:.5;
		-webkit-opacity:.5;
		-o-opacity:.5;
	}
	100% {
		-moz-transform:rotate(0) scale(1) skew(1deg);
		opacity:.6;
		-moz-opacity:.6;
		-webkit-opacity:.6;
		-o-opacity:.1;
	}
}
@-webkit-keyframes quick-alo-circle-anim {
	0% {
		-webkit-transform:rotate(0) scale(.5) skew(1deg);
		-webkit-opacity:.1;
	}
	30% {
		-webkit-transform:rotate(0) scale(.7) skew(1deg);
		-webkit-opacity:.5;
	}
	100% {
		-webkit-transform:rotate(0) scale(1) skew(1deg);
		-webkit-opacity:.1;
	}
	}
	@-o-keyframes quick-alo-circle-anim {
	0% {
		-o-transform:rotate(0) kscale(.5) skew(1deg);
		-o-opacity:.1;
	}
	30% {
		-o-transform:rotate(0) scale(.7) skew(1deg);
		-o-opacity:.5;
	}
	100% {
		-o-transform:rotate(0) scale(1) skew(1deg);
		-o-opacity:.1;
	}
}
@-moz-keyframes quick-alo-circle-fill-anim {
	0% {
		-moz-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
	50% {
		-moz-transform:rotate(0) -moz-scale(1) skew(1deg);
		opacity:.2;
	}
	100% {
		-moz-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
}
@-webkit-keyframes quick-alo-circle-fill-anim {
	0% {
		-webkit-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
	50% {
		-webkit-transform:rotate(0) scale(1) skew(1deg);
		opacity:.2;
	}
	100% {
		-webkit-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
}
@-o-keyframes quick-alo-circle-fill-anim {
	0% {
		-o-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
	50% {
		-o-transform:rotate(0) scale(1) skew(1deg);
		opacity:.2;
	}
	100% {
		-o-transform:rotate(0) scale(.7) skew(1deg);
		opacity:.2;
	}
}
@-moz-keyframes quick-alo-circle-img-anim {
	0% {
		transform:rotate(0) scale(1) skew(1deg);
	}
	10% {
		-moz-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-moz-transform:rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-moz-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-moz-transform:rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-moz-transform:rotate(0) scale(1) skew(1deg);
	}
	100% {
		-moz-transform:rotate(0) scale(1) skew(1deg);
	}
}
@-webkit-keyframes quick-alo-circle-img-anim {
	0% {
		-webkit-transform:rotate(0) scale(1) skew(1deg);
	}
	10% {
		-webkit-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-webkit-transform:rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-webkit-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-webkit-transform:rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-webkit-transform:rotate(0) scale(1) skew(1deg);
	}
	100% {
		-webkit-transform:rotate(0) scale(1) skew(1deg);
	}
}
@-o-keyframes quick-alo-circle-img-anim {
	0% {
		-o-transform:rotate(0) scale(1) skew(1deg);
	}
	10% {
		-o-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	20% {
		-o-transform:rotate(25deg) scale(1) skew(1deg);
	}
	30% {
		-o-transform:rotate(-25deg) scale(1) skew(1deg);
	}
	40% {
		-o-transform:rotate(25deg) scale(1) skew(1deg);
	}
	50% {
		-o-transform:rotate(0) scale(1) skew(1deg);
	}
	100% {
		-o-transform:rotate(0) scale(1) skew(1deg);
	}
}

.quick-alo-phone {
	display: none;
	/*position: fixed;*/
	background-color: transparent;
/*	width: 150px;
	height: 150px;*/
	cursor: pointer;
	z-index: 200000 !important;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateZ(0);
	-webkit-transition: visibility .5s;
	-moz-transition: visibility .5s;
	-o-transition: visibility .5s;
	transition: visibility .5s;/*
	right: 150px;
	bottom: 90px;*/
}
.activenotify .quick-alo-phone {
	display: block;
}

.notifyicon {
	position: absolute;
    right: -20px;
    width: 225px;
    height: auto;
    top: 26px;
    z-index: 9999999;
    text-align: center;
    padding: 10px;
    color: red;
}
.notifyicon i {
	position :relative;
  -webkit-animation: mymove 1s infinite; /* Safari 4.0 - 8.0 */
  animation: mymove 1s infinite;
  font-size: 18px;
}
.notifyicon p.textNoti {
	box-shadow: -1px 0px 6px #eaea;
}
.megamain li {
	cursor: pointer;
}
.megamenuaccount a {
	display: block;
}
.notifyicon.dNone {
	display: none;
}
.hasMegamenu {
  /*position :relative;*/
  /*-webkit-animation: mymove 1s infinite; /* Safari 4.0 - 8.0 */*/
  /*animation: mymove 1s infinite;*/
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes mymove {
  	0%   {bottom: 0px;}
    25%  {bottom: 2px;}
    50%  {bottom: 4px;}
    75%  {bottom: 6px;}
    100% {bottom: 8px;}
}
@keyframes mymove {
    0%   {bottom: 0px;}
    25%  {bottom: 2px;}
    50%  {bottom: 4px;}
    75%  {bottom: 6px;}
    100% {bottom: 8px;}
}

.table {
	margin-bottom: 0;
}

.ketquathi .tit-result {
    font-size: 24px!important;
    font-weight: bold;
    color: rgb(16,139,177);
    margin-bottom: 25px!important;
    line-height: 35px!important;
    text-transform: uppercase;
}
.ketquathi .tit-result span {
	text-transform: uppercase;
}
.info-cus {
    padding-bottom: 30px;
}
.info-cus p {
    margin-bottom: 10px;
    line-height: 24px;
    font-size: 16px;
}
.ketquathi p {
	line-height: 24px;
    font-size: 16px;
}
.info-cus .nor-text , .nor-text1  {
    font-size: 16px;
    width: 400px;
    float: left;
}
.ketquathi .fa-times-circle {
    color: rgb(244,67,54);
    font-size: 18px!important;
}

.info-cus .bol-text{
    font-size: 16px;
    font-weight: bold;
}
.info-cus .name-text {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: bold;
}
.true-q {
    color: black;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}
.tit-result-detail {
    position: relative;
    padding: 15px;
    background-color: #30223223;
    font-weight: bold;
    margin-bottom: 0px!important;
    color: rgb(16,139,177);
    font-size: 16px;
}
.questions1 {
    padding-top: 20px;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #ececec;
    border-top: 0;
}
.question-as {
    font-size: 18px;
    font-weight: bold;
    color: rgb(16,139,177);
    text-transform: uppercase;
}
.fa-check-circle {
    color: rgb(76,175,80);
    font-size: 18px!important;
}
.questions1 .radio {
	margin-left: 10px;
}
.radio label {
    width: 97%;
    display: inline-block;
    position: relative;
    padding-left: 5px;
    font-size: 16px;
    line-height: 33px;
}
.true-q {
    color: black;
    text-transform: uppercase;
    font-weight: bold !important;
    font-size: 14px;
}
.ovfX {
	max-height: 390px;
	overflow-y: auto;
}
.pos-right{
	position: absolute;
    width: 15%;
    right: 0;
    top: 0;
}
.stt_table {
	min-width: 40px;
	max-width: 40px;
	width: 40px;
}
.baigiang_table {
	min-width: 200px;
	max-width: 200px;
	width: 200px;
}
.noidungcauhoi_tb {
	min-width: 200px;
	max-width: 200px;
	width: 200px;
}
.noidungtl_tb {
	min-width: 300px;
	max-width: 300px;
	width: 300px;
}

.ngaynhan_tb, .ngay_table {
	min-width: 145px;
	max-width: 145px;
	width: 145px;
}
@keyframes gif {
   0%   { 
  -webkit-box-shadow: 0px 0px 8px red; 
          box-shadow: 0px 0px 8px red;
    }


   60% {
  -webkit-box-shadow: 0px 0px 0px;
          box-shadow: 0px 0px 0px;

   }

  100% { 
  -webkit-box-shadow: 0px 0px 8px red; 
          box-shadow: 0px 0px 8px red;
  }
}


@-webkit-keyframes gif {
   0%   { 
  -webkit-box-shadow: 0px 0px 8px red; 
          box-shadow: 0px 0px 8px red;
    }


   60% {
  -webkit-box-shadow: 0px 0px 0px;
          box-shadow: 0px 0px 0px;

   }

  100% { 
  -webkit-box-shadow: 0px 0px 8px red; 
          box-shadow: 0px 0px 8px red;
  }
}
.warningname {
	-webkit-animation: gif 1s infinite;
    animation: gif 1s infinite;
}
/*
.topthucc{
	text-align: center;

.thubold{
	font-weight: bold;
}
#thucamket{
	font-family: Tahoma;
	line-height: 20px;
	height: 500px;
	overflow-y:auto;

}
.botthucc {
	width: 300px;
	text-align: center;
	float: right;
	margin-right: 100px;
}
.clear {
	clear: both;
}
.hrthu{
	line-height: 0;
}
.mrgbtm0{
	margin-bottom: 0;
}
.mrgt20{
	margin-top: 50px;
}
.textitalic{
	font-style: italic;
}
.bodythucc{
	text-align: left;
	padding: 0 30px;
}
.bodythucc p {
	display: flex;

}
.bodythucc p span.dotte {
	flex-grow: 1;
	border-bottom: 1px dotted;
	padding-bottom: 0px;
	padding-left: 50px;
}
}*/
.inlineblock{
	    min-width: 200px;
    display: inline-block;
}
.mgtop50{
	margin-top: -50px;
}

.right-form__group{
	display: flex;
	justify-content: space-between;
}
.right-form__group input{
	flex-basis: 75%;
}
.right-form__get{
	flex-basis: 23%;
	background-color: #289BBA !important;
	color: white !important;
	border-radius: 4px !important;
	white-space: nowrap;
}
#noti-verify{
	color: red;
}
.slider-question .more-info input{
	border: unset;
    border-bottom: 1px solid black;
    outline: none;
    margin-left: 10px;
}

.btn__block{
	display: flex;
	align-items: center;
	justify-content: center;
}
.btn__block .dn{
	width: 196px !important;
    margin: 0 6px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn__block .dn:hover{
    color: #fff;
    background: #008ab0;
}
@media (max-width: 1023px) {
	.btn__block .dn{
		width: 120px !important;
	}
}
.popup__continue__modal,
.popup__policy__modal
{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color:rgba(0, 0, 0, 0.8);
	z-index: 2;
	transition: all ease-in 0.2s ;
}
.popup__continue__modal--toggle,
.popup__policy__modal--toggle
{
	opacity: 0;
	pointer-events: none;
}
.popup__continue,
.popup__policy
{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	border-radius: 10px;
	max-width: 420px;
	transition: all ease-in-out 0.2s ;
}
.popup__continue--toggle,
.popup__policy--toggle
{
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) scale(0.8);
}
.popup__continue p,
.popup__policy p
{
	padding: 8px 0;
}
.popup__choose,
.popup__after{
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 2;
	border-radius: 10px;
	max-width: 420px;
	transition: all ease-in-out 0.2s ;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) scale(0.8);
}
.popup__choose p,
.popup__after p{
	margin: 0;
	padding-top: 12px;
	padding-bottom: 0;
}
.popup__choose--toggle,
.popup__after--toggle{
	opacity: 1;
	pointer-events: all;
	transform: translate(-50%, -50%) scale(1);
}
.popup__choose__btn,
.popup__after__btn{
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	margin-top: 15px;
}
.popup__choose__btn a,
.popup__after__btn a{
	width: 120px;
	height: 40px;
	background-color: white;
	color: black;
	border-radius: 12px;
	box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-weight: bold;
	cursor: pointer;
}
.popup__choose__btn a:hover,
.popup__after__btn a:hover{
	opacity: 0.8;
}
.popup__policy__check{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
}
.popup__policy__check input{
	margin: 0 6px 0 0;
	cursor: pointer;
}
.popup__policy__check label{
	margin-bottom: 0;
}
.popup__policy p{
	margin: 0;
}
.popup__policy p a{
	color: white;
	font-weight: bold;
	border-bottom: 1px solid white;
	text-decoration: none;
	white-space: nowrap;
}
.popup__policy p a:hover{
	opacity: 0.8;
}
.cmnd__image{
	width: 100%;
	margin-bottom: 10px;
}
.cmnd__item{
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}
.cmnd__item i{
	color: #14f44b;
}
.cmnd__item p{
	line-height: 1.4;
	margin: 0 0 0 6px;
	text-align: left;
}
.container--cmnd{
	padding: 0 0 100px 0;
}
@media (max-width: 1023px) {
	.container--cmnd{
		padding: 10px 0 100px 0 !important;
	}
	.popup__continue,
	.popup__policy
	{
		width: 90%;
		display: block;
	}
	.popup__choose{
		width: 90%;
		display: block;
	}
	.popup__after{
		width: 90%;
		display: block;
	}
}

.toggle-cmnd{
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;
	color: #f44336;
}
.modal-cmnd{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.3);
	opacity: 0;
	visibility: hidden;
	transition: all ease 0.3s;
}
.modal-cmnd.active{
	opacity: 1;
	visibility: visible;
}
.parent-cmnd{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 32px 24px;
	border-radius: 8px;
	background-color: white;
	min-width: 320px;
	opacity: 0;
	visibility: hidden;
	transition: all ease 0.3s;
}
.parent-cmnd.active{
	opacity: 1;
	visibility: visible;
}
.parent-cmnd__close{
    color: #f44336;
    font-size: 32px;
    position: absolute;
    top: 0;
    right: 0;
    background: white;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* # */
.toggle-cmnd2{
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;
	color: #f44336;
}
.modal-cmnd2{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.3);
	opacity: 0;
	visibility: hidden;
	transition: all ease 0.3s;
}
.modal-cmnd2.active{
	opacity: 1;
	visibility: visible;
}
.parent-cmnd2{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 32px 24px;
	border-radius: 8px;
	background-color: white;
	min-width: 320px;
	opacity: 0;
	visibility: hidden;
	transition: all ease 0.3s;
}
.parent-cmnd2.active{
	opacity: 1;
	visibility: visible;
}
.parent-cmnd__close2{
    color: #f44336;
    font-size: 32px;
    position: absolute;
    top: 0;
    right: 0;
    background: white;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.live-chat__time{
	width: 100%;
	text-align: center;
	font-size: 12px;
}
.live-chat {
	font-family: Arial, Helvetica, sans-serif;
  }
  .live-chat__sticky {
	position: fixed;
	bottom: 15px;
	right: 15px;
	z-index: 9999;
  }
  .live-chat__sticky:hover .live-chat__icon {
	opacity: 0.8;
	transform: translateY(-3px);
  }
  .live-chat__sticky:hover .live-chat__label {
	opacity: 1;
	visibility: visible;
  }
  .live-chat__icon {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #108bb1;
	border-radius: 50%;
	cursor: pointer;
	transition: all ease-out 0.4s;
	position: relative;
  }
  .live-chat__icon img {
	width: 50%;
  }
  .live-chat__num {
	position: absolute;
	top: 0;
	right: 0;
	color: #ffffff;
	background-color: #fd0000;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
  }
  .live-chat__label {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: calc(100% + 6px);
	white-space: nowrap;
	background-color: #108bb1;
	color: #ffffff;
	padding: 8px 12px;
	border-radius: 10px;
	font-size: 15px;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all ease-out 0.4s;
  }
  .live-chat__form {
	position: fixed;
	bottom: -100%;
	right: 15px;
	z-index: 9999;
	width: 320px;
	border-radius: 8px;
	border: 2px solid #108bb1;
	background-color: #ffffff;
	opacity: 0;
	visibility: hidden;
	transition: all ease 0.1s;
	display: flex;
	flex-direction: column;
	height: 500px;
  }
  .live-chat__form.active {
	opacity: 1;
	bottom: 15px;
	visibility: visible;
  }
  .live-chat__form.zoom-in {
	width: calc(100% - 30px);
	top: 15px;
	height: auto;
  }
  .live-chat__setting {
	background-color: #108bb1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
  }
  .live-chat__action {
	margin: 4px;
	cursor: pointer;
	transition: all ease-out 0.4s;
  }
  .live-chat__action:hover {
	opacity: 0.8;
  }
  .live-chat__action img {
	width: 12px;
  }
  .live-chat__top {
	margin: 10px;
  }
  .live-chat__trainer {
	display: flex;
	align-items: center;
	padding: 8px;
	border: 1px solid rgba(37, 37, 37, 0.25);
	width: fit-content;
	border-radius: 8px;
  }
  .live-chat__trainer__icon {
	background-color: #cccccc;
	width: 50px;
	height: 50px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  .live-chat__trainer__icon i {
	font-size: 24px;
	color: #ffffff;
  }
  .live-chat__trainer__info {
	margin-left: 8px;
  }
  .live-chat__trainer__info h3 {
	margin: 0;
	font-size: 15px;
	margin-bottom: 6px;
	font-weight: bold;
  }
  .live-chat__trainer__info p {
	margin: 0;
	font-size: 13px;
  }
  .live-chat__body {
	height: 300px;
	overflow-y: auto;
	margin: 10px;
	padding: 8px;
	flex: 1;
	border: 1px solid rgba(37, 37, 37, 0.25);
  }
  .live-chat__guest {
	margin-top: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
  }
  .live-chat__guest .live-chat__person {
	color: #a8c600;
  }
  .live-chat__admin {
	margin-top: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
  }
  .live-chat__admin .live-chat__person {
	color: #37c8ff;
  }
  .live-chat__person {
	display: flex;
	align-items: baseline;
	font-size: 12px;
	font-weight: 600;
  }
  .live-chat__person i {
	margin-right: 8px;
	font-size: 14px;
  }
  .live-chat__message {
	font-size: 14px;
	font-weight: normal;
	margin-top: 4px;
	background-color: #bfe9f9;
	padding: 6px;
	border-radius: 8px;
	max-width: 80%;
  }
  .live-chat__message p {
	margin: 0;
  }
  .live-chat__message p:not(:last-child) {
	margin-bottom: 4px;
  }
  .live-chat__bottom {
	margin: 10px;
  }
  .live-chat__field {
	border: 1px solid rgba(37, 37, 37, 0.25);
	padding: 8px;
	display: flex;
  }
  .live-chat__field input {
	flex: 1;
	height: 24px;
	border: 0;
	outline: 0;
	font-size: 12px;
  }
  .live-chat__field button {
	background-color: transparent;
	border: 0;
	outline: 0;
	cursor: pointer;
	transition: all ease-out 0.4s;
	color: #108bb1;
  }
  .live-chat__field button:hover {
	opacity: 0.8;
  }
  
  /*# sourceMappingURL=web.css.map */
  .live-chat__images {
	display: flex;
	align-items: center;
	justify-content: left;
	flex-wrap: wrap;
	margin-top: 8px;
  }
  .live-chat__images a {
	display: block;
	height: 100px;
	cursor: pointer;
	border: 1px solid white;
  }
  .live-chat__images a img {
	height: 100%;
	width: auto;
  }
  .upload-icon {
	display: flex;
	align-items: center;
	margin-right: 8px;
	font-size: 14px;
  }

  .live-chat__images_hoc_vien {
	display: flex;
	align-items: center;
	justify-content: right;
	flex-wrap: wrap;
	margin-top: 8px;
  }
  .live-chat__images_hoc_vien a {
	display: block;
	height: 100px;
	cursor: pointer;
	border: 1px solid white;
  }
  .live-chat__images_hoc_vien a img {
	height: 100%;
	width: auto;
  }
  .upload-icon {
	display: flex;
	align-items: center;
	margin-right: 8px;
	font-size: 14px;
  }