.wrapper {
  clip-path: polygon(0 0, 100% 0%, 100% 72%, 0 100%);
  height: 50%;
}

.wrapper2 {
  clip-path: polygon(0 46%, 100% 0%, 100% 85%, 0 100%);
}

.wrapper3 {
  background-image: url(../images/4.jpg);
  /*背景圖存放路徑*/
}

.wrapper4 {
clip-path: polygon(16% 22%, 100% 0%, 100% 61%, 16% 81%);
}

.wrapper5 {
clip-path: polygon(0 27%, 100% 0%, 100% 61%, 0 88%);
}

.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-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;
	}
}
