@charset "utf-8";
html, body{
	width: 100%;
	height: 100%;
	margin: 0px;
	background: #cddbc1 !important;
	font-family: Arial, Helvetica, sans-serif !important;
}
a{
	text-decoration: none !important;
}
img {
	max-width: 100%;
}
#load_image{
  width:100%;
  height:100%;
  position:fixed;
  z-index:9999;
  top: 0;
  background: url("../img/load.gif") no-repeat center center #FFF;
}
/* width */
::-webkit-scrollbar {
  width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #fff !important; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #098F02;
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #0CBB03; 
}
/* Header */
#header {
	background: #2e5f10;
	margin: 0px;
	padding: 0px;
	text-align:center;
}
#header h1{
	color: #FFF;
}
#header h2{
	color: #FFF;
}
.logo{
	float: left;
	width: 35px;
	height: 35px;
	margin: 5px 0px 5px 20px;
	padding: 0px;
}
.logo img{
	width: 35px;
	height: 35px;
}
.menu_user{
	margin: 0 auto;
	text-align: right;
	float: right;
	color: #FFF;
}
.menu_user a{
	padding: 10px;
}
.menu_user a:hover{
	color: #C60000;
}
.subnav {
	margin-right: 20px;
}
.subnav .subnavbtn{
	background: none;
	border: none;
	margin: 0px;
	padding: 0px;
	border-radius: 50%;
	margin-top: 5px;
}
.subnav-content {
  display: none;
  position: absolute;
  right: 5px;
  background-color: #fff;
  width: 120px;
  z-index: 1;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 0px;
  padding: 10px;
  font-size: 13px !important;
  width: 150px;
}

.subnav-content a {
  float: left;
  color: #369;
  text-decoration: none;
}

.subnav-content a:hover {
  color: black;
}
.subnav:hover .subnav-content {
  display: block;
}
.title-page {
	margin: 12px auto 0px auto;
	display: inline-block;
	text-align: center;
	color: #fff;
	font-weight: bold;
}
.menu-right {
	width: 30px;
	height: 30px;
	overflow: hidden;
	padding: 5px 0px;
}
.subnavbtn img{
	width: 30px;
}
* {
  box-sizing: border-box;
}

/* Style the search field */
.search input[type=text] {
  padding: 5px;
  font-size: 14px;
  width: 200px;
  background: #fff;
}

/* Style the submit button */
.search button {
  width: 40px;
  padding: 5px;
  background: #2196F3;
  color: white;
  font-size: 14px;
  border: none; /* Prevent double borders */
  cursor: pointer;
}

.search button:hover {
  background: #0b7dda;
}

/* Clear floats */
.search::after {
  content: "";
  clear: both;
  display: table;
}
/*Content*/
#content {
	text-align: center;
	height: 90%;
	padding: 0px;
	margin: 0px;
	line-height: 25px;
}
.content {
	margin: 0 auto;
	text-align:center;
}
a {
	text-decoration: none;
	color: #FFF;
}
.link a{
	color:#039;
}
#list {
	border: 1px solid #ccc;
	border-collapse:collapse;
	width: 100%;
	overflow: scroll;
}
#list a{
	color: #000;
}
#list .tr1 {
	font-weight: bold;
	background: #ccc;
}
#list .td {
	border: 1px solid #ccc;
	padding: 5px;
}
#list .td1, .td2, .td3 {
	text-align: center;
}
#list .da {
	width: auto !important;
} 
.taode {
	text-align: center;
	margin-bottom: 20px; 
}
.tk {
	width: 40%;
	float: left;
	margin-bottom: 10px;
	margin-top: 10px;
}
.dsde {
	width: 100%;
	margin-bottom: 10px;
	margin-top: 10px;
}
.thongke { 
	border: 1px solid #069;
	border-collapse:collapse;
	width: 100%;
}
.thongkecot{
	border: 1px solid #069; 
	padding: 10px;
}
.thongkecottieude{
	padding: 10px;
	font-weight: bold;
	background: #E0E0E0;
}
.thongkecot1 {
	width: 200px;
}
.thongkecot2 {
	text-align:center;
}
.thongkechitiet { 
	border: none;
	border-collapse:collapse;
	width: 100%;
}

.thongkechitietcot2{
	text-align:center;
}
.linkde{
	color: #06F;
}
.inde {
	border: 1px solid #069;
	border-collapse:collapse;
	margin: 0 auto;
}
.indecot {
	padding: 10px;
	width: 200px;
	text-align: center;
}
.inde1{
	background: #E2E2E2;
	text-align: center;
	font-weight: bold;
}
td.cauhoi{
	border: 1px solid #ccc;
	padding: 5px;
	text-align: left !important;
}
.td {text-align:center}
.tieude {
	text-transform: uppercase;
	color: #E10000;
}
.infodangnhap {
	text-align:center;
	color:#F00;
}
.formdangnhap{
	background: #FFF;
	text-align: left;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 3px 3px 5px;
	width: 300px;
	margin: 7% auto;
	padding: 10px;
}
.logo-login{
	text-align: center;
}
.formdangnhap h2{
	text-align: center;
	line-height: 35px;
}
.error {
	color: #F00;
	text-align: center;
}
.mess {
	color: #006;
	text-align: center;
}
.formdangnhap input{
	width: 97%;
	border-radius: 5px;
	height: 30px;
	border: 1px solid #ccc;
	padding: 5px;
}
input{
	border: 1px solid #DDD;
	width: auto;
	border-radius: 3px;
	padding: 5px;
}
select {
	border: 1px solid #DDD;
	width: auto;
	border-radius: 3px;
	padding: 5px;
}
select {
	font-family: 'FontAwesome', 'sans-serif';
  }
input[type="text"]{
	border: 1px solid #DDD;
	border-radius: 3px;
	padding: 5px;
}
input[type="button"],input[type="submit"] {
	background-color: #13aa52;
  border: 1px solid #13aa52;
  border-radius: 4px;
  box-shadow: rgba(0, 0, 0, .1) 0 2px 4px 0;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  font-family: "Akzidenz Grotesk BQ Medium", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  outline: 0;
  padding: 10px 25px;
  text-align: center;
  transform: translateY(0);
  transition: transform 150ms, box-shadow 150ms;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}
.nopbai {
	background-color: #13aa52;
  border: 1px solid #13aa52;
  box-shadow: rgba(0, 0, 0, .1) 0 2px 4px 0;
  box-sizing: border-box;
  border-radius: 0px !important;
  color: #fff;
  cursor: pointer;
  font-family: "Akzidenz Grotesk BQ Medium", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  outline: 0;
  padding: 10px 25px;
  text-align: center;
  transform: translateY(0);
  transition: transform 150ms, box-shadow 150ms;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}
input[type="button"]:hover,input[type="submit"]:hover {
	background: #093;
}
.button2 {
  align-items: center;
  padding: 6px !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
  border-radius: 6px !important;
  color: #3D3D3D !important;
  background: #fff !important;
  border: 1px solid #F7F7F7 !important;
  box-shadow: 0px 0.5px 1px rgba(0, 0, 0, 0.1) !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  touch-action: manipulation !important;
  cursor: pointer;
}
.button2:hover {
	background: #EEE !important;
}
.button3 {
	background: #FF4742 !important;
  border: 1px solid #FF4742 !important;
  border-radius: 6px !important;
  box-shadow: rgba(0, 0, 0, 0.1) 1px 2px 4px !important;
  box-sizing: border-box !important;
  color: #FFFFFF !important;
  display: inline-block !important;
  font-size: 16px !important;
  font-weight: bold !important;
  line-height: 16px !important;
  min-height: 40px !important;
  outline: 0 !important;
  padding: 12px 14px !important;
  text-align: center !important;
  text-transform: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  vertical-align: middle !important;
}
.button3:hover,
.button3:active {
  background-color: initial !important;
  background-position: 0 0 !important;
  color: #FF4742 !important;
}

.button3:active {
  opacity: .5 !important;
}
.button4 {
	background: none;
	border: none;
	padding-top: 3px;
	color: #555555;
}
.button4:hover {
	color: #B00000;
	cursor: pointer;
}
.button5 {
	background: none;
	border: none;
	padding-top: 7px;
	color: #F1E4D4;
}
.button5:hover {
	color: #E01605;
	cursor: pointer;
}
.button6 {
	float: left;
	background: none;
	border: none;
	border-radius: 50%;
	padding: 0px;
	margin: -5px 5px 0px -5px;
	color: #AAAAAA;
}
.button6:hover {
	color: #E01605;
	cursor: pointer;
}
#hiddeninput{
	display:none;
}
.pagenavi {
	text-align: right;
	height: 40px;
}
.pagenavi span{
	border: 1px solid #CCC;
	padding: 5px 10px 5px 10px;
}
.pagenavi span.page_select{
	background: #0080C0;
	padding: 5px 10px 5px 10px;
}
.pagenavi a{
	color: #333;
}
.pagenavi a span.page_select{
	color: #fff;
}
.edit{
	width:400px;
	margin-top: -40px;
	padding-bottom: 5px;
}
#btn {
	margin: 0px !important;
	padding:0px;
	width: 12px !important;
	height: 12px;
}
.selectall {
	background:url(img/selectall.png) no-repeat;
}
.unselectall {
	background:url(img/unselectall.png) no-repeat;
}
/*footer*/
#footer{
	background: #099;
	text-align:center;
	padding:10px;
	margin-top: 20px;
	height:100%;
	color: #fff;
}

/*--------------account------------------------*/
#account{
	color: #2d5f9a !important;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 3px 3px 3px;
	max-width: 500px;
	margin: 5px auto;
	padding: 10px;
	background: #fff;
}
/*--------------DS BÀI KIỂM TRA-------------------*/
.mon {
	border: 1px solid #F6F6F6;
	text-align: left;
	max-width: 800px;
	margin: 10px auto 10px auto;
	background: #fff;
	padding: 0px;
	border-radius: 3px;
}
.mon-name {
	background: #F6F6F6;
	color: #00274F;
	padding: 10px 10px 10px 20px;
	font-size: 18px;
	margin: 0px;
	border: 1px solid #F6F6F6;
	text-transform:uppercase;
	font-weight:bold;
}
.mon-de {
	padding: 10px;
}
.mon-de h3 {
	margin: 0px;
}
h3 a{
	color: #005353;
}
h3 a:hover{
	color: #009595;
}
.de-entry {
	border-bottom: 0.1px dashed #3399FF;
	padding: 5px 10px 15px 65px;
	background-image: url(../img/test.png);
	background-repeat: no-repeat;
	margin: 10px 10px 10px 5px;
}
.de-info a{
	color: #0C78F5;
}
.gg-chevron-right {
    box-sizing: border-box;
    position: relative;
    transform: scale(var(--ggs,1));
    width: 22px;
    height: 22px;
    border: 2px solid transparent;
    border-radius: 100px;
	display: inline-block;
}
.gg-chevron-right::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    transform: rotate(-45deg);
    right: 6px;
    top: 4px;
	display: inline-block;
}
.gg-chevron-down {
    box-sizing: border-box;
    position: relative;
    transform: scale(var(--ggs,1));
    width: 22px;
    height: 22px;
    border: 2px solid transparent;
    border-radius: 100px;
	display: inline-block;
}
.gg-chevron-down::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    transform: rotate(45deg);
    left: 4px;
    top: 2px;
		display: inline-block;
}
.show, .hide {
	float: right;
	border: none;
	background: #F4F4F4;
}
#form-taomon{
	display: none;
}
.input-tenmon {
	height: 35px;
	border: none;
	border-radius: 5px;
	padding-left: 5px;
	margin-bottom: 3px;
}
.input-tenmon:focus {
}
.submit-taomon {
	height: 30px;
	padding: 2px 5px 2px 5px !important;
	font-size: 13px !important;
	vertical-align: middle;
}
.cauhinh{
	width: 60%;
	min-width: 250px;
	text-align: left;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin: 0px auto;
	padding: 10px;
	background: #fff;
	display:inline-block;
	vertical-align: text-top;
}
#full{
	width: 100%;
	height: 100%;
}
.opacity {
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: 100;
	background: #666;
	position: fixed;
	top:0px;
	opacity: 0.5;
}
.opacity-1{
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: 100;
	background: #666;
	position: fixed;
	top:0px;
	left: 0px;
	opacity: 0.5;
}
.xacnhan {
	width: 100%;
	z-index: 200;
	position:fixed;
	top: 15%;
	left: 0;
}
.xacnhan-button{
	color: #2d5f9a;
	border: 1px solid #ccc;
	border-radius: 5px;
	max-width: 400px;
	margin: 5px auto;
	padding: 10px;
	background: #fff;
	margin: 0 auto;
	font-size: 16px;
	text-align: center;
}
.btn {
  color: #CCC;
  text-decoration: none;
  border: none;
  background:none;
  margin: 0;
  padding: 0;
}

.btn:hover {
  text-decoration: none;
  color: #F00;
}
.table-option {
	width: 100%;
}
.table-option .col1 {
	width: 200px;
	background: #F1F1F1;
	text-align: right;
	padding-right: 10px;
}
.table-option .col2 {
	padding-left: 10px;
}
.sode
{
	width: 50px !important;
}
#subname{
	width: 200px !important;
}
.button {
  font-family: Arial;
  color: #0C78F5;
  font-size: 14px;
  text-decoration: none;
  background: #fff;
  border: none;
  padding: 0px;
  cursor: pointer;
}
.button:hover {
  text-decoration: none;
}
/*---------QUAN LY GV----------------*/
#gv {
    width: 100%; 
	background: #F4F4F4;
	max-width: 700px;
	margin: 10px auto;
	padding: 5px;
	border-radius: 5px;
	text-align: left;
	display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
}
.gv-list {
	width: 100%;
	background: #fff;
	border-collapse: collapse;
}
.gv-list a{
	color: #001831;
}
.gv-list .row-title{
	font-weight: bold;
}
.gv-list .row-info  {
	border-top: 1px solid #CCC;
}
.gv-list .col1 {
	text-align: center;
}
.gv-list .col1 {
	padding: 10px;
}
/*----------account-----------------------*/
.table-account {
	width: 100%;
	border-collapse: collapse;
}
.table-account .col1{
	width: 200px;
	text-align: right;
	padding: 10px;
	background: #EAEAEA;
}
.table-account .col2{
	text-align: left;
	padding: 10px;
	background: #F5F5F5;
}
.table-account .col3{
	padding: 10px;
	background: #F9F9F9;
}
.table-account-hs {
	width: 100%;
	border-collapse: collapse;
}
.table-account-hs .col1{
	width: 150px;
	text-align: right;
	padding: 10px;
	background: #EAEAEA;
}
.table-account-hs .col2{
	text-align: left;
	padding: 10px;
	background: #F5F5F5;
}
.table-account-hs .col3{
	padding: 10px;
	background: #F9F9F9;
}
/*---------QUAN LY MON----------------*/
#full-action{
	width: 100%;
	height: 100%;
	display: none;
}
#opacity-2{
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: 100;
	background: #666;
	position: fixed;
	top:0px;
	left: 0px;
	opacity: 0.5;
}
.form-action {
	width: 100%;
	z-index: 200;
	position:fixed;
	top: 15%;
	left: 0;
}
.xacnhan-action {
	color: #2d5f9a;
	border: 1px solid #ccc;
	border-radius: 5px;
	max-width: 400px;
	max-height: 500px;
	overflow-y: scroll;
	margin: 5px auto;
	padding: 10px;
	background: #fff;
	margin: 0 auto;
	font-size: 16px;
	text-align: center;
}
.mon-button{
	background-image:url(../img/list.png);
	background-repeat:no-repeat;
	background-color: inherit !important;
	border: none !important;
	box-shadow: none !important;
	width: 16px !important;
	height: 16px !important;
	padding: 0px !important;
	margin: -2px 5px !important;
}
.mon-button:hover{
	background-image:url(../img/list.png) !important;
}
.menu-mon {
	display: none;
  	position: absolute;
  	background-color: #fff;
  	width: 120px;
  	z-index: 1;
  	border: 1px solid #ccc;
  	border-radius: 5px;
  	margin: 0px;
  	padding: 10px;
}
.menu-mon a{
	font-size: 14px;
	color: #333;
	text-decoration: none;
	text-transform:none;
}
.btn-menu-mon {
  color: #00274F;
  text-decoration: none;
  font-weight: bold;
  font-family: "Times New Roman", Times, serif;
  border: none !important;
  background:none;
  margin: 0 0 0 5px;
  padding: 0;
}

.btn-menu-mon:hover {
  text-decoration: none;
  color: #F00;
}
.list-gv {
	text-align: left;
	width: 250px;
	margin: 0 auto;
}
.btn-xoa-test {
  color: #CCC;
  text-decoration: none;
  font-family: "Times New Roman", Times, serif;
  border: none !important;
  background:none;
  margin: 10px 0 0 5px;
  padding: 0;
  cursor: pointer;
  float: right;
}
.btn-xoa-test:hover {
  text-decoration: none;
  color: #F00;
}
.public {
	font-weight: normal;
	color: #666;
	font-size: 14px;
}
.gv_add {
	margin-left: 10px;
	font-size: 14px;
	color: #9FA4AB;
}
/*----------BÀI LÀM CỦA THÍ SINH------------------*/
.lop-bailam {
	padding: 0px;
	border-radius: 5px;
}
.bailam {
	border: 1px solid #F6F6F6;
	text-align: left;
	max-width: 1000px;
	margin: 10px auto 10px auto;
	background: #F8F8F8;
	padding: 0px;
	border-radius: 5px;
}
.test-name {
	background: #F6F6F6;
	color: #00274F;
	padding: 10px 10px 10px 20px;
	font-size: 18px;
	margin: 0px;
	border: 1px solid #F6F6F6;
	text-transform:uppercase;
	font-weight:bold;
	text-align:center;
}

.ls-lop-bailam {
	width: 100%;
}
.list_lop {
	background: #fff;
	margin: 0px;
	padding: 10px;
	width: 25%;
	vertical-align: text-top;
}
.bailam-content {
	margin: 0px 0px 0px 10px;
	width: 75%;
	padding: 10px;
	vertical-align: text-top;
	background: #fff;
}
#lop {
	display: block;
	padding: 0px;
	margin: 0px 0px 5px 0px;
	background: #F6F6F6;
}
#lop span{
	float: right;
	margin-top: 4px;
}
#lop button{
	background: none;
	border: none;
}
.hs {
	border: 1px solid #F9F9F9;
	padding: 5px;
	margin: 5px 0px 0px 0px;
	background: #F9F9F9;
	border-radius: 5px;
}
.hs a{
	color: #333;
}
.hs a:hover{
	color: #F00;
}
.hs a:active{
	color: #F00;
}
.hs .ten {
	margin:0px;
	padding: 0px;
}
#bailam-content{
	color: #2d5f9a !important;
	border: 1px solid #ccc;
	border-radius: 5px;
	max-width: 900px;
	width: auto;
	margin: 10px auto 0px auto;
	padding: 10px;
	background: #fff;
	text-align: left;
}
.bl-content{
	width: 100%;
	border: 2px solid red;
}
.ls-diem {
	color: #2d5f9a !important;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 3px 3px 3px;
	max-width: 900px;
	display:inline-block;
	margin: 10px;
	padding: 10px;
	background: #fff;
}
.info{
	text-align: center;
}
.history {
	float:right;
}
.diem {
	border: 1px solid #930;
	padding: 10px;
	color: #F00;
	font-weight:bold;
}
.ketqua {
	border: 1px dashed #0099CC;
	max-width: 200px;
	text-align: center;
	padding: 5px;
	background: #D9FFEC;
}
.hs-diem{
	padding: 0px 0px 0px 20px;
	margin: 0px;
}
input[type="radio"] {
  appearance: none;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 15px;
  height: 15px;
  border: 3px solid #0080FF;
  border-radius: 50%;
}
input[type="radio"]:checked {
	background-color: #2196F3;
	border: 3px solid #2196F3;
}
.form-control + .form-control {
  margin-top: 1em;
}
/* The container */
.container {
  display: block;
  position: relative;
  padding-left: 0px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-radius: 5px;
}

/* Hide the browser's default radio button */
.container input {
	cursor: pointer;
}
/* On mouse-over, add a grey background color */
.container:hover input[type="radio"]{
  
}
.dapan {
	margin-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 0px;
	font-size: 15px;
}
.let {
	color: #0062C4;
	font-weight: bold;
}
/*----------------TAO DE--------------------*/
.col-custom-1 {
	color: #2d5f9a !important;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 3px 3px 3px;
	width: 400px;
	display:inline-block;
	margin: 10px;
	padding: 10px;
	background: #fff;
	font-size: 20px;
}
#form-matran {
	width: 300px;
  font-family: calibri;
  padding: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px solid #E3E3E3;
  text-align: center;
  cursor: pointer;
}
.matran {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

.matran td, .matran th {
  border: 1px solid #ddd;
  padding: 8px;
}

.matran tr:nth-child(even){background-color: #f2f2f2;}

.matran th {
	padding: 12px;
  text-align: center;
  background-color: #04AA6D;
  color: white;
}
.matran td {
  text-align: center;
}
.menu-top {
	margin-top: 10px;
}
.menu-top a{
	margin: 10px;
}
.ch {
	border-top: 1px solid #ccc;
	padding: 10px;
	margin-bottom: 10px;
	font-size: 20px;
}
.nd {
	color: #003;
	line-height: 35px;
}
.cau{
	color: #052a8a !important;
	font-weight: bold;
}
.dapan {
	margin-left: 25px;
	margin-bottom: 10px;
	font-size: 18px;
}
.dapandung {
	border:  1px solid #052a8a;
	padding: 5px;
}
.ls_lop {
	width: 100px;
	display: inline-block;
	margin: 5px;
}
.ls_group {
	width: 200px;
	display: inline-block;
	margin: 5px;
}
.page-content {
	border: 1px #EFEFEF solid;
	background: #fff;
	border-radius: 5px;
	margin: 20px auto;
	max-width: 500px;
	padding: 10px;
}
.taode-content {
	padding: 10px;
	margin: 0px;
}
.taode-content h2 {
	text-align: center;
}
#yourBtn {
	width: 300px;
	margin: 0 auto 10px auto;
  font-family: calibri;
  padding: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px dashed #BBB;
  text-align: center;
  background-color: #DDD;
  cursor: pointer;
}
.noidungde {
	border: 1px solid #ccc;
	width: 63%;
	padding: 10px;
	background: #fff;
	border-radius: 5px;
	margin: 0 auto;
	display:inline-block;
	vertical-align: text-top;
}
.ch {

}
.cau{
	color: #052a8a;
	font-weight: bold;
}
.dapan {
	margin-left: 50px;
}
.dapandung {
	border:  1px solid #052a8a;
	padding: 5px;
}
.thongtinde{
	width: 30%;
	min-width: 250px;
	text-align: left;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin: 0px auto;
	padding: 10px;
	background: #fff;
	display:inline-block;
	vertical-align: text-top;
}
#error{
	color: #F00;
	margin-top: 10px;
}
.suc{
	color: #0080FF;
	margin-top: 10px;
}
.suc a{
	color: #039 !important;
}
.link-demau {
}
.link-demau a{
	color:#0080C0;
}
.page-content .error {
	text-align: left;
}
/*--------------CHỈNH SỬA BÀI KIỂM TRA-------------------*/
#de-content{
	border: 1px solid #ccc;
	border-radius: 5px;
	max-width: 900px;
	width: auto;
	margin: 20px auto 30px auto;
	padding: 10px;
	background: #fff;
	text-align: left;
}
/*---------QUẢN LÝ HỌC SINH--------------------*/
#hs-content {
  width: 100%; 
	background: #F4F4F4;
	max-width: 900px;
	margin: 10px auto;
	padding: 5px;
	border-radius: 5px;
	text-align: left;
	display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
}
.khoi {
    flex: 1 0;
	background: #fff;
    padding: 0px;
	margin: 5px;
	border-radius: 5px;
}
.khoi-list-1 {
	text-align: center;
	background: #EBEBEB;
	margin-bottom: 5px;
	padding-top: 3px;
	width: 100%;
}
.khoi-list {
	text-align: center;
	background: #EBEBEB;
	margin-bottom: 5px;
	padding-top: 3px;
}
.lop-list{
	background: #EBEBEB !important;
	margin-left: 5px !important;
	margin-right: 5px !important; 
}
.hs-list {
	margin: 5px;
}
.hs-list-entry{
	background: #fff !important;
	padding-left: 10px;
}
#hs-content-1 {
  width: 100%; 
	background: #F4F4F4;
	max-width: 900px;
	margin: 10px auto;
	padding: 5px;
	border-radius: 5px;
	text-align: left;
}
.lop-content {
	width: 100%;
	display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
}
.list-class {
	flex: 1 0;
  padding: 0px;
	margin: 5px;
	border-radius: 5px;
	float: left;
	max-width: 150px;
}
.lop-entry{
	background: #EBEBEB;
	margin-left: 5px !important;
	margin-right: 5px !important;
	margin-bottom: 10px;
	padding: 3px;
	cursor: pointer;
}
.lop-entry:hover {
	background: #BADAA5;
}
#list-hs {
	flex: 2 0;
	background: #fff;
	padding: 10px;
	flex-flow: row wrap;
}
.hs-ten {
	padding: 2px;
	margin: 0px;
}
.hs-ten a{
	color: #414141;
}
.updatehs {
	text-align: left;
	max-width: 600px;
	background: #FFF;
	border: 1px solid #F1F1F1;
	border-radius: 5px;
	margin: 10px auto;
	padding: 10px;
	display: table;
	font-size: 18px;
}
.updatehs h3{
	text-align: center;
	margin-bottom: 0px;
}
.updatehs p{
	padding: 0px;
	margin: 15px 0px 2px 0px;
}
.updatehs .col{
	display: table-cell;
	padding: 10px;
}
#importfile {
	width: 300px;
	margin: 0 auto 10px auto;
  font-family: calibri;
  padding: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border: 1px dashed #BBB;
  text-align: center;
  background-color: #DDD;
  cursor: pointer;
}
.hs-entry {
	display: inline-block;
	width: 220px;
	border: 1px solid #ccc;
	border-radius: 3px;
	background: #F4F4F4;
	padding: 3px !important;
	margin: 5px;
}
.hs-entry p{
	padding: 0px;
	margin: 0px;
}
#class-0 {
	background: #BADAA5;
}
/*------------------NGÂN HÀNG--------------------------------*/
.table-responsive {
	background: #fff;
}
.check {
	border: 1px solid #ccc;
}
.col {
	text-align: left;
}
.list-option {
	padding-left: 10px;
}
/*---------------preview--------------------------------*/
#xn {
	display: none;
	width: 100%;
	height: 100%;
}
.fix-bottom {
	position:fixed;
	TOP: 0px;
	width: 100%;
	margin: 0;
}
.fix-content{
	background: #333;
	height: 40px;
	max-width: 900px;
	margin: 0 auto;
}
.timedown {
	background: red;
	color: #fff;
	float: left;
	width: 150px;
	height:40px;
	padding-top: 5px;
	text-align:center;
	font-weight:bold;
}
.nopbai {
	float: right;
	height: 40px;
	width: 150px;
	text-align: center;
	border-radius: none;
}
.title {
	text-align:center;
	margin-top: 50px !important;
}
#warning {
	margin: 10px auto 10px auto;
	border: 1px dashed #FF0000;
}
.warning {
	position:fixed;
	TOP: 42px;
	width: 100%;
	margin: 0;
	padding: 0px;
	z-index: 99999;
}
.warning-content{
	background: #d93434;
	max-width: 900px;
	margin: 0 auto;
	padding: 0px;
	color: #fff;
}
.btn-full {
  background: #63d934 !important;
  background-image: -webkit-linear-gradient(top, #63d934, #45b82b) !important;
  background-image: -moz-linear-gradient(top, #63d934, #45b82b) !important;
  background-image: -ms-linear-gradient(top, #63d934, #45b82b) !important;
  background-image: -o-linear-gradient(top, #63d934, #45b82b) !important;
  background-image: linear-gradient(to bottom, #63d934, #45b82b) !important;
  -webkit-border-radius: 28 !important;
  -moz-border-radius: 28 !important;
  border-radius: 28px !important;
  font-family: Arial !important;
  color: #ffffff !important;
  font-size: 13px !important;
  padding: 5px 10px 5px 10px !important;
  text-decoration: none !important;
}

.btn-full:hover {
  background: #3cb0fd !important;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db) !important;
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db) !important;
  text-decoration: none !important;
}
/*--------edit-form---------------*/
#opacity {
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: 100;
	background: #666;
	position: fixed;
	top:0px;
	left: 0px;
	opacity: 0.5;
}
.edit-form {
	width: 100%;
	height: 100%;
	z-index: 200;
	position:fixed;
	top: 5%;
	left: 0;
}
.edit-content {
	height: 100%;
	max-width: 700px;
	margin: 0 auto;
	padding: 20px;
	background: #fff;
	overflow-y: scroll;
}
.edit-content h3{
	text-align: center;
	font-weight: bold;
	text-transform: uppercase;
}
textarea {
  width: 100%;
  height: auto;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}
input[type=text] {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}
input[type=password] {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}
.edit_dapan {
  height: 47px !important;
}
.edit-1 {
	font-weight: bold;
	text-align: right;
}
/*-------------GUIDE----------------------*/
#guide {
	text-align: left !important;
}
#guide .table-of-content{
	font-size: 12px;
	border-right: 1px solid #ccc;
}
/*-------------REPONSIVE-----------------*/
@media (max-width: 780px) {
	.noidungde{
		width: 50%;
	}
	.thongtinde{
		width: 40%;
	}
}
@media (max-width: 600px) {
	#header {
		width: 100%;
	}
    #content{
		margin: 0px;
		padding: 2px;
	}
	.ds_de {
        width: 90%;
		margin: 10px auto;
		float: none;
    }
	.formdangnhap {
		width: 90%;
		margin: 10% auto;
	}
	#de-content {
		width: 95%;
		margin: 20px auto;
	}
	.de-info {
		width: 95%;
		margin: 10px auto;
	}
	.fix-bottom {
		margin-right:2px;
	}
	#full{
		margin-left: -2px;
	}
	.noidungde,.thongtinde{
		width: 100%;
	}
	.cauhinh{
		width: 95%;
	}
	.updatehs {
		width: 95%;
	}
}
@media (max-width: 350px) {
	.title-page {
		max-width: 150px;
		margin-top: 0px;
	}
	.logo {
		margin-left: 2px;
	}
	.subnav {
		margin-right: 2px;
	}
}