structure.css 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. /*First, we start off with specifying what parts of the DOM we want hidden*/
  2. /*Make sure it uses !important so that any JS helper for responsiveness doesn't override this*/
  3. #leftbar, #rightbar, #footbar, #midtitle {
  4. display: none !important;
  5. }
  6. /*Now, on to positioning of the elements*/
  7. body {
  8. position: relative;
  9. margin: 0;
  10. width: 100%;
  11. min-height: 100vh;
  12. max-height: 100%;
  13. }
  14. #topkek {
  15. display: table;
  16. position: fixed;
  17. z-index: 2;
  18. top: 0;
  19. width: 100%;
  20. height: 2rem;
  21. }
  22. .toplel {
  23. display: table-cell;
  24. }
  25. #lefttitle {
  26. padding-left: .5em;
  27. max-width: 50%;
  28. min-width: 33%;
  29. }
  30. #midtitle {
  31. width: 33%;
  32. }
  33. #righttitle {
  34. min-width: 33%;
  35. max-width: 50%;
  36. padding-right: .5em;
  37. }
  38. #righttitle a, #configbar a {
  39. display: inline-block;
  40. }
  41. #menubutton {
  42. display: none;
  43. min-width: 2%;
  44. max-width: 33%;
  45. padding-right: .5em;
  46. }
  47. #littlemenu {
  48. display: none;
  49. position: fixed;
  50. z-index: 3;
  51. top: 1.5em;
  52. right: 0px;
  53. padding: 0px .5em .5em .5em;
  54. }
  55. #littlemenu a {
  56. display: block;
  57. }
  58. #kontainer {
  59. display: table;
  60. width: 100%;
  61. padding-bottom: 2.5em;
  62. }
  63. .kontained {
  64. display: table-cell;
  65. }
  66. #leftbar {
  67. width: 6em;
  68. padding-right: .5em;
  69. }
  70. #kontent {
  71. padding: 3em .5em .5em .5em;
  72. min-height: 50%;
  73. max-width: 100%;
  74. margin-top: 0px;
  75. }
  76. #rightbar {
  77. width: 6em;
  78. padding-left: .5em;
  79. }
  80. #footbar {
  81. position: absolute;
  82. bottom: 0;
  83. width: 100%;
  84. height: 1.5em;
  85. }
  86. #stories {
  87. padding: 0px .5em .5em .5em;
  88. width: 80%;
  89. display: table-cell;
  90. }