@CHARSET "utf-8";

/* Reset */
/*html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;vertical-align:baseline;background:transparent;margin:0;padding:0;}*/
/* do not reset ul/li */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;vertical-align:middle;background:transparent;margin:0;padding:0;}


/* BEGIN: Fonts Settings */
@font-face {
	font-family: 'Inter';
	src: url('../fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Inter';
	src: url('../fonts/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans';
	src: url('../fonts/NotoSans-VariableFont_wdth,wght.ttf') format('truetype');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans';
	src: url('../fonts/NotoSans-Italic-VariableFont_wdth,wght.ttf') format('truetype');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}
/* END: Fonts Settings */


/* Fix */
.fix{clear:both;width:100%;}
.fix:after {content: ".";display:block;height: 0;clear: both;visibility: hidden;}
.clear{clear:both;}

/* Common & HTML */
body {font-family: "Inter", "Noto Sans", sans-serif;}

.font9 {font-size:14px;color:white;background-color:black;}
.font10 {font-size:14px;color:white;background-color:red;}

/* BEGIN: Menu List Function */
th {background:#f1bb6f;font-size:12px;}
th a{color:#7a3800;font-size:12px;}
tr.odd{background:#FFDDAA;font-size:12px;}
tr.odd:hover{background:#FFBB66;font-size:12px;}
tr.even{background:#efdbbd;font-size:12px;}
tr.even:hover{background:#FFBB66;font-size:12px;}
/* END: Menu List Function */

a {text-decoration:none; font-family: "Inter", "Noto Sans", sans-serif;}
a:hover {text-decoration:underline}

input, select, textarea {font-family: "Inter", "Noto Sans", sans-serif;}
select, input[type=button], input[type=submit] ,button {cursor:pointer;}

input[type=button] {color:#fff; background-color:#2a6389; border: 2px solid; border-color: #767d9a; height:24px;
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#2a6389',EndColorStr='#125c8c');cursor: pointer;}
input[type=submit] {color:#fff; background-color:#2a6389; border: 2px solid; border-color: #767d9a; height:24px;
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#2a6389',EndColorStr='#125c8c');cursor: pointer;}
input[readonly] {background: #DDDDDD; color: #000000}

textarea[readonly] {background: #DDDDDD; color: #000000}

.loginInput{height:23px; background:#236895; color:#fff;}

h1{ font-family: "Inter", "Noto Sans", sans-serif; font-size:32px; font-weight:bold; color: #069;}
h2{ font-family: "Inter", "Noto Sans", sans-serif; font-size:26px; font-weight:bold; color: #069; background:url('../images/h2bg.png') no-repeat left bottom;}
h3{ font-family: "Inter", "Noto Sans", sans-serif; font-size:20px; font-weight:bold; color: #069;}
h4{ font-family: "Inter", "Noto Sans", sans-serif; font-size:14px; color: #333;}


form{
	padding:0px; margin-top:0px; 
	background:#f4f5f4; 
	margin-bottom:5px; 
	font-size:16px;
}

form.loginForm{
	background:#fff;
}
form.logout{
	width:910px;
	padding:0px; margin-top:0px; background:white; margin-bottom:0px; font-size:12px;
}
form.subform{
	width:800px;
	padding:0px; margin-top:0px; background:#f4f5f4; margin-bottom:5px; font-size:14px;
}

.LoadingPic{
	background:url('../images/load.gif') no-repeat center;
	position: fixed; 
	top: 200px;
	margin-left: auto;
	margin-right: auto;
}

/* Layout */
.positionCenter{margin:0 50px; background-color:#fff;}
.banner {height:100px;}
.login {height:445px; margin-bottom:10px;}
.contents {min-height:100px; padding:0 5px;}
.leftcontent{float:left; background:#fff url('../images/leftcontentbg.jpg') repeat-y; min-height:300px; width:150px;}
.rightcontent{margin-left:160px;}
.footer {height:20px;}
.messageborder {border:2px solid #FF9E9E; width:100%; font-size:16px; background-color:#FFBDBD;}
.conditionborder {border:2px solid #ccc; width:100%; font-size:12px;}
.notetext {color:#069; font-size:11px; padding:3px 0 5px 10px;}
.showborder {border-collapse:collapse; border:1px solid black; font-size:12px;}
.showborder tr { border:1px solid black;}
.showborder td { border:1px solid black;}
.noborder {border-collapse:collapse; border:0px; font-size:12px; }
.noborder tr { border:0px;}
.noborder td { border:0px;}

.font7 {font-size:14px;color:white;background-color:#999999;CURSOR: pointer; border: 1px solid #333333;}
.font5 {font-size:12px}

/* Logo (ZyXEL) */
.logo_zyxel {float:left; margin-left:3px;}

/* Menu */
.topmenu {float:left;}
.mainmenu {float:left; margin:50px 0 3px 10px; list-style:none;}
.mainmenu li {float:left; font-size:13px; font-weight:bold;}
.mainmenu li a {color:#333; margin:0 10px;}
.mainmenu li a:hover {color:#666;}
.mainmenu li span {font-size:12px;}

/* Logo */
.logo_eshop {float:right; margin-top:10px; font-family: "Inter", "Noto Sans", sans-serif; font-size:36px; font-style:italic; color:#00579e;}
.logo_eshop a {color:#00579e;}
.logo_eshop a:hover {text-decoration:none;}

/* Login (Flash) */
.loginflash {float:left; margin-left: 87px;}

/* Login (Table) */
.loginTable {margin: 250px 0 0 -60px; font-size:12px;}
.loginTableRow td{line-height:28px;}
.loginbutton {text-align:center;cursor: pointer;}
.forgetpwd {padding-left:64px;}

/* Login (Table) Flash */
.flashmainLogin {position:absolute;right: 0px;height:100%;width:250px;background-color:rgba(255, 255, 255, 0.4);
				filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#9Affffff', endColorstr='#9Affffff'); /* IE */
}
.flashmainLogin a {color:#333;}
.flashmainLogin a:hover {color:#666;}

/* Login Information (Left Content) */
.logininfo {padding:10px; font-size:12px;}

.datagrid {padding:10px; background:#f4f5f4; font-size:12px;}
.displayTagGrid {
	width:95%;
	padding:10px;
	margin-top:30px;
	margin-bottom:5px;
	font-size:14px;
}
.displayTagGrid tr {line-height:20px; text-align:center; vertical-align:middle;}
.displayTagGrid td {line-height:20px; text-align:left; vertical-align:middle;}
.displayTagContent{overflow: auto; height:350px;;}

.tablehead {background:#cbd0cc;}
.odd {background:#c1ced9;}
.even {background:#d2dde4;}

.pagebanner {height:20px; font-size:14px;margin-left:25%}
.pagebanner a {color:#3366cc;}
.pagelinks {height:20px; font-size:14px;}
.pagelinks a {color:#3366cc;}


/* About Us */
.overviewtext {font-family: "Inter", "Noto Sans", sans-serif; padding-left:5px; font-size:12px; color:#333;}

/* Forget Password */
.forgetpassword {background:#f4f5f4; margin-left:5px; font-size:13px; height:400px; width:900px; display:table-cell; vertical-align:middle; text-align:center; line-height:30px;}
.forgetpassword span {font-weight:bold;}
.forgetpassword img {position: relative; top:5px;}

/* Sitemap */
.sitemap {padding:0 10px;}
.sitemaptext {font-family: "Inter", "Noto Sans", sans-serif; font-size:28px; color:#00579e;}
.sitemaplist {float:left; width:100%; margin-bottom:20px;}
.sitemaptitle {font-size:16px; font-weight:bold; border-bottom:1px solid #b2b2b2; line-height:30px;}
.sitemapitem {background:#fff url('../images/square.jpg') no-repeat; width:200px; padding-left:15px; font-size:12px; float:left; margin-left:20px; line-height:25px;}

/* Help Page */
.helpLeftContent{float:left; background:#d2dde4; height:500px; width:26%; margin-right:1px;}
.helpLeftContent a{color:#3366cc;}
.helpList{width:100%; margin:10px;}
.helpListItem{padding-left:15px; line-height:20px;}
.helpRightContentDiv{width:73%; float:right;}
.helpRightContentDiv img{width: 100%;}
.helpRightcontent{height:500px; }

/* Footer */
.footerline {height:16px;}
.footertext {height:10px; text-align:right; padding-right:4px; color:#829c9e; font-size:14px;}

.collectionTitle {
	font-family: "Inter", "Noto Sans", sans-serif;
	font-size: 23px; 
	font-weight: bold; 
	color: #069;
	background:url('../images/h2bg.png') no-repeat left bottom;
}

.a_text {
	cursor: pointer;
	color: blue;
}
