/**
 * ปรับปรุง : 2567-12-18
 * Prototype : http://www.thaiall.com/web2/
 * Shared : http://thaiall.github.io/www/web2/
 * Pass : https://jigsaw.w3.org/css-validator/
* Test : http://www.thaiall.com/web2/file_pagespeed.php?fieldset=blank&t=671027
@font-face{font-family:'AlexBrush';src:url('rsp_alexbrush.ttf');font-display:optional;}
@font-face{font-family:'Sawasdee';src:url('rsp_sawasdee.ttf');font-display:optional;}
@font-face{font-family:'THChakraPetch';src:url('rsp_thchakrapetch.ttf');font-display:optional;}
@font-face{font-family:'THKodchasal2';src:url('rsp_thkodchasal2.ttf');font-display:optional;}
@font-face{font-family:'WRTishkid2';src:url('rsp_wr_tish_kid2.ttf');font-display:optional;}
@font-face{font-family:'TLWGTypewriter';src:url('rsp_tlwgtypewriter.ttf');font-display:optional;}
*/
@font-face{font-family:'ChulabhornLikit';src:url('rsp_chulabhornlikit.ttf');font-display:optional;}
html,body{background-color:darkgray !important;font-size:18px !important;margin:0px;font-family:ChulabhornLikit !important;line-height:1.5 !important;}
a, a:link, a:visited{color:#003366 !important;}
fieldset{margin:10px 0px 0px 0px !important;border:1px solid gray !important;border-radius:10px !important;margin-left:auto !important;margin-right:auto !important;}
legend{background-color:#000044;color:lightyellow !important;font-size:18px !important;margin:0px 0px 10px 10px !important;padding:5px 20px 0px 10px !important;border:2px outset dimgray !important;max-width:fit-content !important;border-radius:5px 20px !important;}
table{padding:0px;border:0px;}
th{text-align:center !important;background-color:#dddddd;font-weight:bold;}
td{vertical-align:top;}
h1{font-size:30px !important;}
.m_still{width:728px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
.m_still_1000{width:1000px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
.m_still_footer{width:728px;font-size:12px;}
.m_still_footer a{color:lightyellow;}
.m_hidden{padding:0px;border-spacing:0px;}
.m_hidden_footer{width:728px;border-spacing:0px;}
.m_hidden_search{width:728px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
.topbar{margin:0px;min-width:100%;background-color:black;color:white;height:90px;padding:0px;border-spacing:0px;border-style:none;}
.topbar td{text-align:left;}
.topbar_txt{position:absolute;left:5px;top:60px;background-color:#444444;border:1px inset #aaaaaa;border-radius:5px;width:240px;text-align:center;}
.headone{background-color:#0496FC !important;color:white;text-shadow: 1px 1px black;font-size:16px;}
.pad2, .pad2 a:link, .pad2 a:visited{padding:4px;font-size:14px;color:white !important;}
.bigcap36{margin-top:10px !important;font-size:36px !important;float:left;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}
.blackbar{margin-top:20px;padding:10px !important;border:5px outset;background-color:black !important;color:white;text-shadow:1px 1px #dddddd;font-size:21px;font-weight:bold;text-align:center;box-shadow: 3px 3px 3px lightgray;}
.shortnav{color:yellow !important;background-color:darkblue !important;}
.shortnav a:link,.shortnav a:visited{color:white !important;font-size:12px;}
.shortnav a:hover{color:gray !important;font-size:12px;}
.imgborder{border:1px outset white;border-radius:20px;box-shadow:3px 3px 3px lightgray;width:80px;height:80px;margin:1px;}
.imgborderr{border:1px outset white;border-radius:20px;box-shadow:3px 3px 3px lightgray;width:80px;height:80px;margin:1px;float:right;}
.imgborderl{border:1px outset white;border-radius:20px;box-shadow:3px 3px 3px lightgray;width:80px;height:80px;margin:1px;float:left;}
.mycenter{margin-left:auto;margin-right:auto;text-align:center;}
.mylogo{width:240px;height:90px;margin-left:auto;margin-right:auto;display:block;}
.toptown{width:100%;}
/* web2 */
.m_box{border:2px outset gray;width:97%;text-align:center;background-color:white;}
.m_box_left{border-radius: 2px 2px 2px 2px;border:2px outset gray;width:99%;text-align:left;background-color:#ffffdd;margin-left:auto;margin-right:auto;display:block;font-weight:bold;}
.yellowshadow{font-weight:bold;font-style:oblique;color:yellow;text-shadow:1px 1px black;}
.m_text{font-weight:bold;font-size:12px;border-radius: 5px 5px;text-align:center;background-color:lightgray;color:black;margin:1px !important;padding:1px !important;}
.popover_container1{padding-left:1px !important;float:left;width:100% !important;}
/* datastructure */
.m_head{font-size:20px;background-color:#444400;color:whitesmoke;text-align:center;border:1px outset black;border-radius:5px 5px 0px 0px;}
.m_option{font-size:18px;background-color:white;color:darkblue;font-weight:bold;border:1px outset #ffffaa;padding:2px;}
/* Top navigator - all */
#bar_topnav{width:100%;height:30px;background-color:#000044;margin:0px;padding:0px;border-spacing:0px;border-style:none;}
ul.topnav{list-style-type:none;margin:0px;padding:0px;overflow:hidden;background-image:url(rspbar.png);}
ul.topnav li{float:left;}
ul.topnav li a{display:inline-block;margin:0px;color:white !important;text-align:center;padding:0px 5px 0px 5px;text-decoration:none;font-size:15px;height:30px;}
ul.topnav li a:hover{color:yellow !important;}
ul.topnav li.icon{display:none;}
@media print{.not_print{display:none !important;}a[href]:after{content:none !important;}}
@media screen{.not_screen{display:none !important;}}

/* Top navigator - Vivo Y72 - 437  (0-440) */
@media screen and (max-width:440px){
ul.topnav li:not(:first-child){display:none;}
ul.topnav li.icon{float:right;display:inline-block;}
ul.topnav.responsive{position:relative;}
ul.topnav.responsive li.icon{position:absolute;right:0px;top:0px;}
ul.topnav.responsive li{float:none;display:inline;}
ul.topnav.responsive li a{display:block;text-align:left;}
}
/* general */
pre{font-family:TLWGTypewriter;float:left;}
p{margin:3px 0px 0px 0px;}
ol{padding-left:30px;}
textarea{font-family:ChulabhornLikit;color:#000088;background-color:#ddffdd;}
.m_white, .m_white a:link{color:white;}
.m_white a:visited{color:#ffdddd;}
.m_banner_320{visibility:hidden;display:none;}
.num{text-align:center;border-radius:50px 50px 50px 50px;width:80px;background-color:white;border: 2px solid blue;font-family:TLWGTypewriter;font-size:20px;font-weight:bold;margin-top:20px;margin-left:auto;margin-right:auto;}
.odd{background-color:#ddffdd;}
.even{background-color:lightyellow;}
.mykey{border:2px outset dimgray;font-size:16px;border-radius:10px;background-color:#000088;color:white;float:left;margin:1px;margin-right:10px;padding:0px 10px 0px 10px;}
.mykeyd{border:2px outset dimgray;font-size:16px;border-radius:10px;background-color:#dddddd;color:black;float:left;margin:1px;margin-right:10px;padding:0px 10px 0px 10px;}
.mykey_inline{font-size:10px;border-radius:5px;background-color:#000066;color:white;float:none;padding:0px 5px 0px 5px;display:inline;}
.greyshadow{text-shadow:10px 10px grey;}
/* handbill */
.img175{width:170px;height:200px;margin-left:auto;margin-right:auto;display:block;border:2px outset #aaaaaa;border-radius:5px 5px 0px 0px;}
.imgc{display:table;margin-left:auto !important;margin-right:auto !important;float:none !important;text-align:center;}
/* wordpress */
.bigcap{margin-top:5px;float:left;font-size:60px;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}/* #000080 */
.bigcap10{margin-top:5px;margin-bottom:10px;font-size:60px;float:left;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}
.bigcap15{margin-top:10px;margin-bottom:15px;font-size:60px;float:left;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}
.bigcap20{margin-top:20px;font-size:60px;float:left;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}
.bigcap35{margin-top:35px;font-size:60px;float:left;line-height:0.5;margin-right:5px;margin-left:5px;color:navy;}
/* perl */
.myli{width:120px;float:left;font-size:10px;}
/* tec */
.myul{padding-left:20px !important;margin:0px !important;}
.m_chapter{background:black !important;color:#ddffdd;margin-top:30px;border:3px inset white;font-size:40px;}
/* pdf.js , reactnative */
.m_desc{font-size:10px;width:96%;padding:2px 10px !important;margin-left:10px;background-color:#ddffff;border:1px solid gray;border-radius:10px;}
/* futureclassroom */
.p20{text-indent:20px;margin:3px 0px 0px 0px;}
/* research/myresearch */
.m_reference{font-size:16px;font-weight:bold;background-color:white !important;color:black;}
.m_reference p{text-indent:-15px;margin-left:20px;}
/* google */
.h160{height:160px;}/* form.htm */
.img175100c{width:175px;height:100px;margin-left:auto;margin-right:auto;display:block;}/* form.htm */
.img100c{height:100px;margin-left:auto;margin-right:auto;display:block;}
.img100l{height:100px;float:left;}
#body-wrapper {display:table;border-collapse:collapse;}
#body-row {display:table-row;}
#cs, #cs20, #cs40, #cs60 {display:table-cell;}
#cs20 {padding-left: 20px;}
#cs40 {padding-left: 40px;}
#cs60 {padding-left: 40px;}
/* actress */
.boxleft{width:100px;float:left;font-size:8px;text-align:center;}
/* google/form.htm */
.m_flex{display:flex;flex-direction:row;flex-flow:row wrap;}
.m_flex350{margin:3px;width:350px;display:block;border:2px outset #dddddd;border-radius:5px;padding:1px;}
/* tec/assignment.htm */
.imgblue{width:100%;border:2px outset darkblue;padding:1px;}/* open link */
.imggray{width:100%;border:2px outset gray;padding:1px;}/* lightbox */
.imggray100{width:100%;border:2px outset gray;padding:1px;}/* calendar65.htm */
.imggray120r{width:120px;border:2px outset gray;padding:1px;float:right;}/* web2 */
/* calendar60.htm */
.m_hidden_sub{;}
.m_hidden_turn{visibility:hidden;display:none;}
.m_min120, .m_min120h, .m_min120_img{width:115px;float:left;}
.m_min144, .m_min144h, .m_min144_img{width:144px;float:left;}
.m_min160, .m_min160h, .m_min160_img{width:160px;float:left;}
.m_min180, .m_min180h, .m_min180_img{width:176px;float:left;}
.m_min200, .m_min200h, .m_min200_img{width:196px;float:left;}
.m_min240, .m_min240h, .m_min240_img{width:236px;float:left;}
.m_min240n {background-color:#f9f9f9;margin:1px;width:236px;border:1px solid dimgray;float:left;}
.m_min260, .m_min260h, .m_min260_img{width:256px;float:left;}
.m_min280, .m_min280h, .m_min280_img{width:276px;float:left;}
.m_min300, .m_min300h, .m_min300_img{width:296px;float:left;}
.m_min320, .m_min320h, .m_min320_img{width:316px;float:left;}
.m_min360, .m_min360h, .m_min360_img{width:356px;float:left;}
.m_min400, .m_min400_img{width:396px;float:left;}
.m_min420, .m_min420_img{width:416px;float:left;}
.m_min440, .m_min440_img{width:436px;float:left;}
.m_min460, .m_min460_img{width:456px;float:left;}
.m_min480, .m_min480_img{width:476px;float:left;}
.m_min510, .m_min510_img{width:506px;float:left;}
.m_min520, .m_min520_img{width:516px;float:left;}
.m_min540, .m_min540_img{width:536px;float:left;}
.m_min560, .m_min560_img{width:556px;float:left;}
.m_min600{width:596px;float:left;}
.m_min620{width:616px;float:left;}
/* table */
.mytable{margin-left:auto;margin-right:auto;}
.mytable td{padding:3px;border-bottom:1px solid dimgray;}
.mytable tr:nth-child(even){background-color:#ddffdd;}
.mytable tr:nth-child(odd){background-color:lightyellow;}
.mytable tr:hover{background-color:#ddddff;}
.mytable a:link,.mytable a:visited{color:blue;}
.mytabley{margin-left:auto;margin-right:auto;}/* แก้ไข contrast บน Pagespeed insight */
.mytabley td{padding:3px;border-bottom:1px solid dimgray;}
.mytabley tr:nth-child(even){background-color:#ffffcc;}
.mytabley tr:nth-child(odd){background-color:#ffffdd;}
.mytabley tr:hover{background-color:#f9f9f9;}
.mytabley a:link,.mytabley a:visited{color:blue;}
.borderwhite1, .borderwhite1 table,.borderwhite1 th,.borderwhite1 td {border:1px solid white;border-spacing:1px !important;border-collapse:separate !important;}
.borderblack1, .borderblack1 table,.borderblack1 th,.borderblack1 td {border:1px solid black;border-spacing:1px !important;border-collapse:separate !important;}
/* swot */
.w20em{width:20em;}
/* tec/online_service.htm */
.m_bg_black{margin:5px 2px 2px 2px !important;background-color:black;display:table;width:98%;height:100px;color:white;font-size:13px;border-radius: 5px 5px;text-align:center;padding:1px !important;float:left;border:1px outset;}
.m_bg_info{background-color:#17a2b8;}
.m_bg_success{background-color:#28a745;}
.m_bg_warning{background-color:#ffc107;}
.m_bg_danger{background-color:#dc3545;}
.m_bg_pink{background-color:#e83e8c;}
.m_bg_gray{background-color:#6c757d;}
.m_bg_purple{background-color:#6f42c1;}
.m_bg_cyan{background-color:#00c4c4;}
.m_bg_darkgreen{background-color:#005522;}
.m_bg_olive{background-color:#808000;}
.m_bg_orange{background-color:#ff8040;}
.m_bg_blue{background-color:#0044c4;}
.m_bg_info,.m_bg_success,.m_bg_warning,.m_bg_danger,.m_bg_pink,.m_bg_gray,.m_bg_purple,.m_bg_cyan,.m_bg_darkgreen,.m_bg_olive,.m_bg_orange,.m_bg_blue{width:24%;height:120px;color:white;font-size:14px;border-radius: 5px 5px;text-align:center;margin:2px !important;padding:1px !important;float:left;border:1px outset;}
.m_bg_info a:link,.m_bg_info a:visited,.m_bg_success a:link,.m_bg_success a:visited,.m_bg_danger a:link,.m_bg_danger a:visited,.m_bg_pink a:link,.m_bg_pink a:visited,.m_bg_gray a:link,.m_bg_gray a:visited,.m_bg_purple a:link,.m_bg_purple a:visited,.m_bg_cyan a:link,.m_bg_cyan a:visited,.m_bg_olive a:link,.m_bg_olive a:visited,.m_bg_orange a:link,.m_bg_orange a:visited,.m_bg_blue a:link,.m_bg_blue a:visited{color:#dddddd;font-size:16px;}
.m_bg_warning a:link,.m_bg_warning a:visited{color:black;font-size:16px;}
.m_bg_darkgreen a:link,.m_bg_darkgreen a:visited{color:yellow;font-size:16px;}
.m_bg_warning{color:green;}
/* javascript library */
.syntaxhighlighter{overflow-y:auto !important; overflow-x:auto !important;}

/* 1,2,3 - (0-767) */
@media only screen and (max-width:767px){
.toptown{background-image:none;}
.pad2{font-size:16px;color:#ffffdd !important;}
.headone{background-color:#0496FC !important;color:white;text-shadow: 1px 1px black;font-size:12px;}
.w20em{width:10em;}
h1{font-size:20px !important;}
.m_flex350{width:100%;border-radius:3px;border:1px outset black;}
.imggray100{width:80% !important;margin-left:auto;margin-right:auto;display:block;margin-bottom:5px;}
.m_bg_info, .m_bg_success, .m_bg_warning, .m_bg_danger, .m_bg_pink, .m_bg_gray,.m_bg_purple,.m_bg_cyan,.m_bg_darkgreen,.m_bg_olive,.m_bg_orange,.m_bg_blue{width:48%;height:80px;font-size:10px;}
.myul{padding-left:10px !important;}
.m_hidden_turn{visibility:visible;display:inline;}
#m_town{visibility:hidden;display:none;}
}
/* 1 - (0-374) */
@media only screen and (max-width:374px){
html,body{background-color:chocolate !important;font-size:14px !important;}
.syntaxhighlighter{width:365px !important;border:1px solid gray !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:365px;}
.m_banner_320{width:365px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_min120, .m_min144, .m_min160, .m_min180, .m_min200, .m_min240, .m_min260, .m_min280, .m_min300, .m_min320, .m_min360, .m_min400, .m_min420, .m_min440, .m_min460, .m_min480, .m_min510, .m_min520, .m_min540, .m_min560, .m_min600, .m_min620{width:365px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .m_min240n, .m_min260_img, .m_min280_img, .m_min300_img, .m_min320_img, .m_min360_img, .m_min400_img, .m_min420_img, .m_min440_img, .m_min460_img, .m_min480_img,.m_min510_img, .m_min520_img, .m_min540_img, .m_min560_img{width:365px;}
.m_min120h, .m_min144h, .m_min160h, .m_min180h, .m_min200h, .m_min240h, .m_min260h, .m_min280h, .m_min300h, .m_min320h, .m_min360h, .m_hidden, .m_hidden_search, .m_hidden_footer, .m_hidden_sub{visibility:hidden;display:none;}
}
/* 2 - (375-413) */
@media only screen and (min-width:375px) and (max-width:413px){
html,body{background-color:darkgreen !important;font-size:14px !important;}
.syntaxhighlighter{width:370px !important;border:1px solid green !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:370px;}
.m_banner_320{width:370px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_min120, .m_min144, .m_min160, .m_min180, .m_min200, .m_min240, .m_min260, .m_min280, .m_min300, .m_min320, .m_min360, .m_min400, .m_min420, .m_min440, .m_min460, .m_min480,.m_min510, .m_min520, .m_min540, .m_min560, .m_min600, .m_min620{width:370px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .m_min240n, .m_min260_img, .m_min280_img, .m_min300_img, .m_min320_img, .m_min360_img, .m_min400_img, .m_min420_img, .m_min440_img, .m_min460_img, .m_min480_img, .m_min510_img, .m_min520_img, .m_min540_img, .m_min560_img{width:370px;}
.m_min120h, .m_min144h, .m_min160h, .m_min180h, .m_min200h, .m_min240h, .m_min260h, .m_min280h, .m_min300h, .m_min320h, .m_min360h, .m_hidden, .m_hidden_search, .m_hidden_footer, .m_hidden_sub{visibility:hidden;display:none;}
}
/* 3 - (414-767) */
@media only screen and (min-width:414px) and (max-width:767px){
html,body{background-color:thistle !important;font-size:16px !important;}
.syntaxhighlighter{width:410px !important;border:1px solid black !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:410px;}
.m_banner_320{width:410px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_min120, .m_min144, .m_min160, .m_min180, .m_min200, .m_min240, .m_min260, .m_min280, .m_min300, .m_min320, .m_min360, .m_min400, .m_min420, .m_min440, .m_min460, .m_min480, .m_min510, .m_min520, .m_min540, .m_min560, .m_min600, .m_min620{width:410px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .m_min240n, .m_min260_img, .m_min280_img, .m_min300_img, .m_min320_img, .m_min360_img, .m_min400_img, .m_min420_img, .m_min440_img, .m_min460_img, .m_min480_img,.m_min510_img, .m_min520_img, .m_min540_img, .m_min560_img{width:410px;}
.m_min120h, .m_min144h, .m_min160h, .m_min180h, .m_min200h, .m_min240h, .m_min260h, .m_min280h, .m_min300h, .m_min320h, .m_min360h, .m_hidden, .m_hidden_search, .m_hidden_footer, .m_hidden_sub{visibility:hidden;display:none;}
}