You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This repo is archived. You can view files and clone it, but cannot push or open issues/pull-requests.

232 lines
4.0 KiB

  1. /*nav {
  2. overflow: hidden;
  3. padding: 0px 0px;
  4. background: #E7732F;
  5. height: 2.2em;
  6. }
  7. nav ul {
  8. display: block;
  9. }
  10. nav ul li {
  11. display: block;
  12. float: left;
  13. padding-left: 1em;
  14. }
  15. nav ul li a img {
  16. padding: .1em .2em;
  17. width: 1.9em;
  18. }
  19. nav ul li a img:hover {
  20. background: #ffffff;
  21. }
  22. */
  23. html, body {
  24. height: 100%;
  25. }
  26. body {
  27. display: flex;
  28. flex-direction: column;
  29. }
  30. #wrapper {
  31. flex: 1 0 auto;
  32. }
  33. #footer {
  34. flex-shrink: 0;
  35. padding: 0.5em;
  36. }
  37. .text-align-right {
  38. text-align: right;
  39. }
  40. .pure-menu-item a img {
  41. padding: .1em .2em;
  42. max-height: 2.4em;
  43. min-width: 2.4em;
  44. }
  45. /*body {
  46. padding: 0em;
  47. }*/
  48. /*.pure-menu-link {
  49. color: #000000;
  50. }
  51. .pure-menu-active>.pure-menu-link,
  52. .pure-menu-link:focus,
  53. .pure-menu-link:hover {
  54. background-color:#ffffff
  55. }*/
  56. .menu-wrapper {
  57. background-color: #E7732F;
  58. margin-bottom: 2.5em;
  59. white-space: nowrap;
  60. position: relative;
  61. }
  62. .menu {
  63. display: inline-block;
  64. width: auto;
  65. vertical-align: middle;
  66. -webkit-font-smoothing: antialiased;
  67. }
  68. .menu .pure-menu-link,
  69. .menu .pure-menu-heading {
  70. color: black;
  71. }
  72. .menu .pure-menu-link:hover,
  73. .menu .pure-menu-heading:hover {
  74. background-color: transparent;
  75. }
  76. .menu-top {
  77. position: relative;
  78. padding-top: .5em;
  79. padding-bottom: .5em;
  80. }
  81. .menu-brand {
  82. display: block;
  83. text-align: center;
  84. position: relative;
  85. color: black;
  86. }
  87. .menu-toggle {
  88. width: 44px;
  89. height: 44px;
  90. display: block;
  91. position: absolute;
  92. top: 3px;
  93. right: 0;
  94. display: none;
  95. }
  96. .menu-toggle .bar {
  97. background-color: white;
  98. display: block;
  99. width: 20px;
  100. height: 2px;
  101. border-radius: 100px;
  102. position: absolute;
  103. top: 22px;
  104. right: 12px;
  105. -webkit-transition: all 0.5s;
  106. -moz-transition: all 0.5s;
  107. -ms-transition: all 0.5s;
  108. transition: all 0.5s;
  109. }
  110. .menu-toggle .bar:first-child {
  111. -webkit-transform: translateY(-6px);
  112. -moz-transform: translateY(-6px);
  113. -ms-transform: translateY(-6px);
  114. transform: translateY(-6px);
  115. }
  116. .menu-toggle.x .bar {
  117. -webkit-transform: rotate(45deg);
  118. -moz-transform: rotate(45deg);
  119. -ms-transform: rotate(45deg);
  120. transform: rotate(45deg);
  121. }
  122. .menu-toggle.x .bar:first-child {
  123. -webkit-transform: rotate(-45deg);
  124. -moz-transform: rotate(-45deg);
  125. -ms-transform: rotate(-45deg);
  126. transform: rotate(-45deg);
  127. }
  128. .menu-screen {
  129. background-color: #E7732F;
  130. -webkit-transition: all 0.5s;
  131. -moz-transition: all 0.5s;
  132. -ms-transition: all 0.5s;
  133. transition: all 0.5s;
  134. height: 3em;
  135. width: 70em;
  136. position: absolute;
  137. top: 0;
  138. z-index: -1;
  139. }
  140. .menu-tucked .menu-screen {
  141. -webkit-transform: translateY(-44px);
  142. -moz-transform: translateY(-44px);
  143. -ms-transform: translateY(-44px);
  144. transform: translateY(-44px);
  145. }
  146. @media (min-width: 62em) {
  147. .menu-screen {
  148. margin-top: 2.95em;
  149. z-index: 1;
  150. }
  151. }
  152. @media (max-width: 62em) {
  153. .menu {
  154. display: block;
  155. }
  156. .menu-toggle {
  157. display: block;
  158. display: none\9;
  159. }
  160. .menu-bottom {
  161. position: absolute;
  162. width: 100%;
  163. border-top: 1px solid #E7732F;
  164. background-color: #808080\9;
  165. z-index: 100;
  166. }
  167. .menu-bottom .pure-menu-link {
  168. opacity: 1;
  169. -webkit-transform: translateX(0);
  170. -moz-transform: translateX(0);
  171. -ms-transform: translateX(0);
  172. transform: translateX(0);
  173. -webkit-transition: all 0.5s;
  174. -moz-transition: all 0.5s;
  175. -ms-transition: all 0.5s;
  176. transition: all 0.5s;
  177. }
  178. .menu-bottom.menu-tucked .pure-menu-link {
  179. -webkit-transform: translateX(-140px);
  180. -moz-transform: translateX(-140px);
  181. -ms-transform: translateX(-140px);
  182. transform: translateX(-140px);
  183. opacity: 0;
  184. opacity: 1\9;
  185. }
  186. .pure-menu-horizontal.menu-tucked {
  187. z-index: -1;
  188. top: 45px;
  189. position: absolute;
  190. overflow: hidden;
  191. }
  192. .menu-untucked {
  193. height: 3.1em;
  194. }
  195. .pure-menu-horizontal.pure-menu-scrollable.menu-untucked {
  196. overflow-x: auto;
  197. }
  198. }