/* Basic */
body {
    font-family: "PingFang TC", Arial, "微軟正黑體", "Microsoft JhengHei", "細明體", MingLiU, sans-serif;
	font-size: 16px;
	line-height: 1.5;
    color: #585858;
}

a {
	color: #3c3c3c;
	text-decoration: none;
}


/* Nav */
.navbar-light .navbar-nav .nav-link {
    color: rgba(255,255,255,.85);
}
.nav-item a:hover {
	color: orangered !important;
	background: #F5F5F5;
}
.nav-item.active {
	background: #F5F5F5;	
}
.nav-item.active a {
	color: orangered !important;
}

/* Area Style */
.mm {
	margin-top: 115px;
}

/* Callout */
.bd-callout {
  padding: 20px;
  margin: 20px 0;
  border: 1px solid #eee;
  border-left-width: 5px;
  border-radius: 3px;
}
.bd-callout h4 {
  margin-top: 0;
  margin-bottom: 5px;
}
.bd-callout p:last-child {
  margin-bottom: 0;
}
.bd-callout code {
  border-radius: 3px;
}
.bd-callout+.bd-callout {
  margin-top: -5px;
}

.bd-callout-default {
  border-left-color: #777;
}
.bd-callout-default h4 {
  color: #777;
}

.bd-callout-primary {
  border-left-color: #428bca;
}
.bd-callout-primary h4 {
  color: #428bca;
}

.bd-callout-success {
  border-left-color: #5cb85c;
}
.bd-callout-success h4 {
  color: #5cb85c;
}

.bd-callout-danger {
  border-left-color: #d9534f;
}
.bd-callout-danger h4 {
  color: #d9534f;
}

.bd-callout-warning {
  border-left-color: #f0ad4e;
}
.bd-callout-warning h4 {
  color: #f0ad4e;
}

.bd-callout-info {
  border-left-color: #5bc0de;
}
.bd-callout-info h4 {
  color: #5bc0de;
}

.bd-callout-bdc {
  border-left-color: #29527a;
}
.bd-callout-bdc h4 {
  color: #29527a;
}


/* Color */
.bg-morerich {
	background: #f2d59e;
}
.bg-morerich2 {
/*	background:rgba(44,98,155,1.00);*/
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#39a5c6+1,3284ad+40,2c629b+100 */
	background: #0D0C12; /* Old browsers */
	background: -moz-linear-gradient(top,  #0D0C12 1%, #3284ad 40%, #0D0C12 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #0D0C12 1%,#3284ad 40%,#0D0C12 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #0D0C12 1%,#3284ad 40%,#0D0C12 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0D0C12', endColorstr='#0D0C12',GradientType=0 ); /* IE6-9 */
}
.no-bg {
	background-color: rgba(255,255,255,0) !important;
}

/* Content Style */
.navbar-brand {
	padding-bottom: 0px !important;
}
.navbar-brand img {
	position: relative;
}
.navbar-brand span {
	position: absolute;
}
.name-c {
	color: white;
	margin-left: 10px;
	margin-top: 17px;
}
.name-e {
	color: tomato;
}
.teacher-card-text {
	height: 50px !important;
}
.page-mainTitle {
	vertical-align: middle;
}
.page-mainTitle img {
	position: relative;
}
.page-mainTitleDescription {
	font-size: 24px;
	font-weight: bold;
	position: absolute;
	margin-top: 12px;
}
#teacherList .card-header:hover {
	background-color: royalblue;
	color: #ffffff;
	cursor: pointer;
}
#teacherList h2 {
	font-size: 19px;
	font-weight: bold;
}
#teacherList .card-body {
	font-size: 16px;
}
.cardTitle {
	height: 60px;
}
.card a {
	text-decoration: none;
}
.column a {
	color: #3c3c3c;
	text-decoration: none !important;
}
.p-about h1 {
	font-size: 2.5rem !important;
}
.teacher-list a {
	color: midnightblue !important;
	font-size: 17px;
}
.teacher-list a:hover {
	color: orangered !important;
}
.btn-group a {
	color: #ffffff !important;
	cursor: pointer !important;
}
.t-slogan {
	height: 60px;
}

/* Responsive Youtube Video */
.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.pageTitle {
	margin: 30px 0px;
	border-left: solid 5px #AB0002;
}
.pageTitleContent {
	padding-left: 15px;
	font-size: 24px;
	font-weight: bold;
}

/* Font Style */
.fs-11 {
	font-size: 11px;
}
.fs-13 {
	font-size: 13px;
}
.fs-15 {
	font-size: 15px;
}
.fs-17 {
	font-size: 17px;
}
.fs-19 {
	font-size: 19px;
}
.fs-21 {
	font-size: 21px;
}
.fs-24 {
	font-size: 24px;
}

/* Card Style */
.card .h5, h5 {
    font-size: 1.25rem !important;
	font-weight: 900 !important;
}
.card-text {
	font-size: 16px;
}


/* Footer Style */
footer {
	text-align: center;
}
footer a {
	color: lightslategray;
}