
.navbar-brand {
  float: left;
  font-size: 18px;
  padding: 0px;
}

.container-fluid {
  background-color: rgba(255, 255, 255, 0.5);
  border: none;
}

.navbar-inverse {
  border: none;
  background: none;
}

.navbar-inverse .navbar-toggle .icon-bar {
  background-color: black;
}

.navbar-inverse .navbar-nav>li>a {
  color: black;
}

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.clip-wthree {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 86%, 0% 100%);
  clip-path: polygon(0 0, 100% 0, 100% 86%, 0% 100%);
}

.cliptop-wthree {
  -webkit-clip-path: polygon(0 14%, 100% 0, 100% 86%, 0 100%);
  clip-path: polygon(0 14%, 100% 0, 100% 86%, 0 100%);
}

.clipbottom-wthree {
  -webkit-clip-path: polygon(0 14%, 100% 0, 100% 0%, 0 100%);
  clip-path: polygon(0 20%, 100% 0, 100% 100%, 0 100%);
}

.cliptop-blog-wthree {
  -webkit-clip-path: polygon(0 6%, 100% 0, 100% 94%, 0 100%);
  clip-path: polygon(0 6%, 100% 0, 100% 94%, 0 100%);
}

.cliptop-portfolio-wthree {
  -webkit-clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%);
  clip-path: polygon(0 15%, 100% 0, 100% 85%, 0 100%);
  background: -webkit-linear-gradient(TO top right, #00d8c2, #0068b7);
  background: #00c4be;
  padding: 12em 0;
}

.center {
  display: table-cell;
  vertical-align: middle;
}

section {
  display: table;
}

img {
  transition: all 0.8s ease-in-out 0s;
  width: 100%;
}

#test {
  position: relative;
  left: 0px;
  top: 0px;
  z-index: 1;
}

#click {
  position: absolute;
  left: 46%;
  top: 40%;
  z-index: 2;
}

#news {
  position: relative;
  left: 0px;
  top: 0px;
  z-index: 2;
}

#home {
  position: relative;
  left: 0px;
  top: 0px;
  z-index: 2;
}

span {
  font-size: 2em;
  color: white;
  font-family: 微軟正黑體;
  text-align: justify;
  text-justify: inter-ideograph;
  -ms-text-justify: inter-ideograph;
  /IE9/ -moz-text-align-last: justify;
  /Firefox/ -webkit-text-align-last: justify;
  /Chrome/
}

table {
  width: 100%;
  margin: 50px 0px 50px 0px;
}

table tr {
  font-size: 1.3em;
  width: 100%;
}

table th {
  line-height: 1.4em;
  font-family: 微軟正黑體;
  text-align: center;
  text-justify: inter-ideograph;
  -ms-text-justify: inter-ideograph;
  /IE9/ -moz-text-align-last: justify;
  /Firefox/ -webkit-text-align-last: justify;
  /Chrome/
}

th {
  font-size: 1em;
  line-height: 1.4em;
  font-family: 微軟正黑體;
  text-align: center;
  text-justify: inter-ideograph;
  -ms-text-justify: inter-ideograph;
  /IE9/ -moz-text-align-last: justify;
  /Firefox/ -webkit-text-align-last: justify;
  /Chrome/
}

.article {
  height: 397px;
}

.sarticle {
  height: 150px;
}

tr {
  line-height: 1.4em;
  font-family: 微軟正黑體;
  text-align: center;
  text-justify: inter-ideograph;
  -ms-text-justify: inter-ideograph;
  /IE9/ -moz-text-align-last: justify;
  /Firefox/ -webkit-text-align-last: justify;
  /Chrome/
}

p {
  font-size: 1.5em;
  line-height: 2em;
  color: white;
  font-family: 微軟正黑體;
}

h2 {
  text-align: center;
}

td h1 {
  font-size: 40px;
  font-family: 微軟正黑體;
}

td h4 {
  line-height: 2em;
  font-family: 微軟正黑體;
  text-align: justify;
  text-justify: inter-word;
}

td h5 {
  font-size: 20px;
  color: black;
  font-family: 微軟正黑體;
}

td h6 {
  font-size: 1em;
  color: white;
  font-family: 微軟正黑體;
}

.imghover:hover {
  transform: scale(1.05);
}

.style-six {
  border: 0;
  height: 0;
}

.vertical-align {
  display: flex;
  flex-direction: row;
}

.vertical-align>[class^="col-"],
.vertical-align>[class*="col-"] {
  display: flex;
  align-items: center;
  /* Align the flex-items vertically */
  justify-content: center;
  /* Optional, to align inner flex-items horizontally within the column  */
}

@media (max-width: 575.99px) {
  .article {
    height: 300px;
  }

  .sarticle {
    height: 150px;
  }
}

@media (min-width: 576px) and (max-width: 767.99px) {}

@media (min-width: 768px) and (max-width: 991.99px) {
  .logo img {
    height: 150px;
  }
}

@media (min-width: 992px) and (max-width: 1199.99px) {}

@media (min-width: 1200px) {
  .col-lg-2 {
    width: 20%;
  }

  .logo img {
    height: 150px;
  }
}
