@charset "utf-8";
/* CSS Document */
*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html{-webkit-overflow-scrolling: auto; scroll-behavior: auto;}
html,body{color: #333333; font-size: 16px; line-height: 1.5; }

.nono{display:block;}
@media(max-width:600px){.nono{display:none;}}

a{text-decoration: none!important; color: inherit;}
th{text-align: center;}
img{width:100%; height: auto;}

.over{}
@media(max-width:768px){.over{overflow-x: auto;}}

/*marquee*/
.img_contain {
	float: left;
	height: 240px;
	width: 250px;
	padding: 10px 0 5px 0;
	text-align: center;
	font-size: 15px;
	}
.mx-auto{margin-right:auto!important}
.mx-auto{margin-left:auto!important}
.d-block{display:block!important}
.txt-white{color:white; }
@media screen and (min-width:768px){}

/* margin-m padding-p*/
/*from bootstrap https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css*/
.m-0{margin:0!important}.mt-0,.my-0{margin-top:0!important}.mr-0,.mx-0{margin-right:0!important}.mb-0,.my-0{margin-bottom:0!important}.ml-0,.mx-0{margin-left:0!important}.m-1{margin:.25rem!important}.mt-1,.my-1{margin-top:.25rem!important}.mr-1,.mx-1{margin-right:.25rem!important}.mb-1,.my-1{margin-bottom:.25rem!important}.ml-1,.mx-1{margin-left:.25rem!important}.m-2{margin:.5rem!important}.mt-2,.my-2{margin-top:.5rem!important}.mr-2,.mx-2{margin-right:.5rem!important}.mb-2,.my-2{margin-bottom:.5rem!important}.ml-2,.mx-2{margin-left:.5rem!important}.m-3{margin:1rem!important}.mt-3,.my-3{margin-top:1rem!important}.mr-3,.mx-3{margin-right:1rem!important}.mb-3,.my-3{margin-bottom:1rem!important}.ml-3,.mx-3{margin-left:1rem!important}.m-4{margin:1.5rem!important}.mt-4,.my-4{margin-top:1.5rem!important}.mr-4,.mx-4{margin-right:1.5rem!important}.mb-4,.my-4{margin-bottom:1.5rem!important}.ml-4,.mx-4{margin-left:1.5rem!important}.m-5{margin:3rem!important}.mt-5,.my-5{margin-top:3rem!important}.mr-5,.mx-5{margin-right:3rem!important}.mb-5,.my-5{margin-bottom:3rem!important}.ml-5,.mx-5{margin-left:3rem!important}.p-0{padding:0!important}.pt-0,.py-0{padding-top:0!important}.pr-0,.px-0{padding-right:0!important}.pb-0,.py-0{padding-bottom:0!important}.pl-0,.px-0{padding-left:0!important}.p-1{padding:.25rem!important}.pt-1,.py-1{padding-top:.25rem!important}.pr-1,.px-1{padding-right:.25rem!important}.pb-1,.py-1{padding-bottom:.25rem!important}.pl-1,.px-1{padding-left:.25rem!important}.p-2{padding:.5rem!important}.pt-2,.py-2{padding-top:.5rem!important}.pr-2,.px-2{padding-right:.5rem!important}.pb-2,.py-2{padding-bottom:.5rem!important}.pl-2,.px-2{padding-left:.5rem!important}.p-3{padding:1rem!important}.pt-3,.py-3{padding-top:1rem!important}.pr-3,.px-3{padding-right:1rem!important}.pb-3,.py-3{padding-bottom:1rem!important}.pl-3,.px-3{padding-left:1rem!important}.p-4{padding:1.5rem!important}.pt-4,.py-4{padding-top:1.5rem!important}.pr-4,.px-4{padding-right:1.5rem!important}.pb-4,.py-4{padding-bottom:1.5rem!important}.pl-4,.px-4{padding-left:1.5rem!important}.p-5{padding:3rem!important}.pt-5,.py-5{padding-top:3rem!important}.pr-5,.px-5{padding-right:3rem!important}.pb-5,.py-5{padding-bottom:3rem!important}.pl-5,.px-5{padding-left:3rem!important}

/*topnav*/
.topnav {
  overflow: hidden;
  background-color: #B8B5B3;}
.topnav a {
	float: left;
  	font-weight: bold;
  	display: block;
  	color: #000000;
  	text-align: center;
 	padding: 8px 25px;  
  	font-size: 17px; 
	font-family: Times, Times New Roman, serif;}

.topnav a:hover {
  background-color: #602C30;
  color: white;}

.topnav a.active {
  background-color: #8F1616;
  color: white;}

.topnav .icon {
  display: none;
}
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon { float: right; display: block;}}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon { position: absolute; right: 0; top: 0;  }
  .topnav.responsive a { float: none; display: block; text-align: left; }}

.translatemargin{margin-top:20px;}
@media (max-width:560px){.translatemargin{margin-top:0;}}

/*sidemenu*/
#side-modal{
	display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; padding-top: 100px;
	background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); z-index: 1; overflow-x: auto;
	}	
	
.sidemenu{
	position: fixed;
	height: 100%;
	width: 70%;
	background: #E5DBD6;
	z-index:1;
	top: 0;
	left: 0;
	overflow-x: auto;
	transform: 0.5s;
	padding-top: 40px;
}	
	.sidemenu a{ 
	padding: 8px 15px 8px 20px;
	font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;
	font-size: 15px;line-height: 20px;
	color: black;
	display: block;
	transition: 0.3s;
	}
	
	.sidemenu a:hover {  background: #BD9F90;color: white;}
    .sidemenu a.active {  font-weight: bold;background: #E5DBD6;color: black;}	
    .sidemenu a:hover:not(.active) {  background: #BD9F90;color: white;}
    .sidemenu .closebtn {  position: absolute;  top: 5px;  right:10px;  font-size: 35px;  margin-left: 50px;}
	
    .closebtn:hover, .closebtn:focus {  color: #000;  text-decoration: none;  cursor: pointer;}

	#sideBtn {
		display: none;
		position: fixed;
		z-index: 1;
		top:100px;
		right: 0;
		transition: 0.3s;
		padding:10px 12px 10px 10px;
		width: 30px;		
		color: white;
		border-radius: 5px 0 0 5px;
		border: none;
        outline: none;
		background:#636363;
	}		
	
	@media(max-width:767px){#sideBtn {display:block;} }	

/*sidebar*/
.sidebar { width:100%; top: 0; overflow: auto; padding-right:15px;}
.sidebar a {
	float: none;  
	display: block;  
	color: black;
  	background-color: #E5DBD6;  
	padding: 2px 3px 2px 6px;  
  	margin-bottom: 0.3em; 
	font-size: 0.88rem;  
	font-weight: 600; 
	font-family: Times New Roman, serif; 
	letter-spacing: -0.1px;
	min-height: 2.4em;
}

.sidebar a.active {
  background-color: #602C30; font-size: 1rem;
  color: white; padding: 8px 6px;
}
.sidebar a:hover:not(.active) {
  background-color: #BD9F90;
  color: black;
}
/*li*/
.sidebar div a { font-size: 0.85rem;background: #DFE0DF; font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif"; font-weight: 600;}

.sidebar div a:hover:not(.active) {
  background-color: #CDCDCB;
  color: black;
}
.sidebar .icon {
  display: none;}

@media screen and (max-width: 767px) {
.sidebar {
    width: 100%;
    height: auto;
    position: relative;
	}
.sidebar a {
	text-align: center;
    float: none;
	display: none;
	}
.icon { float: left; display: block;}
}


.clearfix:after {
  display: block;
  content: "";
  clear: both;
}
#content{float: right;}
.sidepadding{padding-left:0px;}
@media(max-width:985px) {.sidepadding{padding-left:10px;}}	
@media(max-width:768px) {.sidepadding{padding-left:5px;}}	
@media(min-width:540px) {.sidepadding{padding-left:0px;}}	
/*Navigation bar */



/*wordsite*/
.lin-Introduction{font-family:Cambria;}
.lin-space{padding:4.2em 7em;}
.lin-contactsp{padding:4.2em 10em;}
.lin-contactfont{font-size:18px; color: black; padding: 0 0 1.5em 0; font-family:Arial;}
.lin-contactitle{font-size:20px; color:yellow; font-family:Arial," sans-serif";font-weight: bold;}
.lin-aboutfont{font-size: 18px; color: white; padding: -2px 0 0.9em 0; font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif"; line-height: 30px;}

@media (max-width: 992px) {.lin-space{padding:2em 1.5em;} .lin-aboutfont{ font-size: 16px; padding: 0 0 0.6em 0; line-height: 26px} .lin-contactsp{padding:4.2em 1.5em;} .lin-contactfont{font-size:16px; color: black; padding: 0 0 0.5em 0; font-family:Arial;} .lin-contactitle{font-size:18px; color:yellow;  font-family:Arial ," sans-serif";font-weight: bold;}}

/*backgroung sitting*/
.lin-bg6A2{background-color:#c6c6a2;}
.lin-bgfa0{background-color:#578fa0;}
.lin-bg5b3{background-color:#B8B5B3;}
.lin-bged1{background-color:#82BED1;}
.lin-bg56c{background-color:#A8956C;}
.lin-bg5c9{background-color:#82B5C9;}

/*color bar*/
.redbar{width:100%; height:15px;background: #602c30;}
.mq-redbar{width:100%; height:8px;background: #602c30;}
.redbg{background: #602c30;}
/*title bar*/
.lin-redtitle{
	color: whitesmoke;
	background-color: #602C30;	
	font-family: Times New Roman, serif;
	font-size: 1.5rem;	
    font-weight: bold;
	padding: 4px 10px;
	margin-bottom: 5px;
	letter-spacing: -0.5px;
	}
.lin-redtitle a{color: whitesmoke;}
.lin-bluetitle{
	color: whitesmoke;
	background-color: #194593;	
	font-family: Arial," sans-serif";
	font-size: 1.1rem;	
	letter-spacing: 0.1px;
	font-weight: bolder;
	padding: 1px 10px; margin-bottom: 5px;
	}

h1,h2,h3,h4,h5,h6,p{ 
	margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;}
h5{margin-left: 6px;}
.title-03{	
	font-size: 15px;
	color: #333333;
	line-height: 18px;
	font-weight: bold;
	font-family: "Arial Black", Gadget, sans-serif;	
}

/*content title*/
.mq-text {
	font-size: 15px;
	color: #333333;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 16px;padding-top: 5px;margin: 0;
	}
.mq-text a {
	color: #333333;
	}	
.title-span
	{
	font-size: 15px;
	color: white;
	font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif";
	font-weight: bold;
	line-height: 25px;
	background-color: #999900;
	border:3px #999900 solid;	
	}
@media(max-width:960px){.lin-redtitle{ font-size: 1.3rem; padding: 3px 15px; } .lin-bluetitle{font-size: 1rem;letter-spacing: -0.1px;	font-weight: bold; padding: 2px 15px;} .title-03 {font-size: 14.5px;line-height: 17px;}}
@media(max-width:768px){.lin-redtitle{ letter-spacing: 0.2px; font-weight: 600;} .lin-bluetitle{letter-spacing: 0.2px; font-weight: 600; padding: 1px 16px;} .title-03 {font-size: 14.3px;line-height: 16px;padding-bottom: 2px;}}
/*content*/
.content-01{
	font-size: 1rem;
	font-weight: lighter;
	font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;
	text-align: left;
}
.pageproduct {
	color: #333333;
	font-size: 12px;
	font-weight: 200;
	font-family: Tahoma, Geneva, sans-serif;
	line-height: 15px;
	vertical-align: middle;
	padding-top: 2px;
	}
.pageproduct a {
	color: #333333;
	}
@media(max-width:586px){.pageproduct{font-weight: bold;font-size: 12.5px;}}
.related {
	color: white;
	font-size: 15px;
	font-weight: bold;
	font-family: "MS Serif", "New York", serif;
	text-align: left;
	background-color: orange;
	border: 2px orange solid;
	}
.related a {
	color: white;
	}
.Peripheral{
	color: white;
	font-size: 15px;
	font-weight: bold;
	font-family: "MS Serif", "New York", serif;
	text-align: left;
	background-color: #FF5F00;
	border: 2px #FF5F00 solid;
	line-height:30px;
	}
.productname{
	color: black;
	font-family: Helvetica Neue, Helvetica, Arial," sans-serif";
	font-size: 12px;
	line-height: 13px;
	padding: 4px 10px;
	font-weight: normal;
	background: #DBDBDB;
	margin-left: 10px;
	border-radius: 4px;
	text-align: center;
	}
.Remark{
    font-family: Baskerville, Palatino Linotype, Palatino, Century Schoolbook L, Times New Roman, serif;
    font-size: 14px;
	font-weight: bold;
	line-height: 15px;
		}
@media(max-width:568px){.Remark{font-size:11px;line-height: 13px;}}
@media(max-width:586px){.content-01{ line-height: 1.6} .Peripheral{font-size: 12px;border: 0.2px #FF5F00 solid;} .related{font-size:11px;border: 0.2px orange solid;}}
.lin-bk{color:black;}
.bold-R{txt-align:right;font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;font-weight: bold;}
.conra{ text-indent: -0.9em; margin-left: 0.95em;}
.conre{ margin-left: 0.1em;}
.ml-10{margin-left:10em;}
.conma-ri{margin-right:2em;}
.conma-ri-1{margin-right:1em;}
.conma-ri-05{margin-right:0.5em;}
.conwd-400{width:400px;}
.conwd-500{width:500px;}
.conwd-700{width:700px;}
.conwd-800{width:800px;}
.conadj{text-align:justify;text-justify: distribute;}
.cotitle{font-weight: bold;margin: 0 15px 0 0px;font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;}
.bold{font-weight:bold;}
.martop-5{margin-top:0.5em;}
.margin-t-30{margin-top:30px;}
.margin-t-20{margin-top:20px;}
.margin-t-10{margin-top: 10px;}
.padding-a-2{padding:2px;}
.row-div-items{height: 20vh;display: flex;}
.row-div-items2{height: 40vh;display: flex;}
.row-items{display:flex;flex-direction:row;align-items: center;}
@media(max-width:768px){.row-div-items{height: auto;}.row-div-items2{height: auto;}}
/*Button*/
#topBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color:rgba(148,143,143,0.5);
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 50%;
}

#topBtn:hover {
  background-color:#999900;
}
	
.item-flex{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
}

/*photo*/
.mq-imgpd{
	padding:10px 5px 10px 5px;
}
.imgcover{object-fit: cover;}
.hightbox{height:100%;}
.card{ float:none; padding: 1px; width: 100%; margin-bottom: 1px;}	
.card-150{height:150px;}
.cardbox{	
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;	
	min-height: 40px;
	background: #DBDBDB;
	border-radius: 0.25rem; 
 }
.cardbox p{	
	font-size: 13px;
	line-height: 15px;
	text-align: center;
	padding: 2px 2px 4px 2px;
	margin: 0 auto;}
.boxspace-l{padding-left: 5px;}
.boxspace-r{padding-right: 5px;}
@media(max-width:768px){.boxspace-l{padding-left:none;} .boxspace-r{padding-right:none;}}
@media(max-width:586px){.cardbox p{font-size: 11px;line-height: 12px;}}
.lin-center{width: 100%;height: 100%; margin: auto;display: flex;justify-content: center;align-items: center;}
/*table content*/
.lin-table {
	text-align: center;
	vertical-align: middle;
	line-height: 1.8;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	font-family: "MS Serif", "New York", serif;
	background-color: #C6C6A2;	
	}
table td {padding: 0.5px;}
.content {
	color: #000000;
	text-align: center;
	vertical-align: middle;
	font-size: 12px;
	font-weight: lighter;
	font-family: Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif;
	line-height: 13px;
	padding: 2px;
	}


.application{
	color: black;
	font-family:Gotham, Helvetica Neue, Helvetica, Arial," sans-serif";
	font-size: 13px;line-height: 15px;text-align: center;
	}
.application-box{height: 35px;background:#B8B5B3;width: 100%; margin-top: 2px; display: flex; justify-content: center; align-items: center; 
 }

.txt{font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif";line-height: 15px;ext-align: center;margin: 20px 0 20px 10px;font-size: 12;}

/*footer_chart_txt*/
	.co_txtcenter {	margin: 10px 0; font-size: 12pt; text-align: center; font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif"; vertical-align: middle; line-height: 18pt;}
	.copyright{	font-size:10pt;	margin: 5px 5px;text-align: center;font-family: Gotham, Helvetica Neue, Helvetica, Arial," sans-serif";vertical-align: middle;color:#D5D5D5;}
    .copyright a:hover{color:#FFFCAF;}
	.txtchat{margin:2px 2px;vertical-align: middle;	display: flex;}
	.img_chat{display:block;width: 12%;float: right;margin-left: 22px;padding-right: 5px;}
	.txt_app{margin-right: 5px;align-self: center;display: block;float: right;width: 85%;font-family: Gill Sans, Gill Sans MT, Myriad Pro, DejaVu Sans Condensed, Helvetica, Arial," sans-serif";font-size: 10pt;}
@media screen and (max-width:768px){.img_chat{ width: 10%;padding: 0 2px 0 10px; float:right;} .txt_app{ font-family: Gill Sans, Gill Sans MT, Myriad Pro, DejaVu Sans Condensed, Helvetica, Arial," sans-serif"; font-size: 12pt;}}

/*cookie site*/
.cookie-disclaimer {
  background: #000000;
  color: #FFF;
  opacity: 0.9;
  width: 100%;
  bottom: 0;
  left: 0;
  z-index: 1;
  padding: 0 10px;
  position: fixed;
}
.cookie-disclaimer .container {
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
}

.cookie-disclaimer .cookie-close{
  float: right;
  padding: 10px;
  cursor: pointer;
}