/* ปรับปรุง :2563-03-17
- start on http://www.thaiall.com/web2
- share at http://thaiall.github.io/www/web2
*/
@font-face{font-family:'THChakraPetch';src:url('rsp_thchakrapetch.ttf');}
@font-face{font-family:'THKodchasal2';src:url('rsp_thkodchasal2.ttf');}
@font-face{font-family:'AlexBrush';src:url('rsp_alexbrush.ttf');}
@font-face{font-family:'TLWGTypewriter';src:url('rsp_tlwgtypewriter.ttf');}
@font-face{font-family:'Sawasdee';src:url('rsp_sawasdee.ttf');}
@font-face{font-family:'WRTishkid2';src:url('rsp_wr_tish_kid2.ttf');}
html,body{height:100%;}
#main{background-color:teal;font-family:microsoft sans serif;font-size:12px;margin:0px 0px 0px 0px;}
pre{font-family:TLWGTypewriter;float:left;}
p{margin:3px 0px 0px 0px;}
ol{padding-left:30px;}	
textarea{font-family:microsoft sans serif;color:#000088;background-color:#ddffdd;}
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{font-family:sawasdee;background-color:#000044;color:#ffffdd !important;font-size:18px;margin:0px 0px 0px 10px !important;padding:5px 20px 0px 10px !important;border:2px outset #dddddd !important;max-width:fit-content !important;border-radius:5px 20px !important;}
table{padding:0px;border:0px;vertical-align:top;}
/* tec */
.myul{padding-inline-start:20px !important;margin:0px !important;}
.m_chapter{background:black !important;color:#ddffdd;margin-top:30px;border:3px inset white;font-family:WRTishkid2;font-size:40px;}
/* datastructure */
.m_head{font-family:thchakrapetch;font-size:20px;background-color:#444400;text-align:center;color:#dddddd;border:1px outset black;border-radius:5px 5px 0px 0px;!important;}
.m_option{font-family:thchakrapetch;font-size:18px;font-weight:bold;background-color:#ffffdd;border:1px outset #ffffaa;padding:0 0 0 2px;}
/* futureclassroom */
.p20{text-indent:20px;margin:3px 0px 0px 0px;}
/* research/myresearch */
.m_reference{font-family:sawasdee;font-size:12px;background-color:#ffffdd;font-weight:bold;color:#444444;}
.m_reference p{text-indent:-15px;margin-left:20px;}
/* handbill */
.img175{width:175px;height:200px;margin-left:auto;margin-right:auto;display:block;}
/* web2 */
.m_box{border:2px outset gray;width:100%;}
.shortnav{color:#000099;font-family:WRTishkid2;font-size:20px;background-color:teal !important;}
.shortnav a:link,.shortnav a:visited{color:white;font-size:12px;}
.shortnav a:hover{color:#aaaaaa;font-size:12px;}
.topbar{margin:0px;width:100%;background-color:black;color:white;text-align:left;height:90px;padding:0px;border-spacing:0px;border-style:none;font-family:thchakrapetch;font-size:18px;}
.topbar a:link, .topbar a:visited{color:#aaffaa;text-decoration:none;}
.topbar td{text-align:left;}
.topbar_txt{position:absolute;left:15px;top:65px;background-color:#444444;border:2px outset #aaaaaa;border-radius:5px 5px 0 0;width:240px;text-align:center;}
.odd{background-color:#ddffdd;}
.even{background-color:#ffffdd;}
.mytable{margin-left:auto;margin-right:auto;}
.mytable td{padding:3px;border-bottom:1px solid #dddddd;}
.mytable tr:nth-child(even){background-color:#ddffdd;}
.mytable tr:nth-child(odd){background-color:#ffffdd;}
.mytable tr:hover{background-color:#ddddff;}
.mykey{border:2px outset #dddddd;font-size:16px;border-radius:10px;background-color:#000088;color:white;float:left;margin:2px;padding:0px 10px 0px 10px;}
/* ipad 768 */
.m_still_1000{width:1000px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
.m_still{width:728px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
.m_still_footer{width:728px;font-family:sawasdee !important;font-size:12px !important;font-weight:bold !important;}
.m_still_footer a{color:#ffffdd !important;}
.m_white, .m_white a:link{color:white !important;}
.m_white a:visited{color:#ffdddd !important;}
.m_banner_320{visibility:hidden;display:none;}
.m_hidden{width:728px;padding:0px;border-spacing:0px;float:left;}
.m_hidden_footer{width:728px;border-spacing:0px;}
.m_hidden_search td, .m_hidden_search input{font-family:sawasdee !important;font-size:10px !important;}
.m_hidden_search{width:732px;background-color:white;margin-left:auto;margin-right:auto;padding:0px;border-spacing:0px;}
/* calendar60.htm */
.m_hidden_sub{;}
.m_hidden_turn{visibility:hidden;display:none;}
.m_min120, .m_min120h, .m_min120_img{margin:0px 0px 0px 0px;width:116px;padding:0px;border-spacing:0px;float:left;}
.m_min144, .m_min144h, .m_min144_img{margin:0px 0px 0px 0px;width:144px;padding:0px;border-spacing:0px;float:left;}
.m_min160, .m_min160h, .m_min160_img{margin:0px 0px 0px 0px;width:160px;padding:0px;border-spacing:0px;float:left;}
.m_min180, .m_min180h, .m_min180_img{margin:0px 0px 0px 0px;width:176px;padding:0px;border-spacing:0px;float:left;}
.m_min200, .m_min200h, .m_min200_img{margin:0px 0px 0px 0px;width:196px;padding:0px;border-spacing:0px;float:left;}
.m_min240, .m_min240h, .m_min240_img{margin:0px 0px 0px 0px;width:236px;padding:0px;border-spacing:0px;float:left;}
.m_min260, .m_min260h, .m_min260_img{margin:0px 0px 0px 0px;width:256px;padding:0px;border-spacing:0px;float:left;}
.m_min280, .m_min280h, .m_min280_img{margin:0px 0px 0px 0px;width:276px;padding:0px;border-spacing:0px;float:left;}
.m_min300, .m_min300h, .m_min300_img{margin:0px 0px 0px 0px;width:296px;padding:0px;border-spacing:0px;float:left;}
.m_min320, .m_min320h, .m_min320_img{margin:0px 0px 0px 0px;width:316px;padding:0px;border-spacing:0px;float:left;}
.m_min360, .m_min360h, .m_min360_img{margin:0px 0px 0px 0px;width:356px;padding:0px;border-spacing:0px;float:left;}
.m_min400, .m_min400_img{margin:0px 0px 0px 0px;width:396px;padding:0px;border-spacing:0px;float:left;}
.m_min420, .m_min420_img{margin:0px 0px 0px 0px;width:416px;padding:0px;border-spacing:0px;float:left;}
.m_min440, .m_min440_img{margin:0px 0px 0px 0px;width:436px;padding:0px;border-spacing:0px;float:left;}
.m_min460, .m_min460_img{margin:0px 0px 0px 0px;width:456px;padding:0px;border-spacing:0px;float:left;}
.m_min480, .m_min480_img{margin:0px 0px 0px 0px;width:476px;padding:0px;border-spacing:0px;float:left;}
.m_min510, .m_min510_img{margin:0px 0px 0px 0px;width:506px;padding:0px;border-spacing:0px;float:left;}
.m_min520, .m_min520_img{margin:0px 0px 0px 0px;width:516px;padding:0px;border-spacing:0px;float:left;}
.m_min540, .m_min540_img{margin:0px 0px 0px 0px;width:536px;padding:0px;border-spacing:0px;float:left;}
.m_min560, .m_min560_img{margin:0px 0px 0px 0px;width:556px;padding:0px;border-spacing:0px;float:left;}
.m_min600{margin:0px 0px 0px 0px;width:596px;padding:0px;border-spacing:0px;float:left;}
.m_min620{margin:0px 0px 0px 0px;width:616px;padding:0px;border-spacing:0px;float:left;}
/* iphone5 (0-320) */
@media only screen and (max-width:320px){
.syntaxhighlighter{width:315px !important;border:1px solid gray !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:315px;}
.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:315px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .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:305px;}
.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;}
#m_town{visibility:hidden;display:none;}
.m_banner_320{width:315px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_hidden_turn{visibility:visible;display:inline;}
.myul{padding-inline-start:10px !important;}
}
/* iphone6:375 galaxy s5:360 (321-375) */
@media only screen and (min-width:321px) and (max-width:375px){
.syntaxhighlighter{width:355px !important;border:1px solid green !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:355px;}
.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:355px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .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:345px;}
.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;}
#m_town{visibility:hidden;display:none;}
.m_banner_320{width:355px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_hidden_turn{visibility:visible;display:inline;}
.myul{padding-inline-start:10px !important;}
}
/* nexus 5x:411 (376-414) */
@media only screen and (min-width:376px) and (max-width:414px){
.syntaxhighlighter{width:406px !important;border:1px solid black !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:406px;}
.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:406px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .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:396px;}
.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;}
#m_town{visibility:hidden;display:none;}
.m_banner_320{width:406px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_hidden_turn{visibility:visible;display:inline;}
.myul{padding-inline-start:10px !important;}
}
/* nexus 6p:435 (414-728) */
@media only screen and (min-width:414px) and (max-width:728px){
.syntaxhighlighter{width:430px !important;border:1px solid blue !important;}	
.m_still, .m_still_1000, .m_still_footer{visibility:visible;width:430px;}
.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:430px;}
.m_min120_img, .m_min144_img, .m_min160_img, .m_min180_img, .m_min200_img, .m_min240_img, .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:420px;}
.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;}
#m_town{visibility:hidden;display:none;}
.m_banner_320{width:430px;height:110px;margin-left:auto;margin-right:auto;visibility:visible;display:block;}
.m_hidden_turn{visibility:visible;display:inline;}
.myul{padding-inline-start:10px !important;}
}
/* top navigator */
#bar_topnav{width:100%;height:30px;background-color:#000044;margin:0px 0px 0px 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;text-align:center;padding:5px 5px;text-decoration:none;font-family:WRTishkid2;font-size:15px;height:30px;}
ul.topnav li a:hover{color:yellow;}
ul.topnav li.icon{display:none;}
/* iphone6 plus (0-414) */
@media screen and (max-width:414px){
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;}
}
@media print{.not_print{display:none;}a[href]:after{content:none !important;}}
@media screen{.not_screen{display:none !important;}}