/* Custom color */
body{background-color: #f9f9f9;}
.bg-gray1{background-color: #f9f9f9;}

.text-gray1{color: #717171;}

/* wrapper */
	.wrapper{min-height: 100%; max-width: 2100px; min-width: 320px; margin: 0 auto; position: relative; background-color: #f9fde3; overflow: hidden;}

/* leftSide and rightSide */
	.leftSide{width: 230px;}
	.rightSide{margin-left: 230px;}

	.asideToggle .leftSide{width: 50px;}
	.asideToggle .rightSide{margin-left: 50px;}

	@media (max-width: 767px){
		.rightSide { margin-left: 0;}
		.asideToggle .rightSide{ margin-left:auto ;}
	}

/* Logo area */
	.wrapper .logoArea{height: 140px; position: fixed; top: 0; left: 0; z-index: 1000; text-align: center;}	
	.wrapper .logoArea.visitMode{position: absolute;}
	.wrapper .logoArea object{display: none; max-width: 160px;/*  max-height: 72px; */ /* margin: 0 5%; padding: 5px; */}
	.wrapper .logoArea .logoEtcTxt{padding: 0 10%;}

	.wrapper .logoArea object.horLogo{display: inline;}
	.wrapper .logoArea object.smallLogo{display: none;}

	.asideToggle .wrapper .logoArea{height: 60px;}
	.asideToggle .wrapper .logoArea object.horLogo{display: none;}
	.asideToggle .wrapper .logoArea object.smallLogo{display: inline;}

	@media (max-width: 767px){
		/* Logo area */
			.wrapper .logoArea{ width: 100%; height: 80px; float: none; position: relative;}
			.wrapper .logoArea object{ width: auto; height: 40px; margin: 0px auto;}
			.wrapper .logoArea .logoEtcTxt{display: none;}
			.asideToggle .wrapper .logoArea object.smallLogo, .wrapper .logoArea object.smallLogo{display: none;}
			.asideToggle .wrapper .logoArea object.horLogo, .wrapper .logoArea object.horLogo{display: inline;}
		}
	@media (min-width: 1001px){
			.wrapper .logoArea{position: absolute;}	
		}

/*  Logo area */
	.wrapper .logoArea img{display: inline; width: 100%; max-width: 160px;/*  max-height: 72px; */ /* margin: 0 5%; padding: 5px; */}
	.logoArea img.sqLogo{display: none;}
	.logoArea img.horLogo{display: inline;}
	.logoArea img.smallLogo{display: none;}
	.asideToggle .logoArea img.sqLogo{display: none;}
	.asideToggle .logoArea img.horLogo{display: none;}
	.asideToggle .logoArea img.smallLogo{display: inline;}

	@media (max-width: 767px){
		.wrapper .logoArea img{ width: auto; height: 40px; margin: 0px auto;}
		.wrapper .logoArea img.sqLogo{display: none;}
		.wrapper .logoArea img.smallLogo{display: none;}
		.wrapper .logoArea img.horLogo{display: inline;}
	}

/* Header */
	.wrapper #header{height: 60px; position: relative; top: auto; width: auto; z-index: 999;}
	.wrapper #header .get_width_btn_cover{position: absolute; top: 0; left: 0; height: 60px;}
	.wrapper #header.offTop{position: fixed; top: 0; width: 100%;}
	.wrapper #header .sidebar-toggle{float: left; background-color: transparent; background-image: none; padding: 10px 10px; font-family: fontAwesome; color: #fff;}	
	.wrapper #header .userInfo{width: 100%; color: #fff;}
	.wrapper #header .userInfo .login li{margin-right: 2%;}
/* Footer */
	footer{position: absolute; bottom: 0; height: 50px; background-color: #fdfff2;}

/* Aside */
	aside{}
	.wrapper .main-sidebar{overflow: hidden; height: 100%; position: absolute; top: 60px; left: 0; z-index: 900;}
	.wrapper .main-sidebar.pcStyle{position: fixed;}
	.asideToggle .wrapper .main-sidebar{top: 0; overflow: visible;}
	

	.navAccodian{padding: 0; padding-top: 80px;}
	.navAccodian li .navCtg{}
	.navAccodian li .navCtg a{display: block; width: 100%; height: 100%;}
	.navAccodian li .navCtg a strong.menuTitle{white-space: nowrap;  position: absolute; top: auto; left: auto; overflow: hidden;} 
	.navAccodian li .navCtg a .openPointer{transform: rotateZ(-90deg); position: absolute; white-space: nowrap; right: 10px;}
	.navAccodian li .navCtg a .titleIcon{width: 26px; margin-right: 10px; text-align: center; display: inline-block;}
	.navAccodian li .navCtg a.menuOn{color: #b8c7ce;}
	.navAccodian li .navCtg a.collapsed .fa{transform: rotateZ(0deg);}
	.navAccodian li.on .navCtg a .fa{transform: rotateZ(-90deg) !important;}
	.navAccodian li.on .navCtg a.collapsed .fa{transform: rotateZ(0deg) !important;}
	.navAccodian li .subMenu{padding: 0;}
	.navAccodian li .subMenu ul{padding: 0; background-color: #fff;}

	.asideToggle .navAccodian{padding-top: 60px;}
	.asideToggle .navAccodian li{position: relative;}
	.asideToggle .navAccodian li .navCtg a{text-align: center;}
	.asideToggle .navAccodian li .navCtg a strong.menuTitle{display: none;} 
	.asideToggle .navAccodian li .navCtg a i.titleIcon{margin-right: 0;}
	.asideToggle .navAccodian li .navCtg a i.openPointer{display: none; position: absolute; top: 10px; left: 230px;}
	.asideToggle .navAccodian li .navCtg a.collapsed strong.menuTitle{display: none;} 
	.asideToggle .navAccodian li .navCtg a.collapsed i.titleIcon{margin-right: 0;}
	.asideToggle .navAccodian li .navCtg a.collapsed i.openPointer{display: none;}
	.asideToggle .navAccodian li .navCtg {}
	.asideToggle .navAccodian li .subMenu{position: absolute; width: 200px; top: 0; left: 50px;}
	.asideToggle .navAccodian li .subMenu.in{display: none;}
	.asideToggle .navAccodian li .subMenu.in .navCtg {}
	.asideToggle .navAccodian li .subMenu.in .navCtg a{text-align: left;}
	.asideToggle .navAccodian li:hover{position: relative;}
	.asideToggle .navAccodian li:hover .navCtg a strong.menuTitle{display: flex; position: absolute; width: 200px; height: 40px; top: 0; left: 46px; justify-content: center; align-items: center; z-index: 100;} 
	.asideToggle .navAccodian li:hover .navCtg a i.titleIcon{margin-right: 0;}
	.asideToggle .navAccodian li:hover .navCtg a i.openPointer{display: none; position: absolute; top: 10px; left: 230px; z-index: 100;}
	.asideToggle .navAccodian li:hover .navCtg {}
	.asideToggle .navAccodian li:hover .subMenu{display: block; position: absolute; width: 200px; top: 40px; left: 46px; z-index: 100;}
	.asideToggle .navAccodian li:hover .subMenu ul{border: 1px solid;}
	.asideToggle .navAccodian li:hover .subMenu .navCtg {}
	.asideToggle .navAccodian li:hover .subMenu .navCtg a{text-align: left;}

	@media (max-width: 767px){
		.wrapper .main-sidebar{-webkit-transform: translate(-230px, 0); -ms-transform: translate(-230px, 0); -o-transform: translate(-230px, 0); transform: translate(-230px, 0); top: 60px; width: 230px !important;}
		.wrapper .main-sidebar.offTop{position: fixed;}
		.contentWrapper.offTop{padding-top: 60px;}
		.mobileAsideToggle .main-sidebar{-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0);}
		.mobileAsideToggle .contentWrapper, .mobileAsideToggle.asideToggle .contentWrapper{transform: translate(230px, 0);}
		.navAccodian{margin-top: 0;}
		.mobileAsideToggle .navAccodian li .navCtg a{text-align: left;}
		.mobileAsideToggle .navAccodian li .navCtg a strong.menuTitle{display: inline;} 
		.mobileAsideToggle .navAccodian li .navCtg a i.titleIcon{margin-right: 20px;}
		.mobileAsideToggle .navAccodian li .navCtg a i.openPointer{display: inline;}
		.mobileAsideToggle .navAccodian li .navCtg {}
	}
	@media (min-width: 1001px){
		.wrapper .main-sidebar{position: absolute; z-index: 900;}
		.wrapper .main-sidebar.pcStyle{position: absolute;}
		}

/* search-bar */
.search-bar{ display: -ms-flexbox !important; display: flex !important; } 
.search-bar .form-control{ margin-right: 1rem; max-width: 160px;} 
@media (max-width: 767px){ 
	.search-bar{ display: block !important; } .search-bar>*{ width: 100%; } 
	.search-bar .input-group{ margin-right: 0; } 
	.search-bar .form-control{ margin-right: 0; margin: .25rem 0; max-width: 100%;}
}
/* Please Wait */
	.dataLoading{position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,.2); z-index: 1000;}
	.dataLoading img{width: 20%;}
	.dataLoading p{color: #fff; text-align: center; margin-bottom: 5%;}


/* common */
	.box{position: relative; border-radius: 3px; background: #ffffff; border-top: 3px solid #d2d6de; width: 100%; box-shadow: 0 1px 1px rgba(0,0,0,0.1);}
	.box-header{border-bottom: 1px solid #e1e1e1;}
	.box-header h3{font-weight: bold;}
	.box-footer{border-top: 1px solid #e1e1e1;}
	.wrapper .content{background-color: #fefff9; padding-bottom: 50px;}
	.wrapper .content section.contentHeader{position: relative;}
	.wrapper .content section.contentHeader .breadcrumbCover{position: static;}
	.wrapper .content section.contentHeader .breadcrumbCover .breadcrumb{margin-top: 2%;}
	.wrapper .content section.contentHeader .breadcrumbCover{padding: 0; margin: 0; position: absolute; top: 10px; right: 15px;}
	.wrapper .content section.contentBody .box-body .btnCover{margin-left: auto;}

/* upload */
	.box .box-body .uploaded_file_list li:hover{cursor: pointer;}