*/}}

main.css 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480
  1. html{font-size:18px;font-family:'Noto Serif CJK SC','Times New Roman','SimSun', Georgia, serif;}
  2. .page{overflow:none;}
  3. body{background-color:#2d2214;color:#f8ca9b;}
  4. sup,sub{line-height:0;} .lpctrl{display:none;}
  5. blockquote{border-left:2px solid #f8ca9b;padding-left:0.3em;}
  6. *{box-sizing:border-box;padding:0;margin:0;font-weight:normal;}
  7. b,strong,th{font-weight:bold;}
  8. select{font-size:inherit;}
  9. .page,.page_gallery{padding:1em;padding-top:0;padding-bottom:0;}
  10. .hidden_on_desktop,.hidden_on_wide{display:none;}
  11. .hidden_on_desktop_force{display:none !important;}
  12. ::file-selector-button{background:none;border:none;}
  13. a,button,::file-selector-button{text-decoration:underline;color:#f8ca9b;text-decoration-thickness:2px;text-underline-offset:0.15em;}
  14. a:hover,.button:hover,::file-selector-button:hover{text-decoration:none;color:#f8ca9b88;}
  15. .button:disabled{background-color:#f8ca9b88;pointer-events:none;}
  16. header{position:fixed;top:0;width:calc(100% - 2em);background-color:#2d2214;z-index:10;padding-top:0.5em;box-shadow: 0.5em 0px #2d2214;}
  17. header::before{content:'';position:absolute;left:0;right:0;top:0;height:1.95em;box-shadow:-2em 0em 1em -1em inset #2d2214;pointer-events:none;}
  18. header>div{overflow:auto;white-space:nowrap;}
  19. .header_nav{display:inline;}
  20. header a,.left a,.footer a,.clean_a,.clean_a a{text-decoration:none;}
  21. header a:hover,.button:hover{color:#f8ca9b88 !important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:0.15em;}
  22. .exp_h_f{padding-top:0.3em !important;padding-bottom:0.3em !important;line-height:1.5em !important;height:2.1em !important;}
  23. .exp_f{text-align:center;}
  24. .toc_button{position:absolute;top:0.5em;right:0;text-shadow: 0px 0px 10px #2d2214;background-color:#2d221488;}
  25. .footer{background-color:#2d2214;z-index:10;position:relative;}
  26. .invert_a,.invert_a a{color:#f8ca9b88;text-decoration:none;}
  27. .invert_a:hover,.invert_a a:hover{color:#f8ca9b !important;}
  28. .gray,.gray a{color:#f8ca9b88;}
  29. hr{border:1px solid #f8ca9b88;}
  30. header ul,.small_footer ul,.small_footer span,header li,.small_footer li{display:inline-block;vertical-align:text-top;}
  31. header li::before,.small_footer li::before{content:' - '}
  32. header li ul{display:none;}
  33. header:hover li ul{display:inline;}
  34. header li ul li{display:block !important;margin-left:1em;}
  35. header li ul li a{font-size:0.9em;}
  36. //h1,h2,h3,h4,h5{font-size:1em;}
  37. //h1{text-decoration:underline;}
  38. header h1,header h2,header h3,header h4,header h5,header p{display:inline;font-size:1rem;}
  39. .main{position:relative;word-spacing:-1em;top:2em;margin-bottom:2em;}
  40. .main *{word-spacing:initial;}
  41. pre{overflow:auto;display:block;line-break:anywhere;white-space:pre-wrap;}code{font-size:0.83em;}
  42. ul{display:block;}
  43. li{display:block;}
  44. .clean_table{border:none;font-size:1em !important;}.clean_table thead{box-shadow:none;}.clean_table td{vertical-align:top;}
  45. table{width:100%;border-collapse:collapse;border-bottom:2px solid #f8ca9b;border-top:3px solid #f8ca9b;}
  46. .settings input,.post inpiut{border:none!important;}
  47. .post table img{max-width:min(100%, 20rem) !important;}
  48. td{padding-left:0.1em;padding-right:0.1em;}
  49. td:first-child{padding-left:0;}
  50. td:last-child{padding-right:0;}
  51. tbody tr:hover{box-shadow:inset 0 -2px 0 0px #f8ca9b;}
  52. thead{box-shadow:inset 0 -1px 0 0px #f8ca9b;}
  53. .post table{font-size:0.85em;}
  54. .interesting_tbody{background:linear-gradient(90deg, #2d2214ff, #2d221488 20em);}
  55. .interesting_tbody td{display:contents;}
  56. .interesting_tbody tr{position:relative;scroll-margin:4.5em}
  57. .interesting_tbody td>*{display:table-cell;}
  58. .interesting_tbody td>.wscroll{display:none !important;}
  59. .interesting_tbody .post_access{padding-top:0;}
  60. .interesting_tbody .post_menu_button{top:0;opacity:0;}
  61. .interesting_tbody td>img,.interesting_tbody td>.imd{position:absolute;left:1.4em;z-index:-1;height:1em;width:20em;
  62. display:flex;top:0.2em;object-fit:cover;max-width:calc(100% - 1.4em) !important;overflow:hidden;}
  63. .interesting_tbody td>.imd>a{display:flex;}
  64. .interesting_tbody img{object-fit:cover;width:100%;}
  65. .interesting_tbody .p_row{display:flex;position:absolute;left:1.4em;top:0.25em;z-index:-1;flex-wrap:nowrap;max-width:calc(100% - 1.4em);}
  66. .interesting_tbody .p_thumb{height:1em;}
  67. .interesting_tbody .p_thumb img,.interesting_tbody .p_thumb video{max-height:10rem !important;max-width:20rem !important;}
  68. tr:hover .post_menu_button{opacity:1;}
  69. .post_current_row{background-color:#a9270e;mix-blend-mode:screen;text-shadow:0px 0px 0.1em #2d2214;}
  70. .align_right{text-align:right;}
  71. .left{display:inline-block;vertical-align:top;width:25%;padding-right:1.5em;padding-bottom:4rem;position:sticky;top:2em;
  72. overflow:auto;max-height:calc(100vh - 2.6em);}
  73. .center{display:inline-block;vertical-align:top;width:50%;overflow:visible;padding-bottom:4rem;}
  74. .center_slides{display:block;vertical-align:top;width:100%;overflow:visible;padding-bottom:4rem;font-size:5vmin;user-select:none;}
  75. .center_slides .print_column{display:table;position:fixed;top:0;right:0;left:0;bottom:0;width:100%;height:100%;z-index:90;}
  76. .center_slides .print_column .post{display:table-cell;vertical-align:middle;padding:5vmin !important;max-height:100vh;width:100vw;overflow:auto;}
  77. .center_slides .active_post{background-color:#2d2214;}.center_slides .post{background-color:#2d2214;}
  78. .center_slides .post_access{display:none;}
  79. .center_slides .post_menu_button{display:none !important;}
  80. .center_slides .post_width{display:block;vertical-align:middle;max-height:100vh;overflow-y:auto;overflow-x:hidden;width:100%;}
  81. .center_slides .linked_posts{display:none;}.center_slides .ref_compact{position:relative!important;display:block!important;}
  82. .slides_buttons{position:fixed;z-index:200;right:0.5rem;bottom:0.5rem;user-select:none;background-color:#2d2214aa;padding:0.5rem;font-family:monospace;}
  83. .slides_buttons a{text-decoration: none;}
  84. .center_slides .imd{text-align:center;pointer-events:none;}
  85. .imd_float{float:right;width:50% !important;clear:both;margin-left:0.5em !important;}
  86. .center_wide{display:inline-block;vertical-align:top;width:75%;padding-left:0.3em;overflow:visible;padding-bottom:4rem;}
  87. .center_full{display:inline-block;vertical-align:top;width:100%;overflow:visible;padding-bottom:4rem;}
  88. .center_wide .p_thumb{height:12rem;width:12rem;margin:0;margin-right:0.5rem;margin-bottom:0.5rem;box-shadow:5px 5px 15px 2px black;}
  89. .linked_posts{padding:0.5em;background-color:#0004;box-shadow:0px 0.2em 0.2em -0.2em inset #000000ee;}
  90. .active_post .linked_posts{background-color:#ae6407;}
  91. input:checked~.linked_posts,input:checked~a{display:none;}
  92. .bkg_recent>.post,.bkg_section{background:#4a3413;box-shadow:0em 0em 0.5em #000000ee;margin-bottom:0.5em;}
  93. .bkg_recent>.post>.post_width :last-child{margin-bottom:0;}
  94. .sticky_title{position:sticky;top:calc(1.6rem + 2px);z-index:1;background-color:#2d2214;pointer-events:none;}
  95. .center_exp{display:block;width:80%;margin:0 auto;overflow:visible;padding-bottom:1em;}
  96. .table_top{position:relative;left:calc(-50% - 0.45em);width:calc(200% + 0.6em);background:#2d2214;z-index:1;
  97. box-shadow:0px 0px 2em 1em #2d2214;margin-top:2em;margin-bottom:2em;}
  98. textarea,input[type=text],input[type=password]{font-family:monospace;width:100%;display:block;font-family:inherit;max-height:60vh;font-size:inherit;}
  99. select,textarea,input[type=text],input[type=password]{font-family:monospace;background:none;border:none;border-bottom:1px solid #f8ca9b;color:#f8ca9b;}
  100. .text_highlight input{border-bottom:1px solid #2d2214;color:#2d2214;}
  101. .button{background:none;border:none;font-family:inherit;color:#f8ca9b;font-size:inherit;font-weight:bold;}
  102. .post{position:relative;scroll-margin:3.5em;}
  103. .active_post{background-color:#804a06;}.active_post .post_access{background-color:#ae6407;}
  104. .center_exp .post{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;}
  105. .post li,.footer_additional li,.footer_additional li,.post_dummy li
  106. {display:list-item;margin-left:1em;list-style:disc;}
  107. .post li li,.footer_additional li li,.footer_additional li li,.post_dummy li li
  108. {list-style:circle;}
  109. ol li{list-style:unset !important;}
  110. .post_width > *,.post_dummy > *,.post_ref > *{margin:0;margin-bottom:0.5rem}
  111. .post > td:nth-child(3) > *{margin:0;margin-bottom:0.5rem}
  112. .post_dummy > *{width:60%;margin:0 auto;margin-bottom:0.5rem}
  113. .post_dummy > p img{display:block;width:100%;margin:0 auto;}
  114. .gallery_left li{display:list-item;margin-left:1em;list-style:none;}
  115. .gallery_left .selected{list-style:'→';}
  116. .bkg_section .post_width{padding-top:0;padding-bottom:0;}
  117. .bkg_section .restart+.post .post_width{padding-top:0.5em;}
  118. .post_width{display:inline-block;margin-left:0.5em;vertical-align:top;}
  119. .opt_compact .post_width,.ref_compact .post_width{padding-top:0;padding-bottom:0;}
  120. .p_thumb .post_menu_button{right:0.3rem;top:0.3em;}
  121. .post_menu_button{position:absolute;display:none;right:0rem;width:1.5rem;box-shadow:0px 0px 3px #000000ee;
  122. text-align:center;border-radius:0.3em;user-select:none;cursor:pointer;z-index:10;background-color:#4a3413aa;}
  123. .pointer{cursor:pointer;}
  124. .post:hover .post_menu_button{display:block;}
  125. .pop_menu{position:absolute;top:0.3rem;z-index:95;background-color:#6a491c;
  126. padding:0.3em;right:0.3rem;text-align:right;border-radius:0.3em;font-size:1rem;
  127. box-shadow:0px 0px 10px #000000ee;}
  128. .pop_menu li{list-style:none;margin-left:0;}
  129. .pop_menu hr{border:2px solid rgba(0,0,0,0.1);}
  130. .toc{left:60%;width:40%;top:0;position:absolute;}
  131. .paa{width:1.4rem;min-width:1.4rem;}
  132. .opt_compact .post_access,.ref_compact .post_access{border-right:2px solid #f8ca9b88;background-color:#4a3413;right:unset;left:-2em;}
  133. .active_post .opt_compact .post_access,.active_post .ref_compact .post_access{background-color:#804a06;}
  134. .post_preview{overflow:hidden;margin-bottom:0.4em;background-color:#2d2214aa;box-shadow: 0px 0px 0.2em #000000ee;}
  135. .post_preview:hover{filter:contrast(90%);}
  136. .active_post .post_preview:hover{filter:contrast(90%);}
  137. .hide_long{max-height:12em;overflow:hidden !important;}
  138. .post .post_ref{margin:0;padding-left:1.5rem;}
  139. .post_ref_main{display:inline-block;vertical-align:top;max-height:6em;overflow:hidden;margin:0.4em;}
  140. .post_ref_images{overflow:hidden;margin:0.4em;margin-top:0;}
  141. .post_ref_hint{text-align:right;}
  142. .page_selector{padding-top:2rem;text-align:center;}
  143. .smaller{font-size:0.85em;} .bigger{font-size:1.3em;} .block{display:block;}
  144. .restart{text-align:left;padding-top:1rem;padding-bottom:0.5rem;}
  145. .opt_compact{margin-left:2rem;}
  146. .post_box_top{padding-bottom:0.3em;padding-top:0.3em;}
  147. .post_box_fixed_bottom{position:sticky;bottom:0em;background-color:#2d2214;z-index:5;}
  148. .spacer{height:0.5em;}
  149. .pop_right,.pop_right_big{position:fixed;top:0;right:0;bottom:0;width:30%;z-index:100;background-color:#a9270e;display:none;
  150. transition-timing-function:ease-out;padding:1rem;overflow:auto;}
  151. @keyframes pop_slide_in{0%{right:-30%;}100%{right:0%;}}
  152. @keyframes pop_slide_out{0%{right:0%;}100%{right:-30%;}}
  153. @keyframes pop_slide_in_big{0%{right:-30%;}100%{right:0%;}}
  154. @keyframes pop_slide_out_big{0%{right:0%;}100%{right:-30%;}}
  155. .backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,0.5);transition-timing-function:ease-out;z-index:90;}
  156. @keyframes backdrop_fade_in{0%{opacity:0%;}100%{opacity:100%;}}
  157. @keyframes backdrop_fade_out{0%{opacity:100%;}100%{opacity:0%;}}
  158. .toc_entry_1{font-size:1.1em;}
  159. .toc_entry_2{font-size:1.0em;padding-left:0.5rem;}
  160. .toc_entry_3{font-size:0.9em;padding-left:1rem;}
  161. .toc_entry_4{font-size:0.85em;padding-left:1.5rem;}
  162. .toc_entry_5{font-size:0.8em;padding-left:2rem;}
  163. h1,h2,h3,h4,h5{scroll-margin:2.5em;}
  164. .post h1,.post h2,.post h3,.post h4,.post h5{margin-top:1rem;}
  165. .left ul h1,.left ul h2,.left ul h3,.left ul h4,.left ul h5,.left ul p{font-size:1em;}
  166. .deleted_post{color:#f8ca9b88;text-decoration:line-through;}
  167. #file_list{margin-top:0.5em;}
  168. .file_thumb img,.file_thumb video{max-height:100%;max-width:100%;object-fit:cover;min-width:100%;min-height:100%;}
  169. .file_thumb video{border:2px dashed #f8ca9b;}f
  170. #file_list li{margin-bottom:0.3em;}
  171. .ref_thumb{white-space:nowrap;overflow:hidden;}
  172. .ref_thumb .file_thumb{width:2em;height:2em;margin:0;margin-right:0.3em}
  173. .side_thumb li{margin:0.4em;display:inline-block;}
  174. .file_thumb{width:4em;height:4em;display:inline-block;line-height:0;vertical-align:middle;overflow:hidden;}
  175. .p_row{display:flex;flex-wrap:wrap;width:100%;}
  176. .p_thumb{display:flex;flex-grow:100;height:6rem;overflow:hidden;position:relative;margin-right:0.5em;margin-bottom:0.5em;}
  177. .p_thumb_narrow{width:1rem !important;flex-grow:1;opacity:0.2;}
  178. .p_thumb img,.p_thumb video{object-fit:cover;max-height:100%;min-width:100%;}.p_thumb a{display:contents;}
  179. .p_thumb:hover .post_menu_button{display:block;}
  180. .p_thumb_selected{color:#f8ca9b !important;}
  181. .p_thumb_selected{display:block;}
  182. .post .p_thumb img,.post .p_thumb video{max-height:6rem;}
  183. .p_thumb video{border-bottom:0.4em dashed #f8ca9b;border-top:0.4em dashed #f8ca9b;}
  184. .p_thumb_end{flex-grow:10000 !important;box-shadow:none;align-items:center;padding:2em !important;}
  185. .p_thumb_end:hover, .p_thumb_end a:hover{background-color:#f8ca9b88;cursor:pointer;}
  186. .big_image_box{position:fixed;top:0;bottom:0;left:0;width:75%;z-index:95;text-align:center;pointer-events:none;}
  187. .big_image_box *{pointer-events:auto;}
  188. .big_image_box img,.big_image_box video{position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;cursor:unset;}
  189. .here_image_box{position:relative;width:100%;text-align:center;height:calc(100vh - 4.5em);}
  190. .here_image_box img,.here_image_box video{position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;cursor:unset;}
  191. .big_side_box{position:fixed;top:0;bottom:0;right:0;width:25%;overflow:auto;z-index:98;color:#f8ca9b;padding:1rem;pointer-events:none;}
  192. .big_side_box a,.big_side_box hr,#dropping_background{color:#f8ca9b;}
  193. .big_side_box a:hover{color:#f8ca9b88;}
  194. .big_side_box *{pointer-events:auto;}
  195. .big_side_box .post_preview{border-bottom:1px dotted #f8ca9b;background-color:unset;}
  196. .image_nav{pointer-events:none;}
  197. #dropping_background{background-color:rgba(255,255,255,0.4);position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;text-align:center;
  198. box-shadow:0px 0px 500px black inset;display:flex;align-items:center;}
  199. img,video{cursor:pointer;max-height:100%;max-width:100%;vertical-align:middle;}
  200. .post img,.post video{max-height:min(70vh, 20rem);max-width:min(100%, 20rem);}
  201. .post > a > img,.post > a > video{display:block;margin:0.3em auto;}
  202. .post .original_img{max-width:100%;display:inline-block;vertical-align:middle;
  203. margin-left:auto;margin-right:auto;max-width:100%;max-height:90vh;}
  204. .center_exp .post .original_img{display:block;}
  205. .original_img img,.original_img video{max-height:90vh;max-width:100%;}
  206. .p_row .original_img{margin-bottom:0;}
  207. .post_ref .original_img{margin:unset;max-width:unset;max-height:min(70vh, 20rem);max-width:min(100%, 20rem);}
  208. .imbtn{color:rgba(0,0,0,0);display:block;contain:content;padding:0.25em;margin-bottom:0.5em;text-decoration:none;}
  209. .imbtn img{display:block;object-fit:cover;position:absolute;top:0;left:0;bottom:0;right:0;margin:auto;z-index:-1;
  210. min-width:100% !important;min-height:100% !important;filter:opacity(70%);transition:0.1s;}
  211. .imbtn:hover img{filter:opacity(20%) blur(0.2em);} .imbtn:hover{color:#f8ca9b !important;}
  212. .imbtn:hover {color:#f8ca9b;text-shadow:0px 0px 5px #2d2214;}
  213. header .imbtn{display:inherit;border:none;padding:0em;height:unset;height:unset;margin:0em;contain:unset;}
  214. header .imbtn:hover{border:none;color:#f8ca9b88 !important;} header .imbtn img{display:none;}
  215. .b ul{font-size:1.4em;}
  216. no_pop{cursor:unset;}
  217. p{min-height:0.8em;}
  218. .bold,.bold *{font-weight:bold;}
  219. .footer_additional{display:inline-block;width:50%;vertical-align:text-top;white-space:normal;}
  220. .small_footer{background-color:#2d2214;padding-bottom:0.5em;position:sticky;bottom:0px;z-index:10;box-shadow: 0.5em 0px #2d2214;}
  221. .small_footer>div{overflow:auto;white-space:nowrap;}
  222. .small_footer::before{content:'';position:absolute;left:0;right:0;bottom:0;height:1.95em;box-shadow:-2em 0em 1em -1em inset #2d2214;pointer-events:none;}
  223. .top_post_hint{margin-left:0.5em;font-weight:bold;}
  224. .white{color:#2d2214;}
  225. .full_box{border:1px solid #f8ca9b !important;padding:0.3rem;overflow:auto;}
  226. .image_nav_prev,.image_nav_next{z-index:100;position:absolute;line-height:0;height:50%;width:20%;top:25%;display:flex;align-items:center;
  227. transition:background-size .2s ease;padding:0.5em;text-shadow:0px 0px 5px black;user-select:none;pointer-events:auto;}
  228. .image_nav_prev{left:0;justify-content:left;background:linear-gradient(to left, rgba(0,0,0,0), rgba(0,0,0,0.4));
  229. background-repeat:no-repeat;background-size:0% 100%;}
  230. .image_nav_prev:hover,.image_nav_next:hover{background-size:100% 100%;}
  231. .image_nav_next{right:0;justify-content:right;background:linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,0.2));
  232. background-repeat:no-repeat;background-size:0% 100%;transition:background-size .2s ease;background-position-x:100%;}
  233. .inquiry_buttons{position:fixed;left:0;right:25%;text-align:center;bottom:1em;margin:0 auto;width:max-content;
  234. background-color:rgba(0,0,0,0.5);z-index:110;padding:0.2em;padding-left:1em;padding-right:1em;
  235. border-radius:1em;box-shadow:0px 0px 5px;text-shadow:0px 0px 5px black;opacity:1;user-select:none;}
  236. .lr_buttons{background-color:rgba(0,0,0,0.5);padding:0.5em;padding-top:1em;padding-bottom:1em;
  237. border-radius:1em;box-shadow:0px 0px 5px;font-size:1.2rem;text-shadow:0px 0px 5px black;}
  238. .img_btn_hidden{opacity:0;transition:opacity 0.2s;}
  239. .special_alipay{background-color:#027aff;color:white;white-space:nowrap;
  240. font-family:sans-serif;font-weight:bold;border-radius:0.7em;font-size:0.75em;padding:0.25em;}
  241. .special_paypal{background-color:white;color:#253b80;white-space:nowrap;
  242. font-family:sans-serif;font-weight:bold;border-radius:2em;font-size:0.75em;
  243. padding:0.25em;padding-left:0.5em;padding-right:0.65em;font-style: italic;}
  244. .special_paypal_inner{color:#169bd7;}
  245. #waiting_bar{position:fixed;z-index:200;top:0;left:0;right:0;height:0.2em;background-color:#f8ca9b;transform:translate(-100%,0);
  246. animation:anim_loading 1s linear infinite;}
  247. @keyframes anim_loading{0%{transform:translate(-100%,0);} 100%{transform:translate(100%,0);}}
  248. .product_ref{width:32%;padding:0.2em!important;display:inline-block;text-align:center;vertical-align:top;margin-bottom:0.8em;}
  249. .product_thumb{max-height:11em;max-width:11em;display:inline-flex;margin-bottom:0.2em;background-color:#a9270e;}
  250. .product_thumb img,{box-shadow:none;object-fit:contain;max-height:unset;max-width:unset;width:100%;margin:0 auto !important;}
  251. .product_ref p{margin-bottom:0.2em;text-align:left;}
  252. .post_preview .product_thumb{max-height:4em;max-width:6em;}
  253. .purchase_button{background-color:#f8ca9b;color:#2d2214;padding-left:0.5em;padding-right:0.5em;text-decoration:none;font-weight:bold;}
  254. .page_break{page-break-after:always;}
  255. .text_highlight,.text_highlight a,.text_highlight select{background-color:#f8ca9b;color:#2d2214;border:none;}
  256. .gray.text_highlight,.gray.text_highlight a,.gray.text_highlight select{background-color:#f8ca9b88;color:#2d2214;}
  257. .show_on_print{display:none;}.inline_print{display:none;}
  258. .comment{font-size:0.9em;font-family:sans-serif;overflow:auto !important;width:100%;}
  259. .comment tbody tr:hover{box-shadow:none;}
  260. .comment table{border:none;}
  261. .comment li{display:list-item;list-style:'→';padding-left:0.3em;}
  262. .comment ul{padding-left:1em;}
  263. .comment ul li *{margin-bottom:0.5em;}
  264. .history li{display:list-item;list-style:disc;padding-left:0.3em;}
  265. .history li li{list-style:circle;}
  266. .history ul{padding-left:1em;}
  267. .history a{text-decoration:underline;}
  268. .history .list{overflow:auto;white-space:nowrap;}
  269. .diff_table{table-layout:fixed;}
  270. .diff_table thead{font-size:0.9em;text-align:center;}
  271. .diff_table tbody pre{font-size:0.9rem;white-space:pre-line;}
  272. .diff_table td{vertical-align:top;}
  273. .omittable_title{display:block;width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
  274. .wayback_close{float:right;}
  275. .wayback_expand{display:inline;}
  276. .post_selecting .post>*>*{pointer-events:none;}
  277. .post_selected{background-color:#a9270e;}
  278. .small_pad{padding:0.2em;padding-top:0.1em;padding-bottom:0.1em;}
  279. .wscroll{scroll-margin:3.5em;padding-left:0.3em;display:none;font-weight:bold;font-size:0.75em;box-shadow: 13em 0em 4em -8em inset #f8ca9b88;color:#2d2214;}
  280. .wscroll:target{display:block;} .post_ref .wscroll{display:none !important;}
  281. .wayback_link{display:inline;}
  282. .imd{object-fit:cover;width:100%;}
  283. .center_exp .post>.imd,.center_exp .p_row{width:60%;}
  284. .center_exp .p_thumb img,.center_exp .p_thumb video{max-height:3rem;}
  285. .center_exp .p_thumb{max-height:3rem;filter:opacity(40%);}
  286. .center_exp .p_thumb:hover{filter:unset;}
  287. #here_buttons{display:contents;}
  288. .here_buttons_inner{position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;max-height:100%;max-width:100%;}
  289. .here_btn{position:absolute;z-index:110;transform:translate(-50%,-50%);
  290. width:2em;height:2em;display:block;border:1px solid #f8ca9b;background-color:rgba(0,0,0,0.5);}
  291. .round_btn{box-shadow: 0px 0px 0px 1px inset #f8ca9b;display:inline-block;padding-left:0.4em;padding-right:0.4em;border-radius:0.5em;}
  292. .center .center{width:100%;padding-bottom:unset;}
  293. .center{border:none;}
  294. .center{overflow:auto;}
  295. .center>tbody>tr:hover{box-shadow:none;}
  296. .center>tbody>tr>td{white-space:normal;vertical-align:top;min-width:1em;}
  297. .center>tbody>tr>td:first-child{text-align:center;color:#f8ca9b88;padding-left:0.1em;}
  298. .center>tbody>tr>td:nth-child(1)>*{}
  299. .center>tbody>tr>td:nth-child(2){text-align:center;color:#f8ca9b88;box-shadow:0.3em 0px 0px -0.15em #f8ca9b44;}
  300. .center>tbody>.no_line>td:nth-child(2){box-shadow:none;}
  301. .center>tbody>tr>td:nth-child(2) a{color:#f8ca9b88;}
  302. .center>tbody>tr>td:nth-child(2) .marked{color:#f8ca9b !important;}
  303. .center>tbody>tr>td:nth-child(3){width:100%;text-align:left;padding-left:0.5em;}
  304. .center>tbody>tr>td:nth-child(3)>div{overflow:auto;}
  305. .center>tbody>tr>td:last-child{padding-right:0.5em;}
  306. .main>.center>tbody>tr{border-bottom:1px dotted #f8ca9b;}
  307. .ref_count{cursor:pointer;} td .ref_count{text-align:left;display:block;}
  308. .big_side_box .center{width:100%;}
  309. #big_image_upload{max-width:100%;}
  310. label{text-align:left;display:inline-block;}
  311. @media screen and (max-width:1000px) and (min-width:666px){
  312. .left{width:35%;}
  313. .center,.center_wide{width:65%;}
  314. .center_wide .p_thumb{height:8rem;width:8rem;margin-right:0.4rem;margin-bottom:0.4rem;box-shadow:3px 3px 12px 2px black;}
  315. .post_width{width:calc(100% - 1.5rem);padding-left:0.2em;}
  316. .hidden_on_wide{display:unset;}
  317. .pop_right{width:30%;}
  318. .pop_right_big{width:40%;}
  319. @keyframes pop_slide_in{0%{right:-30%;}100%{right:0%;}}
  320. @keyframes pop_slide_out{0%{right:0%;}100%{right:-30%;}}
  321. @keyframes pop_slide_in_big{0%{right:-40%;}100%{right:0%;}}
  322. @keyframes pop_slide_out_big{0%{right:0%;}100%{right:-40%;}}
  323. .big_side_box{width:35%;}
  324. .big_image_box{width:65%;}
  325. .inquiry_buttons{right:35%;}
  326. .table_top{left:calc(-50% - 1.7em);width:calc(154% + 0.5em);}
  327. .post_dummy > *{width:80%;max-width:55rem;}
  328. .center_exp .post>.imd,.center_exp .p_row{width:80%;max-width:55rem;}
  329. .here_btn{width:1.5em;height:1.5em;}
  330. }
  331. @media screen and (max-width:666px){
  332. .main{margin-bottom:unset;}
  333. html{font-size:16px;}
  334. pre{max-width:85vw;}
  335. #titlectrl:checked ~ header .mobile_fold{display:block !important;}
  336. #titlectrl:checked ~ .main .mobile_fold{display:block !important;}
  337. #titlectrl:checked ~ header li ul{display:inline;}
  338. .mobile_fold{display:none !important;}
  339. .hidden_m{display:none !important;}
  340. .block_m{display:block !important;}
  341. .hidden_on_desktop{display:inherit;}
  342. .hidden_on_wide{display:inherit;}
  343. header{position:inherit;}
  344. header ul{display:block;}
  345. header li{display:block;}
  346. header li::before{content:''}
  347. header::before{box-shadow:none;display:none;}
  348. .small_footer::before{box-shadow:none;display:none;}
  349. .left{position:relative;width:100%;top:unset;height:unset;max-height:unset;padding-right:0;display:block;}
  350. .center,.center_wide,.center_full{display:block;position:relative;line-break:anywhere;left:0;top:0;width:100%;padding-left:0;}
  351. .center_wide .p_thumb{height:6rem;width:6rem;margin-right:0.3rem;margin-bottom:0.3rem;box-shadow:2px 2px 10px 1px black;}
  352. .pop_right,.pop_right_big{top:unset;right:0;bottom:0;left:0;width:100%;}
  353. .pop_right{height:30%;}
  354. .pop_right_big{height:70%;}
  355. @keyframes pop_slide_in{0%{bottom:-30%;}100%{bottom:0%;}}
  356. @keyframes pop_slide_out{0%{bottom:0%;}100%{bottom:-30%;}}
  357. @keyframes pop_slide_in_big{0%{bottom:-70%;}100%{bottom:0%;}}
  358. @keyframes pop_slide_out_big{0%{bottom:0%;}100%{bottom:-70%;}}
  359. .big_image_box{position:fixed;top:0;bottom:8.5rem;left:0;right:0;width:100%;}
  360. .side_box_mobile_inner{background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(1,1,1,0.9) 20%);
  361. transition:none;background-size:100% 100%;padding:0.5rem;padding-bottom: 5em;}
  362. .side_box_mobile_inner:hover{background-size:100% 100%;}
  363. .big_side_box{position:fixed;top:0;bottom:0;right:0;left:0;width:100%;
  364. height:unset;padding:0;padding-top:calc(100vh - 8.5rem);background:none;}
  365. .p_thumb{height:3rem;}
  366. .center .post{padding-right:0rem;padding-left:0rem;}
  367. .post .p_thumb img,.post .p_thumb video{max-height:3rem;}
  368. .page,.page_gallery{padding:0.2em;padding-top:0;}
  369. header{padding-top:0.3em;}
  370. .toc_button{top:0.3em;}
  371. .small_footer{padding-bottom:0.3em;}
  372. .footer_additional{display:block;width:100%;}
  373. .album_hint{display:block;font-size:1rem;}
  374. .image_nav{position:absolute !important;}
  375. .image_nav_prev,.image_nav_next{width:25%;}
  376. .image_nav_prev:hover,.image_nav_next:hover{background-size:0% 100%;color:#f8ca9b !important;}
  377. .inquiry_buttons{position:relative;left:unset;right:unset;text-align:left;bottom:unset;margin:unset;width:unset;
  378. background-color:unset;z-index:unset;padding:unset;padding-left:unset;padding-right:unset;
  379. border-radius:unset;box-shadow:unset;text-shadow:unset;}.img_btn_hidden{opacity:1;}
  380. .lr_buttons{background-color:unset;padding:unset;padding-top:unset;padding-bottom:unset;
  381. border-radius:unset;box-shadow:unset;font-size:1.3rem;text-shadow:unset;}
  382. .opt_compact,.ref_compact{line-break:anywhere;}
  383. .table_top{left:unset;width:100%;overflow:auto;}
  384. .post table img{min(100%, 30vw) !important;}
  385. .product_ref{width:100%;display:block;}
  386. .post_dummy > *{width:100%;max-width:25rem;}
  387. .center_exp .post>.imd,.center_exp .p_row{width:100%;max-width:25rem;}
  388. .center_exp .post .p_thumb img,.center_exp .post .p_thumb video{max-height:2rem;}
  389. .center_exp .p_thumb{height:2rem;filter:opacity(40%);}
  390. .center_exp .p_thumb:hover{filter:unset;}
  391. .sticky_title{top:0;}
  392. .small_footer{position:relative;}
  393. #upload_selector{width:100%;}
  394. .interesting_tbody{background:linear-gradient(90deg, #2d2214ff, #2d221488 10em);}
  395. .wayback_expand{display:block;text-align:center;}
  396. .wayback_link{display:block;}
  397. .center_exp{display:block;width:100%;margin:0 auto;padding-bottom:1em;}
  398. .center_exp .post{overflow:auto;}
  399. .center_exp .imd{width:100%;}
  400. .here_btn{width:1.2em;height:1.2em;}
  401. .exp_h_f{height:unset !important;}
  402. .exp_f{margin-bottom:1em;}
  403. .linked_posts{padding-left:1em;}
  404. .center>tbody>tr>td{min-width:unset;}
  405. .center>tbody>tr>td:last-child{padding-right:0.1em;}
  406. }
  407. @media print{
  408. .small_footer .hidden_on_print{display:none}
  409. header b,.small_footer b{font-weight:normal;}
  410. header{display:table-header-group;box-shadow:none;} .main{display:table-row-group;top:unset;margin-bottom:unset;} .small_footer{text-align:right;}
  411. header::before{box-shadow:none;display:none;} header::after{display:block;height:1em;content:' ';}
  412. .small_footer::before{box-shadow:none;display:block;height:1em;position:relative;}
  413. body,footer,header,.small_footer,a,.clean_a,.invert_a,.clean_a a,.invert_a a{background:none;color:black;}
  414. .bkg_section,.bkg_recent>.post,.active_post{background:none !important;box-shadow:none;}
  415. .post *,.post_dummy *{margin-bottom:0em;}
  416. .p_row,.post table,.post img,.post_ref img,.post_ref .original_img,
  417. .post_width>.original_img,.post pre{margin-top:0.5rem;margin-bottom:0.5rem;text-indent:0;}
  418. pre{white-space:pre-wrap;line-break:anywhere;}
  419. .post p{line-height:1.3;text-indent:2em;} .product_ref p {text-indent:0;}
  420. .post table img{margin:0 !important;}
  421. .post h1+p,.post h2+p,.post img+p,.post video+p,.post .imd+p,.post table+p,.last_wide p:first-of-type{text-indent:0;}
  422. .post ul,.post ol{margin:0.5rem !important;margin-left:1.4rem !important;margin-right: 0rem !important;}
  423. table{border-bottom:2px solid black;border-top:2px solid black;}
  424. .post table img{max-width:5em;max-width:8em !important;max-height:8em !important;}
  425. thead{box-shadow:inset 0 -1px 0 0px black;background:none;}
  426. .linked_posts{display:none;}
  427. .post_width{overflow:clip;left:0;width:100%;padding-left:0em;padding-right:0em;}
  428. .section .post h2{font-size:1.8em;margin:1.5em auto 0 !important;}.list h2,.compact h2{margin:0 !important;}
  429. .section .post h3{font-size:1.5em;margin:1.0em auto 0 !important;}.list h3,.compact h3{margin:0 !important;}
  430. .section .post h4{font-size:1.1em;margin:0.5em auto 0 !important;}.list h4,.compact h4{margin:0 !important;}
  431. .post .post{margin-bottom:0.5rem;margin-top:0.5rem;}
  432. .gray,.gray a,.deleted_post{color:rgba(0,0,0,0.5);}
  433. .left{display:none;}
  434. .center, .center_wide, .center_full{width:100%;padding:0;font-size:16px;line-height:1.3}
  435. hr{border:1px solid black;}
  436. .post_box_top{display:none;}
  437. .post_access{display:none;}
  438. .opt_compact .post_access,.ref_compact .post_access{border-right:none;display:inline;background:unset;}
  439. .text_highlight,.text_highlight a,.gray.text_highlight,.gray.text_highlight a,.purchase_button{background-color:lightgray;color:black;}
  440. .hidden_on_print{display:none !important;}
  441. .print_column{column-count:2;margin-top:0.5rem;margin-bottom:0.5rem;}
  442. .print_column .print_column{column-count:1;margin:unset;}
  443. .opt_compact{margin-left:0;left:1.5em;}
  444. .post .post_ref{padding-left:2rem;}
  445. .section .post h1:first-of-type{column-span:all;display:block;margin-top:1rem !important;margin-bottom:0.5rem !important;}
  446. .bkg_section .restart+.post .post_width{padding-top:0;}
  447. .restart{background-color:unset;padding:unset;}
  448. .opt_compact h1:first-of-type,.ref_compact h1:first-of-type{display:unset;}
  449. .table_top{position:relative;left:0;width:100%;background:none;z-index:1;box-shadow:none;}
  450. .header_nav{display:none;}
  451. .show_on_print{display:block;}.inline_print{display:inline;}
  452. blockquote{border-left:2px solid black;}
  453. .footer_additional{display:none;}
  454. .small_footer{margin-top:1rem;box-shadow:none;}
  455. .page{display:table;width:100%;}
  456. .page_selector{display:none;}
  457. .p_thumb{height:4rem;margin-bottom:0.25rem;}
  458. .post .p_thumb img,.post .p_thumb video{max-height:4rem;}
  459. .sticky_title{box-shadow:none;}
  460. .center_wide .p_thumb{display:inline-flex;height:5.8rem;width:5.8rem;margin-right:0;}
  461. .center_wide .p_row{display:block;}
  462. .interesting_tbody{background:none;}
  463. .interesting_tbody img{display:none !important;}
  464. .imd{margin-top:0.5em;margin-bottom:0.5em;line-height:0px;}
  465. .p_row .imd{margin-top:0em;margin-bottom:0em;}
  466. .center,.center>tbody,.center>tbody>tr,.center>tbody>tr>td{display:block;}
  467. .main>.center>tbody>tr{border:none;}
  468. .center>tbody>tr>td:first-child{display:none;color:rgba(0,0,0,0.5);}
  469. .center>tbody>tr>td:nth-child(2){display:none;color:rgba(0,0,0,0.5);}
  470. .center>tbody>tr>td:nth-child(2) a{display:none;color:rgba(0,0,0,0.5);}
  471. .center>tbody>tr>td:nth-child(3){margin:unset;padding:unset;}
  472. .post > td:nth-child(3) > *{margin:unset;padding:unset;}
  473. .wide_post_print{column-span:all;margin-top:1em;margin-bottom:1em;}
  474. }