* {
	box-sizing: border-box;
}

a {
    text-decoration: none;
}

body {
	margin: 0;
	padding-bottom: 55px;
}

header.iteach_header {
	background: #c9dbe9;
	/* background: -webkit-linear-gradient(top, #c9dbe9 0%, #fff 100%);
	background: -linear-gradient(top, #c9dbe9 0%, #fff 100%);
	background: -moz-linear-gradient(top, #c9dbe9 0%, #fff 100%); */
	background: white;
	
    position: fixed;
    top: 0;
    left: 0;
	
	width: 100%;
	height: 44px;
	
	z-index: 9999;
}

header .iteach-brand {
	width: auto;
	height: 26px;
	/*height: 32px;*/
}

header .menu-btn span {
	background: #77838b;
    display: block;
    width: 20px;
    height: 2px;
    margin-bottom: 6px;
    -webkit-transition: all 0.5s linear;
    transition: all 0.3s linear;
}
header .menu-btn span:last-child{
    margin-bottom: 0px;
}

.header-spacer {
	height: 65px;
}

@media screen and (max-width: 1000px){
	.header-spacer {
		height: 65px;
	}
}

.navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
	
	height: 60px;
    padding: 0 6px;
    padding-left: 8px;
    background: rgba(255,255,255,1);
   /*  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,245,247,1) 15%, rgba(202,214,221,1) 51%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(15%, rgba(242,245,247,1)), color-stop(51%, rgba(202,214,221,1)), color-stop(100%, rgba(255,255,255,1)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,245,247,1) 15%, rgba(202,214,221,1) 51%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,245,247,1) 15%, rgba(202,214,221,1) 51%, rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,245,247,1) 15%, rgba(202,214,221,1) 51%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(242,245,247,1) 15%, rgb(216 223 226) 51%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0 ); */
    box-shadow: 1px 1px 2px #9a98a9;
    z-index:50000;
}

.m1 {
    flex: 1;
    text-align: left;
    padding-left: 15px;
}

@media screen and (max-width: 1000px) {
	.m1 {
   		display:none;
	}
}

.m2 {
    flex: 1;
    text-align: right;
    padding-right: 10px;
}

.user_info {
    display: inline-block;
    text-align: center;
}
.user_info > * {
    margin: 0 !important;
}
@media screen and (max-width: 414px){
	.user_info {
	  display: inline-grid;
	}
}

.icon-25 {
	width: 25px;
	height: 25px;
}
.icon-30 {
	width: 30px;
	height: 30px;
}
.icon-44 {
	width: 44px;
	height: 44px;
}
.icon-50 {
	width: 60px;
	height: 60px;
}

body {
	/* font-family: Arial, "Microsoft Yahei","微软雅黑"; */
	font-family: 'Noto Sans TC', sans-serif;
}

footer {
	position: relative;
	min-height: 40px;
	/*border-top: 1px dashed #ccc;*/
	
	position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 40px;
    /*border-top: 1px dashed #ccc;*/
	padding: 15px 0;
	
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 27%,rgba(255, 255, 255, 1) 100%);
	z-index: 1000;
}
footer #copyright{
	width: 100%;
	/*position: absolute;*/
	font-size: 10px;
	/*bottom: 0px;*/
	text-align: center;
}

#courseNavbar {
	position: relative;
}
#courseNavbarToggle {
	background: #FFFFFF;
	position: absolute;
	right: 0;
	z-index: 100;
	
    border: 1px solid #c0c0c0;
    box-shadow: 0 4px 4px 0 rgba(0,0,0,0.30);
    border-radius: 20px;
    
    top: auto !important;
    left: auto !important;
    transform: none !important;
    
    margin-bottom: 100px;
}

#courseNavbarToggle .dropdown-item {
    width: 90%;
    margin: 0 auto;
	
	color: #37bea9;
}
#courseNavbarToggle .dropdown-item:first-child {
	margin-top: 1.5rem;
}
#courseNavbarToggle .dropdown-item:last-child {
	margin-bottom: 1.5rem;
}
#courseNavbarToggle .dropdown-item:focus,
#courseNavbarToggle .dropdown-item:hover,
#courseNavbarToggle .dropdown-item.active,
#courseNavbarToggle .dropdown-item:active {
    background: #29c4b3;
    box-shadow: inset -4px -4px 0 0 rgba(0,0,0,0.30);
    border-radius: 20px;
	color: white;
}
#courseNavbarToggle .dropdown-item:hover {
    background: rgba(41, 196, 179, 0.6);
}

.hidden {
	display: none !important;
}

.position-absolute {
	position: absolute;
}

.cursor-pointer {
	cursor: pointer;
}

.vertical-block-center {
	height: 100px;
	line-height: 80px;
	text-align: center;
}

.logo, .course_icon {
	width: 150px;
	height: 100px;
}
.course_icon img {
	max-height: 100px;
}

.btn.logo {
	padding: 0px;
}

.octocuz_logo {
	background-image: url(../image/logo_bibibala_tm.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.edit_buttons {
	position: absolute;
	width: calc(100% - 30px);
	top: -10px;
	right: -3px;
	text-align: right;
}

.edit_buttons i {
	border-radius: 100%;
}

.no-list-style {
	list-style-type: none;
}

.form-check input.form-check-input[type=checkbox] {
	height: 100%;
	margin-top: 0px;
}

/* Button Slider - Start */
.switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 24px;
	margin-bottom: 0;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 16px;
	width: 16px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked + .slider {
	background-color: #2196F3;
}

input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
	-webkit-transform: translateX(16px);
	-ms-transform: translateX(16px);
	transform: translateX(16px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}
/* Button Slider - End */

#etextbook-listing form,
#etextbook a {
	height: 100%;
}
#etextbook-listing form > button.btn,
#etextbook a.btn {
	height: 100%;
	white-space: normal;
}

.header_icon,
.lang_flag_icon {
	display: inline-block;
	width: 40px;
	height: 40px;
	
	position: relative;
	
	max-width: 256px;
	max-height: 256px;
	
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	
	cursor: pointer;
}
.header_icon.selected:before
.lang_flag_icon.selected:before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 40px;
	
	/*box-shadow: 0 0 10px blue;*/
	box-shadow: 0 4px 0 0 #85a463;
	border-radius: 50%;
}

.lang_flag_icon.english {
	background-image: url(../image/btn_en.png);
}

.lang_flag_icon.english:hover,
.lang_flag_icon.english.choosed
{
	background-image: url(../image/btn_en_s.png);
}


.lang_flag_icon.schinese {
	background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSItNDkgMTQxIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgLTQ5IDE0MSA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4Ij4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojRDgwMDI3O30KCS5zdDF7ZmlsbDojRkZEQTQ0O30KPC9zdHlsZT4KPGNpcmNsZSBjbGFzcz0ic3QwIiBjeD0iMjA3IiBjeT0iMzk3IiByPSIyNTYiLz4KPGc+Cgk8cG9seWdvbiBjbGFzcz0ic3QxIiBwb2ludHM9IjkxLjEsMjk2LjggMTEzLjIsMzY0LjggMTg0LjcsMzY0LjggMTI2LjksNDA2LjkgMTQ5LDQ3NC45IDkxLjEsNDMyLjkgMzMuMiw0NzQuOSA1NS40LDQwNi45ICAgIC0yLjUsMzY0LjggNjksMzY0LjggICIvPgoJPHBvbHlnb24gY2xhc3M9InN0MSIgcG9pbnRzPSIyNTQuNSw1MzcuNSAyMzcuNiw1MTYuNyAyMTIuNiw1MjYuNCAyMjcuMSw1MDMuOSAyMTAuMiw0ODMgMjM2LjEsNDg5LjkgMjUwLjcsNDY3LjQgMjUyLjEsNDk0LjIgICAgMjc4LjEsNTAxLjEgMjUzLDUxMC43ICAiLz4KCTxwb2x5Z29uIGNsYXNzPSJzdDEiIHBvaW50cz0iMjg4LjEsNDc2LjUgMjk2LjEsNDUwLjkgMjc0LjIsNDM1LjQgMzAxLDQzNSAzMDguOSw0MDkuNCAzMTcuNiw0MzQuOCAzNDQuNCw0MzQuNSAzMjIuOSw0NTAuNSAgICAzMzEuNSw0NzUuOSAzMDkuNiw0NjAuNCAgIi8+Cgk8cG9seWdvbiBjbGFzcz0ic3QxIiBwb2ludHM9IjMzMy40LDMyOC45IDMyMS42LDM1MyAzNDAuOCwzNzEuNyAzMTQuMywzNjcuOSAzMDIuNSwzOTEuOSAyOTcuOSwzNjUuNSAyNzEuMywzNjEuNyAyOTUuMSwzNDkuMiAgICAyOTAuNSwzMjIuNyAzMDkuNywzNDEuNCAgIi8+Cgk8cG9seWdvbiBjbGFzcz0ic3QxIiBwb2ludHM9IjI1NS4yLDI1NS45IDI1My4yLDI4Mi42IDI3OC4xLDI5Mi43IDI1MiwyOTkuMSAyNTAuMSwzMjUuOSAyMzYsMzAzLjEgMjA5LjksMzA5LjUgMjI3LjIsMjg5ICAgIDIxMywyNjYuMyAyMzcuOSwyNzYuNCAgIi8+CjwvZz4KPC9zdmc+Cg==);
}

.lang_flag_icon.chinese {
	background-image: url(../image/btn_ch.png);
}

.lang_flag_icon.chinese:hover,
.lang_flag_icon.chinese.choosed
{
	background-image: url(../image/btn_ch_s.png);
}

.btn {
	cursor:pointer;
	
}
.question-container > div.question_main_content {
    display: flow-root;
}

.fixed-top{
	z-index:9999;
}

.modal{
	z-index:9999;
}

.inf{
	min-width:100% !important;
}

@media (max-width: 360px){
	
	.container {
	max-width: calc(360px - 40px);
	}
}

@media (max-width: 500px){
	.m2{
		font-size:0.8rem;
	}
	.lang_flag_icon{
		width:25px;
		height:25px;
	}
	.container {
	max-width: calc(500px - 60px);
	}
}

@media (max-width: 1000px){
	.container {
	max-width: calc(1000px - 100px);
	}
}

@media (min-width: 1280px) {
.container {
max-width: calc(1280px - 60px);
}
}
@media (min-width: 1366px) {
.container {
max-width: calc(1366px - 60px);
}
}
@media (min-width: 1440px) {
.container {
max-width: calc(1440px - 60px);
}
}
@media (min-width: 1600px) {
.container {
max-width: calc(1600px - 60px);
}
}
@media (min-width: 1680px) {
.container {
max-width: calc(1680px - 60px);
}
}

@media (min-width: 1920px) {
.container {
max-width: calc(1920px - 60px);
}
}

iframe {
    max-width: 100%;
}

video {
	max-width: 100%;
}

.video_upload_part video
{
	max-height: 50vh;
}

@font-face {
  font-family: '標楷體';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/cwtexkai/v3/cwTeXKai-zhonly.eot);
  src: url(//fonts.gstatic.com/ea/cwtexkai/v3/cwTeXKai-zhonly.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/cwtexkai/v3/cwTeXKai-zhonly.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/cwtexkai/v3/cwTeXKai-zhonly.woff) format('woff'),
       url(//fonts.gstatic.com/ea/cwtexkai/v3/cwTeXKai-zhonly.ttf) format('truetype');
}

@font-face {
  font-family: '新細明體';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/s/notoseriftc/v8/XLY9IZb5bJNDGYxLBibeHZ0BvoMtbXwuVcgUbQ3zF6M3eg1qzxeg6QwzxcSPzLZfXbm0Gs_7uos.32.woff2) format('woff2');
}

@font-face {
  font-family: '黑體';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/s/notosanstc/v11/-nFkOG829Oofr2wohFbTp9i9ywIvDrVO3cuHnQmVtV4N3QDXzPiowFVyhy21F93pzxLWunL8lQ.34.woff2) format('woff2');
}

.modal { overflow: auto !important; }

.cl {
	clear: both;
}

.font-12
{
	font-size: 12px;
}
.font-14
{
	font-size: 14px;
}
.font-16
{
	font-size: 16px;
}
.font-18
{
	font-size: 18px;
}

table[role='presentation'] tr
{
	background: unset;
}

.fraction_table td
{
	padding: 0;
    border: unset;
}

.__cropro_
{
	z-index: 10010!important;
}

.question_rubric_container {
    pointer-events: all;
	text-align: right;
}

.wrs_editor .wrs_tickContainer {
	display : none
}