@import url("https://fonts.googleapis.com/css?family=Fira+Sans:400,500,600,700,800");
/* 最新消息 */
* {
  font-family: "FontAwesome", "Font Awesome 5 Free", 'Microsoft JhengHei', ' Source Sans Pro', sans-serif, tinymce-small, 'tinymce' !important;
}
/*最新消息文章來源標題*/
.br-text {
  text-indent: -2em;
  margin-left: 2em;
  line-height: 1.6;
  text-align: justify;
}
.cf:before, .cf:after {
  display: table;
  content: ' ';
}
.cf:after {
  clear: both;
}
.cf {
  *zoom: 1;
}
img {
  max-width: 100%;
  height: auto;
}
figure {
  margin: 0;
  padding: 10px;
}
figure a {
  display: block;
}
mark {
  padding: 0 5px;
  background-color: #dddddd;
}
::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.site-content {
  text-align: left;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  padding-right: 5%;
  padding-left: 5%;
  margin-bottom: 90px;
}
.card {
  width: 100%;
  background-color: #fff;
  text-align: left;
  position: relative;
  height: 100%;
  box-shadow: 0px 2px 6px 0px rgba(204, 209, 217, .5);
  border: 1px solid #E6E9ED;
}
.courses {
  margin-top: 30px;
  margin-bottom: 65px;
}
.course-item {
  /*width: 33%;*/
  padding-right: 2%;
  padding-left: 2%;
  margin-bottom: 30px;
  /* ensuring proper layout*/
  float: left;
}
.course-heading {
  font-weight: 500;
  font-size: 2.1rem;
  color: #AAB2BD;
  text-transform: uppercase;
  text-align: center;
}
.course-info {
  padding: 5%;
  min-height: 140px;
}
.course-topic {
  font-weight: 500;
  color: #AAB2BD;
  font-size: 1.5rem;
  margin-bottom: 5px;
}
.course-topic.photo {
  color: #673AB7;
}
.course-topic.webdesign {
  color: #3f3f3f;
}
.course-topic.computer {
  color: #2196F3;
}
.course-topic.code {
  color: #4CAF50;
}
.course-topic.design {
  color: #F44336;
}
.course-title {
  font-weight: 500;
  font-size: 1.7rem;
  color: #009688;
  line-height: 1.6;
  margin: 5% 0 20%;
}
.course-meta {
  color: #AAB2BD;
  font-weight: 300;
  font-size: 1.5rem;
  position: absolute;
  left: 7%;
  bottom: 5%;
}
.course-duration:before {
  font-size: 1.5rem;
  display: inline-block;
  content: "\f017";
  padding-right: 5px;
  vertical-align: middle;
}
/*
.course-caption {
  position: absolute;
  right: 5%;
  bottom: 5%;
  font-size: 18px;
  color: #AAB2BD;
}
*/
.flickity-prev-next-button.previous {
  left: -30px;
}
.flickity-prev-next-button.next {
  right: -30px;
}
.flickity-prev-next-button .arrow {
  fill: #F5F7FA;
}
.flickity-prev-next-button {
  background-color: #434A54;
  width: 38px;
  height: 38px;
}
.flickity-prev-next-button:hover {
  background-color: #656D78;
}

/* external css: flickity.css */

* { box-sizing: border-box; }

body { font-family: sans-serif; }
  
.carousel {
	width: 100%;
	margin: 0 auto;
}

.carousel-cell {
	width: 100%;
	height: auto;
}

.carousel-cell-img {
	width: 100%;
	height: auto;
}

.flickity-viewport {
	height: 100%;
  padding-top:40%;
}
.flickity-slider{
  margin-top:-40%;
  margin-bottom: 10%;
}

/*Styling only, you can change this */
.carousel-container{
  display:flex;
  margin:0 auto;
  width:200px; 
}	

/*最新消息.*/
/*最新消息小方塊*/
.newsbox {
  position: relative;
}
.news {
  z-index: 99;
  position: absolute;
  background: #e87a90;
  width: 45px;
  height: 45px;
  top: 0;
  padding: 2px;
  margin: 10px;
  color: #fff;
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.5;
}
.news1 {
  background: #CB4042;
}
/*.最新消息小方塊*/
/*新聞花絮小方塊*/
.news2 {
  background: #2EA9DF;
}
/*.新聞花絮小方塊*/