/* teacher_base.html */

.section-teacher_base-sidebar ul.nav-list li {
    margin: 0;
    padding: 0;
    display: block;
    position: relative;
}

.section-teacher_base-sidebar ul.nav-list li a {
    -webkit-transition: background 0.1s;
    transition: background 0.1s;
    padding: 8px 0 8px 22px;
    display: block;
    color: #666;
    font-size: 0.9em;
    text-decoration: none;
    line-height: 20px;
}

.section-teacher_base-sidebar ul.nav-list li a:before {
    font-family: 'Font Awesome 5 Free';
    content: "\f054";
    font-weight: 900;
    position: absolute;
    top: 8px;
    font-size: 7.2px;
    opacity: 0.7;
    -webkit-transform: translate3d(-1px, 0, 0);
    transform: translate3d(-1px, 0, 0);
    left: 12px;
}

.section-teacher_base-sidebar ul.nav-list li a:hover:before {
    -webkit-animation-name: arrowLeftRight;
    animation-name: arrowLeftRight;
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.section-teacher_base-sidebar .sidebar .nav-list .nav-link:focus,
.section-teacher_base-sidebar .sidebar .nav-list .nav-link:hover,
.section-teacher_base-sidebar .sidebar .nav-list .nav-link.active {
    font-weight: bold;
}

.section-teacher_base-sidebar .sidebar ul.nav-list li a {
    color: #666;
    font-weight: 400;
    font-size: 0.8em;
    padding: 8px 0 8px 22px;
    text-decoration: none;
}

.section-teacher_base-sidebar .sidebar .bottom-border {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}


@-webkit-keyframes arrowLeftRight {
    0% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    50% {
        -webkit-transform: translate3d(1px, 0, 0);
        transform: translate3d(1px, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }
}

@keyframes arrowLeftRight {
    0% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    50% {
        -webkit-transform: translate3d(1px, 0, 0);
        transform: translate3d(1px, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }
}

/* teacher_list.html */

.section-teacher-list {
    visibility: hidden;
}

.section-teacher-list .red-title {
    color: red;
    font-weight: bold;
}

.section-teacher-list .teacher-thumb a {
    text-decoration: none;
    color: #212529;
}

.section-teacher-list .teacher-thumb p {
    font-size: 0.9em;
    font-weight: 700;
    margin: 0;
    padding: 0;
    display: block;
    line-height: 26px;
    color: #272727;
}

.section-teacher-list .teacher-photo {
    width: 200px;
    border-radius: 3px;
}

.section-teacher-list .badge {
    background-color: #17a2b8;
}

.section-teacher-list .teacher-info {
    font-family: "Microsoft JhengHei";
}

.section-teacher-list .email-hidden {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.section-teacher-list .teacher-thumb a:hover {
    text-decoration: underline;
    text-decoration-color: #0a83df;
}

@media (max-width: 768px) {
    .section-teacher-list .element-item {
        text-align: center;
    }
}

/* teacher_page.html */

@keyframes fadeInLeft {
	0% {
		-webkit-transform: translateX(-10%);
		transform: translateX(-10%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1;
	}
}

.section-teacher-page .fadeInLeft {
	-webkit-animation: fadeInLeft 1s ease-in-out;
	animation: fadeInLeft 1s ease-in-out;
}

@keyframes maskUp {
	from {
		-webkit-transform: translate(0, 100%);
		transform: translate(0, 100%);
	}

	to {
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0);
	}
}

.section-teacher-page .teacher-name {
	animation-delay: 300ms;
	-webkit-animation: maskUp 1s ease-in-out;
	animation: maskUp 1s ease-in-out;
}

.section-teacher-page .teacher-job {
	animation-delay: 500ms;
	-webkit-animation: maskUp 1s ease-in-out;
	animation: maskUp 1s ease-in-out;
}

.section-teacher-page .iecs-color {
	color: #1b9dff;
}

.section-teacher-page .teacher-word p {
	text-indent:2em;
	font-size: 17px;
}

.section-teacher-page .btn {
	font-size: 0.8rem;
}

.section-teacher-page .btn-rounded {
	border-radius: 35px;
}

.section-teacher-page .btn-outline.btn-primary.active,
.section-teacher-page .btn-outline.btn-primary:hover {
    color: #fff;
    background-color: #1b9dff;
    border-color: #1b9dff;
}

.section-teacher-page .btn-outline.btn-primary {
    color: #1b9dff;
    background-color: transparent;
    background-image: none;
    border-color: #1b9dff;
    border-width: 2px;
}

.section-teacher-page .btn-outline.btn-dark:hover {
    color: #fff;
    background-color: #212529;
    border-color: #212529;
}

.section-teacher-page .btn-outline.btn-dark {
    color: #212529;
    background-color: transparent;
    background-image: none;
    border-color: #212529;
    border-width: 2px;
}

.section-teacher-page .teacher-pic {
	text-align: center;
	align-items: center;
}

.section-teacher-page .teacher-pic img {
	max-width: 300px;
	border-radius: 3px;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.section-teacher-page .fadeIn {
	-webkit-animation: fadeIn 1s ease-in-out;
	animation: fadeIn 1s ease-in-out;
}

.section-teacher-page .gray-bg {
	background-color: #f8f9fa;
}

.section-teacher-page li {
	list-style-type: none;
	line-height: 24px;
	font-size: 14px;
}

.section-teacher-page .list-group-item {
	border: none;
	background: none;
}

.section-teacher-page .info-title {
	font-size: 1.8em;
	font-weight: 400;
	line-height: 24px;
	text-transform: uppercase;
}

.section-teacher-page .collapse-toggle {
	height: 26px;
	width: 26px;
	background-color: #1b9dff;
}

.section-teacher-page .collapse-toggle:before {
	position: relative;
	bottom: 4px;
	right: 9.5px;
	font: var(--fa-font-solid);
	font-weight: 700;
	content: "\F107";
	color: #FFF;
	font-size: 22px;
}

.section-teacher-page .collapse-toggle.collapsed:before {
	content: "\F105";
	right: 7.5px;
	bottom: 5px;
}

.section-teacher-page label {
	position: relative;
	top: 1px;
	font-size: 16px;
}

.section-teacher-page .update-bar {
	text-align: center;
	color: #666;
}

.section-teacher-page .paper-topic {
	color: #0000ff
}