@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);

body{
	font-family: "Noto Sans TC", "microsoft jhenghei", sans-serif;	
}

.dropdown-menu li:hover .sub-menu {
  visibility: visible;
}
.dropdown:hover .dropdown-menu {
  display: block;
}

.navbar-brand h1 {
	font-size: 1.17em;
	font-weight: normal;
}
	#zebraLogo{
		width:64px;
	}
@media(max-width:570px){
	.navbar-brand h1 {
	font-size: 0.85em;
	font-weight: normal;
}
	#zebraLogo{
		width:48px;
	}
}
.bg-dark .dropdown-menu, .bg-dark .dropdown-item {
  background-color: #343a40 !important;
}

.bg-cafe, .bg-cafe .dropdown-menu, .bg-cafe .dropdown-item {
  background-color: hsla(15,30%,15%,1.0) !important;
}

@media(min-width:992px){
.navbar-collapse{
	display: flex!important;
	justify-content: flex-end!important;
}
}
@media(min-width:992px){
	.bg-image, .text-content{
		width: 50%;
	}
}
@media(max-width:991px){
	.bg-image, .text-content{
		height:200px;
	}
}
.bg-image, .text-content{
		width: 100%;
	}
.text-content{
	padding: 30px;
}
.carousel-caption{
	bottom:45%;
	
}


h1{font:300 1.5em;color:#ff0000;}
h2{font:300 1.5em;color: rgb(255, 255, 255);}
h3{font:300;color}
h4{font:300 1.5em;}
h5{font:300 1.5em;;}
h6{font:3001.5em;}
hr {
	border-top: 3px solid #ff0000;
	width: 100px;
	margin-top: 10pt;
	margin-bottom: 30pt;
}
p{
	{font:300 0.5em; color: #000;}
}


.section-bgi-1 {  background-image: url(../images/sectionBG01.jpg); padding: 200px 15px; background-attachment: fixed; }
.section-bgi-2 {  background-image: url(../images/sectionBG02.jpg); padding: 200px 15px; background-attachment: fixed; }

.bg-image{
	background-size: cover;
	background-position: center center;
}
.productBG1{background-image: url(../images/product-01.jpg)}
.productBG2{background-image: url(../images/product-02.jpg)}
.productBG3{background-image: url(../images/product-03.jpg)}
.productBG4{background-image: url(../images/product-04.jpg)}
.card{
	border: none;
}


.zebra-footer{
	padding: 5em 0;
	background-color: rgb(255, 0, 8);
	color: rgba(255,255,255,0.58);
}

.zebra-footer h3{
	color: rgba(255,255,255,1.00)
}
.footer-list-space li{
	margin: 1em 0;
}

.footer-list-space a:link{
	color: rgb(255, 255, 255);
	text-decoration: none
}

.footer-social a {
  line-height: 0;
  border-radius: 50%;
  margin: 0 5px 5px 0;
  border: 1px solid rgba(245, 206, 206, 0.1);
  width: 30px;
  height: 30px;
  text-align: center;
  display: inline-block;
}

.footer-social a:hover {
  background: #fff;
  border-color: #fff;
  color: #000;
}