@charset "utf-8";

/*  MAIN CONTAINER  ###########################################################
 *
 *
 *
 * #############################################################################
 */

html {
	font-size	: 16px!important;
}
body {
	/*position	: relative;*/
	/* min-width	: 960px; */
	/* padding-top	: 0 ; */
}
body.star {
	font-size	: 1rem;
}
.task-lists .div_message_center {
	text-align	: center;
	padding		: 50px 5px;
}
.hkec-star-admin-bootstrap {
	font-family: "Microsoft JhengHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.fa {
	font-family: FontAwesome, "Microsoft JhengHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.hkec-star-admin-bootstrap .form-control.star-input-queried-list-pagenum {
	display	: inline-block;
	width	: 80px;
}
#starSearchComponent.force_hide, .modal-backdrop.force_hide {
	display	: none!important;
}
.hkec-star-admin-bootstrap .star-paging-control .btn {
	padding	: 6px 6px;
}
.star-bc-node-text {
	display: inline-block;
    max-width: calc(100% - 100px);
    vertical-align: top;	
}
#starSearchComponent .btn {
	/*margin-left		: 6px;
	margin-right	: 6px;*/
}
.hkec-star-admin-bootstrap .container.ks-selector {
	/*padding	: 0px;*/
}
.hkec-star-admin-bootstrap .panel-body.star-paging-control,
.hkec-star-admin-bootstrap .panel-body.search-summary {
	padding	: 5px 0px;
}
.bc-list .bc-list-icon::before {
	content	: '▶';
}
.bc-list.show-desc .bc-list-icon::before {
	content	: '▼';
}

/* grouping fix */
.hkec-grouping-widget a:hover {
	padding-bottom: 7px !important;
}

/* BANNER CONTAINER ############################################################
 * 
 *
 *
 * #############################################################################
 */
.star-banner {
	background-color: #fff;
	background-repeat: no-repeat;
	min-height: 115px;
	width: 100%;
	padding: 0.5em 1em;
	text-align: right;
}
.hkec-star-admin-bootstrap .jaqp_pmanager_control.btn-group button {
	border-radius: 5px !important;
	display: inline-block;
	margin: 0 3px;
	font-weight: normal;
	text-align: center;
	vertical-align: middle;
	touch-action: manipulation;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	white-space: nowrap;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.hkec-star-admin-bootstrap .jaqp_pmanager_control.btn-group button[disabled] {
	cursor: default;
}
.star-banner .star-menu-button-group {
	float: right;
}
.star-banner .star-menu-button-group li {
	display: inline;
}
body.star_eng .star-banner {
	background-image: url(/client.v1/image/star_header_eng.png);
}
body.star_math_zh .star-banner {
	background-image: url(/client.v1/image/star_header_Cmath.png);
}
body.star_math_en .star-banner {
	background-image: url(/client.v1/image/star_header_Emath.png);
}
body.star_chi .star-banner {
	background-image: url(/client.v1/image/star_header_chi.png);
}
.back_to_old {
	margin-top	: 5px;
}

/* #############################################################################
 * LESSON MANAGEMENT
 *
 *
 * #############################################################################
 */


					/* #############################################################################
					* DISTRIBUTED OR NOT
					*
					*
					* #############################################################################
					*/

					#starLessonManagement {
						position: relative;
						margin: 1em 2em;
					}
					
					#starLessonManagement #notice-lesson-already-distributed,
					#starLessonManagement #notice-lesson-add-users-only {
						display: none;
					}
					
					#starLessonManagement.is_distributed #notice-lesson-already-distributed,
					#starLessonManagement.is_distributed #notice-lesson-add-users-only {
						display: block;
					}

					#starLessonManagement.is_others .btn.save, #starLessonManagement.is_others .btn.save-publish { 
						display: none!important;
					}
					
					#starLessonManagement.is_new .save-as {
						display: none!important;
					}
					
					#starLessonManagement.is_shared .btn.save, 
					#starLessonManagement.is_shared .save-as,
					#starLessonManagement.is_shared .save-publish {
						display: none!important;
					}
					
					#starLessonManagement .accept, #starLessonManagement .reject {
						display: none;
					}
					
					#starLessonManagement.is_shared .accept, #starLessonManagement.is_shared .reject {
						display: inline-block;
					}
					
					#starLessonManagement .panel-heading {
					}
					
					#starLessonManagement .panel-body {
						background-color: #fff;
					}
					
					#starLessonManagement.is_distributed .panel-heading {
						background-image: -webkit-gradient(linear, left top, left bottom, from(#223b64), to(#455998));
						font-weight: bold;
						color: #fff;
					}
					
					#starLessonManagement.is_distributed .panel-heading:after {
						content: " （已派發）";
					}
					.lang_en #starLessonManagement.is_distributed .panel-heading:after {
						content: " (Published)";
					}
					
					#starLessonManagement.is_distributed .panel-body {
						display: block;
					}
					
					#starLessonManagement.is_distributed .section-add-question, 
					#starLessonManagement.is_distributed .star-selected-questions-remove-selected {
						display: none!important;
					}
					
					#starLessonManagement.is_distributed .question-action .btn-delete-question,
					#starLessonManagement.is_distributed .question-action .btn-move-question-down,
					#starLessonManagement.is_distributed .question-action .btn-move-question-up {
						display: none!important;
					}
					
					#starLessonManagement.is_shared .distributed-notice, 
					#starLessonManagement.is_others .distributed-notice,
					#starLessonManagement.is_shared #notice-lesson-already-distributed,
					#starLessonManagement.is_others #notice-lesson-already-distributed {
						display: none!important;
					}
					
					/* #############################################################################
					* WIZARDS
					*
					*
					* #############################################################################
					*/
					
					.hkec-star-admin-bootstrap .wizard {
						margin: 0 auto;
						background: transparent;
					}
					
						.hkec-star-admin-bootstrap .wizard .nav-tabs {
								position: relative;
								margin: 0 auto;
								margin-bottom: 0;
								border-bottom-color: #e0e0e0;
						}
					
						.hkec-star-admin-bootstrap .wizard > div.wizard-inner {
								position: relative;
						}
					
					.hkec-star-admin-bootstrap .connecting-line {
						height: 2px;
						background: #e0e0e0;
						position: absolute;
						width: 80%;
						margin: 0 auto;
						left: 0;
						right: 0;
						top: 50%;
						z-index: 1;
					}
					
					.hkec-star-admin-bootstrap .wizard .nav-tabs > li.active > a, 
					.hkec-star-admin-bootstrap .wizard .nav-tabs > li.active > a:hover, 
					.hkec-star-admin-bootstrap .wizard .nav-tabs > li.active > a:focus {
						color: #555555;
						cursor: default;
						border: 0;
						border-bottom-color: transparent;
					}
					
					.hkec-star-admin-bootstrap span.round-tab {
						width: 70px;
						height: 70px;
						line-height: 70px;
						display: inline-block;
						border-radius: 100px;
						background: #fff;
						border: 2px solid #e0e0e0;
						z-index: 2;
						position: absolute;
						left: 0;
						text-align: center;
						font-size: 25px;
					}
					.hkec-star-admin-bootstrap span.round-tab i{
						color:#555555;
					}
					.hkec-star-admin-bootstrap .wizard li.active span.round-tab {
						background: #fff;
						border: 2px solid #5bc0de;
						
					}
					.hkec-star-admin-bootstrap .wizard li.active span.round-tab i{
						color: #5bc0de;
					}
					
					.hkec-star-admin-bootstrap span.round-tab:hover {
						color: #333;
						border: 2px solid #333;
					}
					
					.hkec-star-admin-bootstrap .wizard .nav-tabs > li {
						width: 25%;
					}
					
					.hkec-star-admin-bootstrap .wizard li:after {
						content: " ";
						position: absolute;
						left: 46%;
						opacity: 0;
						margin: 0 auto;
						bottom: 0px;
						border: 5px solid transparent;
						border-bottom-color: #5bc0de;
						transition: 0.1s ease-in-out;
					}
					
					.hkec-star-admin-bootstrap .wizard li.active:after {
						content: " ";
						position: absolute;
						left: 46%;
						opacity: 1;
						margin: 0 auto;
						bottom: 0px;
						border: 10px solid transparent;
						border-bottom-color: #5bc0de;
					}
					
					.hkec-star-admin-bootstrap .wizard .nav-tabs > li a {
						width: 70px;
						height: 70px;
						margin: 20px auto;
						border-radius: 100%;
						padding: 0;
					}
					
						.hkec-star-admin-bootstrap .wizard .nav-tabs > li a:hover {
								background: transparent;
						}
					
					.hkec-star-admin-bootstrap .wizard .tab-pane {
						position: relative;
						padding-top: 20px;
					}
					
					.hkec-star-admin-bootstrap .wizard h3 {
						margin-top: 0;
					}
					
					@media( max-width : 585px ) {
					
						.hkec-star-admin-bootstrap .wizard {
								width: 90%;
								height: auto !important;
						}
					
						.hkec-star-admin-bootstrap span.round-tab {
								font-size: 16px;
								width: 50px;
								height: 50px;
								line-height: 50px;
						}
					
						.hkec-star-admin-bootstrap .wizard .nav-tabs > li a {
								width: 50px;
								height: 50px;
								line-height: 50px;
						}
					
						.hkec-star-admin-bootstrap .wizard li.active:after {
								content: " ";
								position: absolute;
								left: 35%;
						}
					}
					
					.hkec-star-admin-bootstrap .bs-wizard {margin-top: 40px;}
					/*Form Wizard*/
					.hkec-star-admin-bootstrap .bs-wizard {border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step {padding: 0; position: relative;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step + .bs-wizard-step {}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #595959; font-size: 16px; margin-bottom: 5px;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step .bs-wizard-info {color: #999; font-size: 14px;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step > .bs-wizard-dot {position: absolute; width: 30px; height: 30px; display: block; background: #fbe8aa; top: 45px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%;} 
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {content: ' '; width: 14px; height: 14px; background: #fbbd19; border-radius: 50px; position: absolute; top: 8px; left: 8px; } 
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step > .progress {position: relative; border-radius: 0px; height: 8px; box-shadow: none; margin: 20px 0;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step > .progress > .progress-bar {width:0px; box-shadow: none; background: #fbe8aa;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #f5f5f5;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
					.hkec-star-admin-bootstrap .bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot{ pointer-events: none; }
					/*END Form Wizard*/

					/* #############################################################################
					* INPUT FORMS
					*
					*
					* #############################################################################
					*/

					#input-star-lesson-desc {
						height: auto;
					}

					#input-star-lesson-max_trial_no {
						display	: inline-block;
						width	: 80px;
					}
					
					/* #############################################################################
					* PAGE 2, ADD QUESTION CIRCLE ICONS
					*
					*
					* #############################################################################
					*/
					
					.add-task-ways div.col-sm-3 {
					}
					
					.add-task-ways div.col-sm-3 a {
					}
					
					.add-task-ways div.col-sm-3 a i.fa,
					.add-task-ways div.col-sm-4 a i.fa {
						display: inline-block;
						font-size: 64px;
						border-radius: 60px;
						background: #eeeee8;
						width: 120px;
						height: 120px;
						text-align: center;
						padding-top: 30px;
					}
					
					.add-task-ways div.col-sm-4 a i.fa:after {
						
					}


					/* #############################################################################
					* PAGE 2, LISTING, DEPRECIATED
					*
					*
					* #############################################################################
					*/
					
					/*
					.table-task-list .btn-preview {
						display: block;
					}
					
					.table-task-list .bc-desc {
						display: none;
					}
					
					.table-task-list .attachments.audio_script,
					.table-task-list .attachments.marking_scheme,
					.table-task-list .attachments.item_spec,
					.table-task-list .attachments.question_content_doc{
						display: block
					}
					*/

					/* #############################################################################
					* PAGE 2, QUERY OPTIONS
					*
					*
					* #############################################################################
					*/
					#starSearchComponent .title-step2-method {
						display	: none;
					}
					#starSearchComponent.ks-mode     .title-ks-mode,
					#starSearchComponent.taskid-mode .title-taskid-mode,
					#starSearchComponent.bm-mode     .title-bm-mode {
						display	: inline;
					}
					#starSearchComponent.ks-mode     .taskid-searcher,
					#starSearchComponent.taskid-mode .ks-selector, 
					#starSearchComponent.bm-mode     .taskid-searcher {
						display	: none!important;
					}
					
					#starSearchComponent.bm-mode .subject-advance-search-option[data-subject-search-criteria="bc-retrieve-from-bookmark"] {
						display	: none!important;
					}
					#starSearchComponent.ks-mode .star-queried-list-sortby1 option[value="bookmark_at-asc"],
					#starSearchComponent.ks-mode .star-queried-list-sortby1 option[value="bookmark_at-dsc"] {
						display	: none;
					}
					
					.hkec-star-admin-bootstrap input.star-question-selection-chk-all {
						margin-right	: 25px;
					}
					
					input#input-star-lesson-no-of-questions,
					input#input-star-lesson-no-of-minutes {
						display: inline;
						width: 70px;
						float: left;
					}
					.hkec-star-admin-bootstrap input[type=radio], 
					.hkec-star-admin-bootstrap input[type=checkbox] {
						display: inline;
						/*width: auto !important;*/
						width: 20px;
						height: 20px;
						margin: 7px 10px 0px 10px;
						cursor: pointer;
					}
					
					/* #############################################################################
					* PAGE 2, TABLE LIST (NEW ITEMS)
					*
					*
					* #############################################################################
					*/
					.new-item {
						background: rgba(253, 235, 165, 1);
						-webkit-animation-name: flash-animation;
						-webkit-animation-duration: 0.3s;
						-animation-iteration-count: 1;
						-webkit-animation-fill-mode: forwards;
						
						animation-name: flash-animation;
						animation-duration: 0.3s;
						animation-iteration-count: 1;
						animation-fill-mode: forwards;
					}
					
					@-webkit-keyframes flash-animation {  
						from { background: rgba(253, 235, 165, 1); }
						to  { background: rgba(253, 235, 165, 0.51); }
						/*65% { background: #fff; }
						100% { background: #fff; }*/
					}
					
					@keyframes flash-animation {  
						from { background: rgba(253, 235, 165, 1); }
						to  { background: rgba(253, 235, 165, 0.51); }
						/*65% { background: #fff; }
						100% { background: #fff; }*/
					}
					
					.new-item-notice {
						display: none;
					}
					
					.new-item .new-item-notice {
						display: block;
						color: #5e5fda;
					}


					/* #############################################################################
					* PAGE 2, TABLE LIST (BODY)
					*
					*
					* #############################################################################
					*/
					.hkec-star-admin-bootstrap input.star-selected-questions-chk-all {
						margin-right	: 40px;
					}
					
					.task-lists {
						position: relative;
					}
					
					.task-lists .field-name {
						display: inline-block;
						min-width: 150px;
						font-weight: bold;
						vertical-align: top;
					}
					.task-lists .field-name:after { content: ": "; }
					
					.task-lists > div,
					.task-lists > div .row {
						border-radius: 0 0 10px 10px;
					}
					
					.task-lists > div div.row {
						background: #f2f2f2;
						padding: 0.5em 0;
						min-height: 150px;
					}
					
					.task-lists > div {
						border-radius: 0 0 10px 10px;
						border: #c5c2c2 1px solid;
						margin: 0 1em 1em 1em;
						padding: 0 15px;
						position: relative;
					}
					
					.task-lists > div.new-item div.row {
						background: #f9fddb;
						padding-bottom: 35px;
					}
					
					.task-lists .question-intent .field-name {
						display: none;
					}
					
					.task-lists .question-intent {
						border-radius: 10px;
						border: 1px solid #c0c0c0;
						padding: 1em;
						background: #fff;
					}
					
					.task-lists .col-2 > div ,
					.task-lists .question-intent,
					.task-lists .question-attachments{
						margin-top: 0.5em;
					}
					
					.task-lists .btn-preview {
						border-radius: 5px;
						border: #8a8a8a 1px solid;
						background: #fff;
						padding: 2px 5px;
						margin-left: 0.5em;
						display: inline-block;
					}
					
					.task-lists .question-attachments .attachments{
						padding-right: 0.5em;
					}
					
					.task-lists .question-bookmarked input {
						cursor: pointer;
					}
					
					.task-lists .question-attachments .attachments:after {
						content: ", ";
					}
					
					.task-lists .question-attachments .attachments:last-child:after {
						content: "";
					}
					
					.task-lists .question-bc .bc-list {
						display: inline;
						margin: 0;
						padding-left: 0;
						cursor: pointer;
						border-bottom: 1px solid transparent;
					}
					
					.task-lists .question-bc .bc-list:hover {
						background: #e6f0ff;
						border-bottom: 1px solid #78acfb;
					}
					
					.task-lists .question-bc .bc-list.show-desc {display: block;}
					
					.task-lists .question-bc .bc-list li {
						/* margin: 0.5em 0; */
						display: inline;
					}
					
					.task-lists .question-bc .bc-list.show-desc li {display: block;}
					
					.task-lists .question-bc .bc-list li .bc-code {
						margin-right: 0.5em;
						font-style: normal;
						/* font-weight: bold; */
						/* color: #000; */
					}
					
					.task-lists .question-bc .bc-list li .bc-code:after {content: ", ";}
					.task-lists .question-bc .bc-list li:last-child .bc-code:after {content: "";}
					.task-lists .question-bc .bc-list.show-desc li .bc-code {font-weight: bold;}
					.task-lists .question-bc .bc-list.show-desc li .bc-code:after {content: ": ";}
					
					.task-lists .question-bc .bc-list li .bc-desc { display: none; }
					
					.task-lists .question-bc .bc-list.show-desc li .bc-desc { display: inline; color: #272727;}
					
					[draggable] {
					  -moz-user-select: none;
					  -khtml-user-select: none;
					  -webkit-user-select: none;
					  user-select: none;
					  /* Required to make elements draggable in old WebKit */
					  -khtml-user-drag: element;
					  -webkit-user-drag: element;
					}
					
					.task-lists .col-1,
					.task-lists .col-2,
					.task-lists .col-3 {
						margin-bottom: 0.5em;
					}
					
					.task-lists .col-1 {
						text-align: center;
					}
					
					.task-lists .question-count-no {
						/*display: inline-block;*/
						display: none;
						width: 50px;
						height: 50px;
						background: #d9cece;
						text-align: center;
						padding-top: 12px;
						border-radius: 0.5em;
						font-weight: bold;
						border: 2px solid #6a6969;
					}
					
					.task-lists .question-count-no .field-name {
						display: none;
					}
					
					.task-lists .col-1 > question-count-no {
						display: none;
					}
					
					.task-lists .new-bookmark {
						position: absolute;
						bottom: 0;
						background: #5fb382;
						right: 0;
						min-width: 100px;
						padding: 10px;
						border-radius: 0 0 10px 0;
						text-align: center;
						color: #fff;
						text-shadow: 1px 1px #000;
						display: none;
					}
					
					.task-lists .new-item .new-bookmark {
						display: block;
					}
					
					.item-moved {
						border: 5px solid #f00;
					}
					
					.question-action, .question-bookmarked {
						margin: 0.5em 0;
						/* text-align: left; */
					}
					
					.question-action > a.btn {
						display: block;
						margin: 0.5em 0;
						text-align: left;
						padding-left: 0.5em;
					}
					.question-action > a.btn.btn-delete-question {
						background-color: lightpink;
					}
					
					.task-lists > div:first-child .question-action > a.btn.btn-move-question-up {
						/*display: none;*/
						background-color	: #ccc!important;
					}
					
					.task-lists > div:last-child .question-action > a.btn.btn-move-question-down {
						/*display: none;*/
						background-color	: #ccc!important;
					}
					
					.task-lists.simple-mode {
					}
					
					.task-lists.simple-mode > div {
					}
					
					.task-lists.simple-mode > div .row {
					}
					
					.task-lists.simple-mode > div .row .col-1 {
						display: none;
					}
					
					.task-lists.simple-mode > div .row .col-2 {
					}
					
					.task-lists.simple-mode .question-key-stage, 
					.task-lists.simple-mode .question-bc,
					.task-lists.simple-mode .question-intent,
					.task-lists.simple-mode .question-attachments {
						display: none;
					}
					
					.task-lists.simple-mode .question-action > a.btn {
						display: inline;
						margin-right: 0.5em;
						text-align: center;
					}
					
					.task-lists .question-action > a.btn span.glyphicon {
						margin-right: 0.5em;
					}
					
					.task-lists.simple-mode .question-action > a.btn span.glyphicon {
						margin-right: 0;
						margin-left: 0.1em;
					}
					
					.task-lists.simple-mode > div .row .col-3 {
					}
					
					.task-lists.simple-mode .icon-text {
						display: none;
					}


					/* #############################################################################
					* PAGE 3, TARGETS
					*
					*
					* #############################################################################
					*/

					/* class selection */
					#input-star-select-groups > span::before {
						content: ', ';
					}
					#input-star-select-groups > span:first-child::before {
						content: '';
					}
					#pick-star-pseudo-group {
						width: 36%;
					}
					.picked-star-group-summary-label {
						padding-top: 7px;
					}
					.input-star-select-members-container {
						margin-top: 10px;
					}
					
					.input-star-select-members-container .panel-body {
						background: rgba(245, 255, 0, 0.07);
					}
					
					.ms-container .ms-list {margin-bottom: 0;border-radius: 3px 3px 0 0;}
					
					.ms-container .ms-selectable .custom-header, 
					.ms-container .ms-selection .custom-header {background: #676767;padding: 5px;color: #fff;border-radius: 0 0 3px 3px;}
					
					
					.input-star-class-group-container {
					}
					
					.input-star-class-group-container .row.class-item{
					}
					
					.hkec-star-admin-bootstrap .row.class-item label {
						background: transparent;
						margin-right: 10px;
						cursor: pointer;
						min-width: 80px;
					}
					
					#ms-input-star-select-members {
						width: 80% !important;
						margin-top: 10px;
					}
					
					.hkec-star-admin-bootstrap .form-control.picked-star-group-summary {
						display	: none;
					}
					.picked-star-group-summary.major.form-control .row {
						display: inline;
					}
					
					.picked-star-group-summary.major.form-control > span {
						display: inline !important;
					}
					
					.picked-star-group-summary.major.form-control > span:after {
						content: ", ";
					}
					
					.picked-star-group-summary.major.form-control > span:last-child:after {
						content: "";
					}
					.picked-star-group-summary.major.form-control {
						height: auto;
						min-height: 34px;
					}
					.ms-container .ms-selection li.ms-elem-selection span:after {
						content: "X";
						position: absolute;
						right: 5px;
						opacity: 1;
					}
					
					/* date/time */
					.hkec-star-admin-bootstrap .form-control#input-star-lesson-start-date,
					.hkec-star-admin-bootstrap .form-control#input-star-lesson-start-date-time,
					.hkec-star-admin-bootstrap .form-control#input-star-lesson-end-date,
					.hkec-star-admin-bootstrap .form-control#input-star-lesson-end-date-time {
						width: 60%;
						display: inline;
					}
					
					.ui-widget-header .ui-datepicker-title {
						color	: black;
					}

					/* #############################################################################
					* PAGE 4, DISTRIBUTION & RELATED THEME
					*
					*
					* #############################################################################
					*/
					
					#starLessonManagement .distributed-notice {
						display: none;
					}
					
					#starLessonManagement.is_distributed .distributed-notice {
						display: block;
					}
					
					#starLessonManagement #ms-input-star-select-members .ms-selection {
						position: relative;
					}
					
					#starLessonManagement #ms-input-star-select-members .ms-selection .overlay {
						display: none;
					}
					
					#starLessonManagement.is_distributed #ms-input-star-select-members .ms-selection .overlay {
						height: 200px;
						background: transparent;
						position: absolute;
						top: 34px;
						width: 100%;
						display: block;
						cursor: no-drop;
					}
					
					#starLessonManagement.attempted .distributed-notice span{
						display: none;
					}
					
					#starLessonManagement .distribute-call-to-action {
						display: block;
					}
					
					#starLessonManagement.is_distributed .distribute-call-to-action {
						display: none;
					}

					.distribute-call-to-action a i.fa {
						display: inline-block;
						font-size: 64px;
						border-radius: 60px;
						background: #eeeee8;
						width: 120px;
						height: 120px;
						text-align: center;
						padding-top: 30px;
					}
					
					
					#complete .distributed-notice {
						margin-bottom: 20px;
					}

					#starLessonManagement .star-distribution-summary p span {
						width: 200px;
						display: inline-block;
						vertical-align: top;
					}
					
					#starLessonManagement .star-distribution-summary p span:after {
						content: " : ";
					}
					
					#starLessonManagement .star-distribution-summary-targets {
						display: inline-block;
						max-width: calc(100% - 210px);
					}

/* #############################################################################
 * BC SEARCH MODAL
 *
 *
 * #############################################################################
 */

body.modal-open {}

.radio-label {
	vertical-align	: top;
	line-height		: 2em;
}

/* modal progress panel (overlay) */
.modal .container.in-progress {
	height: calc(100% - 80px);
	background: rgba(255, 255, 255, 0.3);
	position: absolute;
	z-index: 100;
	overflow: hidden;
	padding: 0;
	margin: 0;
	width: calc(100% - 30px) !important;
	cursor: progress;
}

.hkec-star-admin-bootstrap .form-control.star-queried-list-pagenum {
	display	: inline;
	width	: 80px;
}

.hkec-star-admin-bootstrap .fade.in {
	/*position: relative;*/
	display: block !important; /* data-dismiss */
}
.hkec-star-admin-bootstrap .modal-content.fa {
	display: block;
}

.hkec-star-admin-bootstrap .modal-content .container {
	overflow: auto;
}

/*@media( min-width : 768px ) {*/
	.hkec-star-admin-bootstrap .modal-content .container {
		/*max-height: 700px;
		min-height: 650px;
		overflow: auto;*/
	}
	
/*}*/

.hkec-star-admin-bootstrap .modal-content label[for=input-star-bc-and-critria-for-search] {
	font-weight: normal;
	padding-top: 10px;
	padding-left: 5px;
	cursor: pointer;
}

/*@media (min-width: 768px) {*/
	 .hkec-star-admin-bootstrap .modal-dialog {
		width: 90%;
	}
/*}*/

.hkec-star-admin-bootstrap .modal-dialog .container {
	width: 100% !important;
}

					/* #############################################################################
					 * BC SEARCH TREE NAVIGATOR
					 *
					 *
					 * #############################################################################
					 */
					
					#star-bc-tree-navigator {
						max-height: 551px;
						overflow: auto;
						background: transparent;
						/*height: 551px;*/
					}
					
					#star-bc-tree-navigator .card #collapseKeyStageOne,
					#star-bc-tree-navigator .card #collapseKeyStageTwo,
					#star-bc-tree-navigator .card #collapseKeyStageThree{
						/* max-height: 420px; */
						overflow: auto;
						/* height: 420px;*/
					}
					
					#collapseKeyStage1 .card-block,
					#collapseKeyStage2 .card-block,
					#collapseKeyStage3 .card-block {
						min-height	: auto;
					}
					
					#star-bc-tree-navigator .card #collapseKeyStageOne.collapsing,
					#star-bc-tree-navigator .card #collapseKeyStageTwo.collapsing,
					#star-bc-tree-navigator .card #collapseKeyStageThree.collapsing {
						overflow: hidden;
					}
					
					
					.hkec-star-admin-bootstrap #star-bc-tree-navigator .panel {
						margin-bottom: 0;
					}
					
					.card {
						position: relative;
						display: block;
						margin-bottom: .75rem;
						background-color: #fff;
						border-radius: .25rem;
						border: 1px solid rgba(0,0,0,.125);
					}
					
					.card-header {
						padding: .75rem 1.25rem;
						margin-bottom: 0;
						background-color: #f5f5f5;
						border-bottom: 1px solid rgba(0,0,0,.125);
					}
					
					.card-header::after {
						content: "";
						display: table;
						clear: both;
					}
					
					.card-block::after {
						content: "";
						display: table;
						clear: both;
					}
					
					.card-header:first-child {
						border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0;
					}
					
					.card-block {
						padding: 1.25rem;
						min-height: 360px;
						background-color: #f5f4f4;
						overflow: auto;
					}
					
					.card h5 {
						margin-bottom: 0 !important;
					}
					
					.star-random-questions {
						margin: 0 5px;
					}
					
					.hkec-star-admin-bootstrap .form-control.star-queried-list-sortby1 {
						display	: inline;
						width	: 120px;
					}

					/* #############################################################################
					 * BC SEARCH MODAL : SUMMARY
					 *
					 *
					 * #############################################################################
					 */

					.search-summary li {
						padding: 4px 0px;
					}
/* not used				
					.search-summary .excluded-task-list,
					.search-summary .low-priority-task-list {
						display: none;
					}
					
					.search-summary .excluded-task-list li,
					.search-summary .low-priority-task-list li {
						visibility:collapse;
						display: inline;
					}
					
					.search-summary .excluded-task-list li .task-id,
					.search-summary .low-priority-task-list li .task-id{
						visibility:visible;
					}
					
					.search-summary .excluded-task-list li::after,
					.search-summary .low-priority-task-list li::after{
						content: ", ";
					}
					
					.search-summary .excluded-task-list li:last-child::after,
					.search-summary .low-priority-task-list li:last-child::after{
						content: "";
					}
					
					.search-summary .excluded-questions-list,
					.search-summary .low-priority-questions-list {
						min-height: 30px;
						background: rgba(243, 176, 176, 0.2);
					}
*/					
					.search-summary .search-criteria-list li span.bc-id::after {
						content: ": "; 
					}
					
					.search-summary .search-criteria-list li::before {
						content: "或 ";
						color: #3255ea;
						font-weight: bold;
					}
					.lang_en .search-summary .search-criteria-list li::before {
						content: "OR ";
					}
					.search-summary .search-criteria-list.criteria-and-mode li::before {
						content: "及 ";
					}
					.lang_en .search-summary .search-criteria-list.criteria-and-mode li::before {
						content: "AND ";
					}
					.search-summary .search-criteria-list li:first-child::before{
						content: ""!important;
					}
					
					.search-summary .bc-counts.counts, .search-summary .counts {
						font-style: normal;
						font-weight: bold;
						color: #3255ea;
					}
					
					.search-summary .counts.exceeded {
						color: red;
					}
					
					.search-summary .panel-body > * {
						margin-bottom: 1rem;
					}
					
					.search-summary .panel-body .search-criteria-list {
						margin-bottom: 0.5rem;
						min-height: 30px;
						background: rgba(243, 176, 176, 0.2);
						overflow: auto;
						max-height: 250px;
					}
					
					.search-summary .subject-advance-search-options {
						min-height: 30px;
						background: rgba(243, 176, 176, 0.2);
					}
					
					.search-summary .subject-advance-search-options label {
						cursor: pointer;
						margin-right: 10px;
					}
					
					.search-summary input[type=checkbox],
					.search-summary .subject-advance-search-options input[type=radio]{
						cursor: pointer;
						margin-right: 5px;
					}
					.search-summary .panel-body > .star-random-questions {
						margin	: 5px;
					}
					
					/*
					.search-result-panel-header {
						position: fixed;
						top: 56px;
						left: 0;
						width: 90%;
						margin: 0 auto;
						background-color: white;
						z-index: 2099;
					}
					*/
					
					#input-star-queried-questions-list {
						/*padding-top	: 120px;*/
						min-height	: 200px;
						overflow	: auto;
					}
					.task-lists > .jaqp_overlay {
						z-index: 999;
						padding: 0;
						border: 0;
						margin: 0;
						border-radius: 0;						
					}

					/* #############################################################################
					 * ID SEARCH TAB
					 *
					 *
					 * #############################################################################
					 */
					
					.taskid-searcher .glyphicon-ok { color: green; } .taskid-searcher .glyphicon-remove { color: red; }
					.star-bc-taskid-searcher-result {
						margin-top: 30px;
						padding-left: 15px;
					}
					.star-bc-taskid-searcher-result-icon {
						padding-left: 0;
						padding-top: 8px;
					}
					.taskid-searcher.container {
						min-height: 120px;
					}

/* #############################################################################
 * VALIDATION SETS
 *
 *
 * #############################################################################
 */

#starLessonManagement #notice-no-title-inputed,
#starLessonManagement #notice-lesson-generic-1,
#starLessonManagement #notice-lesson-generic-2,
#starLessonManagement #notice-lesson-generic-2b,
#starLessonManagement #notice-lesson-generic-3,
#starLessonManagement #notice-lesson-generic-4 {
	display: none;
}




/* #############################################################################
 * PREVIEW PANE
 *
 *
 * #############################################################################
 */

.question-preview-pane {
	position	: absolute;
	background	: #fff;
	top			: 0;
	z-index		: 99;
	width		: 100%;
	height		: 100%;
	/*overflow	: auto;*/
}

#question-preview-pane2 {
	overflow	: auto;
	z-index		: 2099;
}

.question-preview-pane .preview-pane-title {
	text-align: right;
}
.question-preview-pane .preview-pane-close {
	float		: right;
	margin-top	: 45px;
	margin-right: 10px;
}
.question-preview-pane .preview-pane-body {
}
.question-preview-pane .preview-pane-body .jaqp_item_container  .jaqp_qti_itemBody {
	font-size: 24px;
}

/* #############################################################################
 * book distribute show
 *
 *
 * #############################################################################
 */

a:hover {
  border-bottom: 0 !important;
}
.alert-div {
  display: none;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 1001;
  text-align: center;
}
.alert-div .alert-fixed {
  position: absolute;
  top: 40%;
  width: 80%;
  left: 10%;
}
.alert-div-relative, .alert-div-relative .alert-fixed {
  position: relative;
}
.alert-fixed > div {
  display: inline-block;
}
.alert-btn-div {
  position: absolute;
  top: 10px;
  right: 10px;
}
.alert-btn-grey {
  border-color: grey !important;
  background-color: grey !important;
}
.re-distribute-msg {
  display: block !important;
  text-align: left !important;
  color: grey !important;
}
.hkec-star-admin-bootstrap .wizard .nav-tabs > li {
  width: 33.3% !important;
}
.row {
  margin-left: 15px !important;
}
.ui-jqgrid .ui-search-table {
  width: 100% !important;
}
.ui-jqgrid tr.ui-row-ltr td:not(:first-of-type):not(.ui-sgcollapsed) {
  padding-left: 10px !important;
}
.ui-jqgrid td input[type=checkbox] {
  width: auto !important;
  height: auto !important;
  margin: 0px !important;
}
.ui-jqgrid .ui-pg-input {
  height: auto !important;
}
.ui-jqgrid tr.jqgrow td, .ui-jqgrid .ui-jqgrid-htable th div {
    white-space: pre-wrap !important;
}
.ms-container ul {
  list-style-type: none !important;
}
.bookImg {
  display: none;
}

.books_img {
  position: absolute;
  top: 20px;
  right: 20px;
}	
.div_books_grid {
  position: relative !important;
}
a.package-detail:hover {
  text-decoration: underline !important;
}
.re-distribute {
    color: blue !important;
}