@charset "utf-8";
/* CSS Document */
body section {
    position: relative;
}
.carousel-control-prev2 {
  left: -10%;
}

.carousel-control-next2 {
  right: -10%;
}

img{
	max-width:100%
}
#animation_container {
	position:absolute;
	margin:auto;
	left:0;right:0;
	top:0;bottom:0;
}
#x2 {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
}  
#x3 {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
} 
#x4 {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
} 
#x5 {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
} 
  .ad {
    display: none;
}
  .ad2 {
    display: block;
    padding-top: 25%;
    background-color: #976E53;
}
.container_new {
    background-color: #FFF2DF;
    width: 100%;
    margin-top: 0%;
    padding-top: 10%;
    text-align: center;
    padding-bottom: 80%;
    clip-path: polygon(0 0, 100% 0%, 100% 92%, 0% 100%);
    display: block;
    background-image: url(../images/pattern.png),url(../images/pattern1.png);
    background-repeat: no-repeat;
    background-position: -80% 2%,155% 90%;
    background-size: 60% auto;
}
#brand {
    width: 100%;
    display: block;
    background-color: #FFFFFF;
    position: relative;
    padding-top: 10%;
    padding-bottom: 5%;
}
#news {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}
h3 {
    background-color: #976E53;
    width: 50%;
    color: #FFFFFF;
    line-height: 60px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3%;
    clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 89%);
    -webkit-box-shadow: 0px 0px 3px #888888;
    box-shadow: 5px 0px 5px #0000000;
    display: block;
}
footer {
    width: 100%;
    position: relative;
    margin: 0;
    padding-top: 10%;
}
.news_card {
    background-color: #FFFFFF;
    padding-left: 1%;
    padding-right: 1%;
    -webkit-box-shadow: 0px 0px 3px #868686;
    box-shadow: 0px 0px 3px #868686;
    margin-left: 1%;
    margin-bottom: 10%;
	 margin-right: 1%;
    width: 100%;
    padding-bottom: 15%;
	display: inline-block;
}
.pushpin {
    background-color: #976E53;
    width: 30px;
    height: 30px;
    border-radius: 999em;
    margin-top: 5%;
    margin-left: 45%;
    -webkit-box-shadow: inset 0px 3px 5px #FFFFFF,0px 1px 5px #000000;
    box-shadow: inset 0px 3px 5px #FFFFFF,0px 1px 5px #000000;
    margin-bottom: 5%;
}
.nwes_p {
    font-size: 11pt;
    font-family: "Noto Sans Mono CJK TC Regular";
    line-height: 30px;
    width: 100%;
    display: block;
    margin-top: 10%;
    text-align: left;
}
.news_card img {
    width: 100%;
    height: 60%;
}
.sort {
    width: 100%;
    display: block;
	padding-top: 3%;
    padding-bottom: 5%;
}
.time {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 9pt;
    line-height: 30px;
    color: #6E6E6E;
    float: left;
}
.species {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 10pt;
    line-height: 30px;
    color: #FFFFFF;
    background-color: #EC0003;
    float: right;
    padding-left: 5%;
    padding-right: 5%;
}
.species2 {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 10pt;
    line-height: 30px;
    color: #FFFFFF;
    background-color: #cfa972;
    float: right;
    padding-left: 5%;
    padding-right: 5%;
}
.species3 {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 10pt;
    line-height: 30px;
    color: #FFFFFF;
    background-color: #00479d;
    float: right;
    padding-left: 5%;
    padding-right: 5%;
}
h7 {
    font-size: 14pt;
    line-height: 30px;
	display : inline;
	white-space:nowrap;
}
.watch_more  {
    background-color: #976E53;
    border-radius: 10px;
    color: #FFFFFF;
    text-decoration: none;
    width: 40%;
    margin-left: 30%;
	transition: all 0.5s ease 0s;
}
.watch_more:hover {
    background-color: #6a3906;
}
.watch_more1  {
    color: #FFFFFF;
    text-decoration: none;
}
#brand_p {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 11pt;
    line-height: 30px;
    color: #020202;
    width: 80%;
    margin-top: 5%;
    margin-right: 10%;
    margin-bottom: 40%;
    margin-left: 10%;
    text-align: justify;
}
#commendatur_products {
    background-color: #fff2df;
    padding-top: 30%;
    padding-bottom: 50%;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 92%);
    padding-left: 10%;
    padding-right: 10%;
}
.commendatur_products1 {
    background-color: #f0e5da;
}
.commendatur_products2 {
    margin: 0;
    padding: 0;
    width: 100%;
    display: block;
	padding-bottom: 10%;
}
.commendatur_products3 {
    width: 100%;
    display: block;
	margin-bottom: 20%;
}
.watch_more2  {
    background-color: #976E53;
    color: #FFFFFF;
    text-decoration: none;
    width: 70%;
    margin-left: 15%;
    transition: all 0.5s ease 0s;
    text-align: center;
    background-image: url(../images/arrow.png);
    background-position: 90% center;
    background-repeat: no-repeat;
}
.watch_more2:hover {
    background-color: #6a3906;
}
.commendatur_products_shadow {
	-webkit-box-shadow: 0px 0px 3px #707070;
    box-shadow: 0px 0px 3px #707070;
	margin-top: 20%;
}
#shopping_area {
    display: block;
}
.watch_more3  {
    background-color: #976E53;
    color: #FFFFFF;
    text-decoration: none;
    width: 70%;
    margin-left: 15%;
    transition: all 0.5s ease 0s;
    text-align: center;
    background-image: url(../images/arrow.png);
    background-position: 90% center;
    background-repeat: no-repeat;
}
.watch_more3:hover {
    background-color: #6a3906;
}
.shopping_card {
    border: 1px solid #AF8362;
}
.footer1 {
	background-color: #976e53;
}
.footer2 {
	background-color: #616161;
}
.contact-method.ul {
    list-style-type: none;
}
.brand-box {
	background-color: #fff2df;
}


@media only screen and (min-width: 481px) {

.nav-link {
  padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
  .ad {
  display: none;
}
  .ad2 {
  display: block;
  padding-top: 14%;
  background-color: #976E53;
}
.container_new {
    background-color: #FFF2DF;
    width: 100%;
    margin-top: 0%;
    padding-top: 5%;
    text-align: center;
    padding-bottom: 10%;
    clip-path: polygon(0 0, 100% 0%, 100% 92%, 0% 100%);
    display: block;
	background-image: url(../images/pattern.png),url(../images/pattern1.png);
    background-repeat: no-repeat;
    background-position: -30% 0%,120% 90%;
	background-size: 40% auto;
}
#news {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
h3 {
    background-color: #976E53;
    width: 30%;
    color: #FFFFFF;
    line-height: 60px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3%;
	clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 89%);
}
#brand {
    width: 100%;
    display: block;
    background-color: #ffffff;
    position: relative;
	background-image: url(../images/cofe1.png),url(../images/cofe2.png),url(../images/cofe3.png),url(../images/cofe4.png);
    background-repeat: no-repeat;
    background-position: 3% 3%,100% 15%,-50% 100%,150% 90%;
    background-size: 35% auto,30% auto,50% auto,50% auto;
    padding-top: 5%;
    padding-bottom: 5%;
}
.news_card {
    background-color: #FFFFFF;
    padding-left: 1%;
    padding-right: 1%;
    -webkit-box-shadow: 0px 0px 3px #868686;
    box-shadow: 0px 0px 3px #868686;
    margin-left: 1%;
    margin-right: 1%;
    width: 30%;
    padding-bottom: 3%;
	display: inline-block;
}
h7 {
    font-size: 12pt;
    line-height: 30px;
    display : inline;
	white-space:nowrap;
}
.nwes_p {
    font-size: 11pt;
    font-family: "Noto Sans Mono CJK TC Regular";
    line-height: 30px;
    width: 100%;
    display: block;
    margin-top: 15%;
    text-align: left;
}
.watch_more  {
    background-color: #976E53;
    border-radius: 10px;
    color: #FFFFFF;
    text-decoration: none;
    width: 20%;
    margin-left: 43%;
	transition: all 0.5s ease 0s;
}
.watch_more:hover {
    background-color: #6a3906;
}
#brand_p {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 11pt;
    line-height: 30px;
    color: #020202;
    width: 40%;
    margin-top: 5%;
    margin-right: 30%;
    margin-bottom: 20%;
    margin-left: 30%;
    text-align: justify;
}
#commendatur_products {
    background-color: #fff2df;
    padding-top: 30%;
    padding-bottom: 30%;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 92%);
    padding-left: 10%;
    padding-right: 10%;
}
.commendatur_products1 {
    background-color: #f0e5da;
}
.commendatur_products2 {
    width: 70%;
    display: block;
    margin-right: 15%;
    margin-left: 15%;
	margin-top: 5%;
    margin-bottom: 5%;
    padding-bottom: 0px;
    padding-right: 5%;
}
.cpp1 {
    display: block;
    border-bottom: 1px solid #6A3906;
    font-size: 15pt;
    line-height: 30px;
    padding-top: 2%;
    padding-bottom: 2%;
}

.commendatur_products3 {
    width: 100%;
    display: block;
    margin-top: 5%;
    margin-bottom: 5%;
}
.watch_more2  {
    background-color: #976E53;
    color: #FFFFFF;
    text-decoration: none;
    width: 30%;
    margin-left: 35%;
    transition: all 0.5s ease 0s;
    text-align: center;
    background-image: url(../images/arrow.png);
    background-position: 90% center;
    background-repeat: no-repeat;
}
.watch_more2:hover {
    background-color: #6a3906;
}
.commendatur_products_shadow {
	-webkit-box-shadow: 0px 0px 3px #707070;
    box-shadow: 0px 0px 3px #707070;
	margin-top: 5%;
}
}

@media only screen and (min-width: 769px) {
.f1 {
 border-right: 1px solid #FFFFFF;
}
.f2 {
 display:  inline-block;
 height: 100%;
 vertical-align: text-top;
}
.ad {
    display: block;
    padding-top: 4%;
	background-color: #976E53;
}
.ad2 {
 display: none;
}
.container_new {
    background-color: #FFF2DF;
    width: 100%;
    margin-top: 0%;
    padding-top: 3%;
    text-align: center;
    padding-bottom: 10%;
    clip-path: polygon(0 0, 100% 0%, 100% 92%, 0% 100%);
    display: block;
    background-image: url(../images/pattern.png),url(../images/pattern1.png);
    background-repeat: no-repeat;
    background-position: -10% 0%,105% 90%;
	background-size: 25% auto;
}
h3 {
    background-color: #976E53;
    width: 18%;
    color: #FFFFFF;
    line-height: 60px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3%;
	clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 89%);
}

#news {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}
#brand {
    width: 100%;
    display: block;
    background-color: #ffffff;
    position: relative;
    background-image: url(../images/cofe1.png),url(../images/cofe2.png),url(../images/cofe3.png),url(../images/cofe4.png);
    background-repeat: no-repeat;
    background-position: 5% 5%,90% 10%,-5% 100%,105% 90%;
    background-size: 20% auto,20% auto,30% auto,30% auto;
    padding-top: 5%;
    padding-bottom: 5%;
}
.news_card {
    background-color: #FFFFFF;
    padding-left: 1%;
    padding-right: 1%;
    -webkit-box-shadow: 0px 0px 3px #868686;
    box-shadow: 0px 0px 3px #868686;
    margin-left: 1%;
    margin-right: 1%;
    width: 30%;
    padding-bottom: 5%;
    display: inline-block;
}
h7 {
    font-size: 18pt;
    line-height: 30px;
	display : inline;
	white-space:nowrap;
}
.nwes_p {
    font-size: 11pt;
    font-family: "Noto Sans Mono CJK TC Regular";
    line-height: 30px;
    width: 100%;
    display: block;
    margin-top: 10%;
    text-align: left;
}
.watch_more  {
    background-color: #976E53;
    border-radius: 10px;
    color: #FFFFFF;
    text-decoration: none;
    width: 20%;
    margin-left: 40%;
	transition: all 0.5s ease 0s;
}
.watch_more:hover {
    background-color: #6a3906;
}
#brand_p {
    font-family: "Noto Sans Mono CJK TC Regular";
    font-size: 11pt;
    line-height: 30px;
    color: #020202;
    width: 40%;
    margin-top: 5%;
    margin-right: 30%;
    margin-bottom: 20%;
    margin-left: 30%;
    text-align: justify;
}
#commendatur_products {
    background-color: #fff2df;
    padding-top: 10%;
    padding-bottom: 20%;
    clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 92%);
    padding-left: 10%;
    padding-right: 10%;
}
.commendatur_products1 {
    background-color: #f0e5da;
}
.commendatur_products2 {
    width: 40%;
    display: inline-block;
    border-right: 1px solid #976E53;
    margin-right: 5%;
    margin-left: 5%;
	margin-top: 5%;
    margin-bottom: 5%;
    padding-bottom: 0px;
    padding-right: 5%;
	vertical-align:top;
}
.cpp1 {
    display: block;
    border-bottom: 1px solid #6A3906;
    font-size: 15pt;
    line-height: 30px;
    padding-top: 2%;
    padding-bottom: 2%;
}

.commendatur_products3 {
    width: 45%;
    display: inline-block;
    margin-top: 5%;
    margin-bottom: 5%;
	vertical-align:top;
}
.watch_more2  {
    background-color: #976E53;
    color: #FFFFFF;
    text-decoration: none;
    width: 40%;
    margin-left: 0%;
    transition: all 0.5s ease 0s;
    text-align: center;
    background-image: url(../images/arrow.png);
    background-position: 90% center;
    background-repeat: no-repeat;
}
.watch_more2:hover {
    background-color: #6a3906;
}
.commendatur_products_shadow {
	-webkit-box-shadow: 0px 0px 3px #707070;
    box-shadow: 0px 0px 3px #707070;
	margin-top: 5%;
}
.nav-link {
  padding-top: 0.1rem;
padding-bottom: 0.1rem;
}
}


#cofe {
    text-align: center;
    width: 40%;
    margin-top: 5%;
    margin-left: 30%;
    display: block;
	-webkit-animation-duration: 20s;
	-moz-animation-duration: 20s;
	-ms-animation-duration: 20s;
	-o-animation-duration: 20s;
	-webkit-animation-name: slidein_2;
	-moz-animation-name: slidein_2;
	-ms-animation-name: slidein_2;
	-o-animation-name: slidein_2;
	animation-iteration-count: infinite;
	animation-direction: normal;
	transform: scale(1,1);
}
@keyframes slidein_2 {
  from   {transform: rotate(0deg)scale(1,1);}
  to   {transform: rotate(360deg)scale(1,1);}
}