1@media screen and (max-width: 1000px) {
2  .container {
3    margin: 0px; width: 90%;
4    margin-left: auto; margin-right: auto;
5  }
6}
7
8@media screen and (max-width: 800px) {
9  .container { margin: 0px; width: 100%; }
10	.pagename { width: 100% !important; }
11	.row { max-width: 100%; }
12  .contentbox { min-height: unset; }
13	.column { display: block !important; width: 100% !	important; }
14  .contentbox:last-child { border-left: 10px solid #3c3c3c; }
15  .sparewidth { flex-grow: unset; }
16  .flex { display: block !important; }
17  #ddblueblockmenu { font-size: 1.35em; }
18  #ddblueblockmenu li a{ margin-bottom: 0.85em; }
19  .showbreak:not(:first-child) { position: relative; bottom: 0px; }
20  #writtensidebar li { font-size: 18.9px; }
21  #writtensidebar li a { padding-left: 0px;  }
22}
23
24/* media manager and config manager for mobile */
25@media screen and (max-width: 480px){
26  fieldset,
27  #mediamanager__page,
28  #mediamanager__page .filelist{
29    max-width: 100%; min-width: unset;
30  }
31  #mediamanager__page .file,
32  #mediamanager__page .namespaces,
33  #mediamanager__page .panel {
34    width: 100%; clear: both; float: none;
35  }
36  /*.page li, .page dd { margin: 1.35em 0px !important; display: block; }*/
37  #config__manager tr { }
38  #config__manager td { display: block;  padding: 1.15em 0px; max-width: 75%;  }
39
40  .dokuwiki fieldset { width: unset; }
41  #config__manager fieldset { width: 94%; box-sizing: border-box; }
42
43     /* make <select> not exceed it's parent div's width */
44    /* https://stackoverflow.com/q/44810056/337306 */
45    div.input { display: flex; } select { width: 100%; flex-shrink: 1; }
46
47  #config__manager fieldset td.value { width: unset; }
48
49  #config__manager td textarea.edit { width: 90%; }
50
51  #config__manager td .input,
52  #config__manager fieldset td.value,
53  #config__manager td input.edit {
54    max-width: 100%;
55    width: unset;
56  }
57}