a:link{color: #0000cc;	text-decoration: none;}
a:visited {color: #336699; text-decoration: none;}
a:hover {color: #666666; text-decoration: underline;}
a:active {color: #666666; text-decoration: underline;}
a.hmenu:link,a.hmenu:active,a.hmenu:visited,.hmenu{font-size:14px; font-weight: bold; color: #000000; text-decoration: none; margin: 0; padding:0; line-height: 30px;}
a.hmenu:hover{font-size:14px; font-weight: bold; color: #ff3300; text-decoration: none; margin: 0; padding:0; line-height: 30px;}

#main { top: 20px; width: 970px; height:2000px; margin: 0px auto; padding: 0px auto; position: relative;}

a.linktextblack:link,a.linktextblack:active,.linktextblack,a.linktextblack:visited{font-size:12px; font-weight: normal; color: #000000; text-decoration: none; margin: 0; padding:0; line-height: 17px;}
a.linktextblack:hover{font-size:12px; font-weight: normal; color: #666666; text-decoration: none; margin: 0; padding:0; line-height: 17px;}

.textblack {font-size:13px; font-weight: normal; color: #000000; margin: 0; padding:0; line-height: 20px;}
.textblackb {font-size:13px; font-weight: bold; color: #000000; margin: 0; padding:0; line-height: 20px;}

.textgray {font-size:12px; font-weight: normal; color: #666666; margin: 0; padding:0; line-height: 20px;}

.magnifyarea { /* CSS to add shadow to magnified image. Optional */
	box-shadow: 5px 5px 7px #b5b3b3;
	-webkit-box-shadow: 5px 5px 7px #b5b3b3;
	-moz-box-shadow: 5px 5px 7px #b5b3b3;
	filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
	background: white;
	font-size:13px; font-weight: normal; color: #000000; margin: 0; padding:0; line-height: 20px;
}
<link href="../styles.css" rel="stylesheet" type="text/css" />

<!--font-->
<link href="https://fonts.googleapis.com/css?family=Chakra+Petch|Kanit|Pridi&display=swap" rel="stylesheet">