menu.css 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348
  1. /* --------------- menu footer */
  2. #bx-menu-footer {
  3. float:left;
  4. }
  5. /* --------------- horizontal menu */
  6. ul.bx-menu-hor {
  7. padding:0;
  8. margin:0;
  9. list-style:none;
  10. }
  11. .bx-menu-hor li {
  12. float:left;
  13. margin-left:20px;
  14. }
  15. .bx-menu-hor li:first-child {
  16. margin-left:0px;
  17. }
  18. .bx-menu-hor li a {
  19. display:block;
  20. text-decoration:none;
  21. }
  22. .bx-menu-hor li.bx-menu-tab-active a {
  23. color:#000;
  24. }
  25. /* --------------- vertical menu */
  26. ul.bx-menu-ver {
  27. padding:0;
  28. margin:0;
  29. list-style:none;
  30. }
  31. .bx-menu-ver li {
  32. margin-top:3px;
  33. }
  34. .bx-menu-ver li:first-child {
  35. margin-top:0px;
  36. }
  37. .bx-menu-ver li:hover {
  38. opacity:0.8;
  39. -moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.5);
  40. -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.5);
  41. box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.3);
  42. }
  43. .bx-menu-ver li:active,
  44. .bx-menu-ver li.bx-menu-tab-active {
  45. opacity:1.0;
  46. -moz-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.3);
  47. -webkit-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.3);
  48. box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.2);
  49. }
  50. .bx-menu-ver li a {
  51. display:block;
  52. text-decoration:none;
  53. }
  54. .bx-menu-ver li.bx-menu-tab-active a {
  55. color:#000;
  56. }
  57. .bx-menu-ver li img {
  58. width:16px;
  59. height:16px;
  60. background-position:center center;
  61. background-repeat:no-repeat;
  62. vertical-align:bottom;
  63. }
  64. .bx-menu-ver li .sys-icon {
  65. display:inline-block;
  66. width:16px;
  67. text-align:center;
  68. font-size:16px;
  69. }
  70. .bx-menu-ver .bx-def-hr {
  71. margin:0;
  72. }
  73. /* --------------- vertical menu lite */
  74. ul.bx-menu-verlit {
  75. padding:0;
  76. margin:0;
  77. list-style:none;
  78. }
  79. .bx-menu-verlit li {
  80. }
  81. .bx-menu-verlit li:first-child {
  82. margin-top:0px;
  83. }
  84. .bx-menu-verlit li a {
  85. display:block;
  86. text-decoration:none;
  87. }
  88. .bx-menu-verlit li.bx-menu-tab-active a {
  89. color:#000;
  90. }
  91. .bx-menu-verlit li img {
  92. width:24px;
  93. height:24px;
  94. background-position:center center;
  95. background-repeat:no-repeat;
  96. vertical-align:middle;
  97. }
  98. /* --------------- main menu */
  99. #bx-menu-main-submenu,
  100. #bx-menu-main {
  101. float:left;
  102. }
  103. #bx-menu-main-container #bx-menu-main-submenu:first-child .bx-menu-main-submenu-div:first-child {
  104. display:none;
  105. }
  106. .bx-menu-main-submenu-div .sys-icon {
  107. font-size:32px;
  108. vertical-align:middle;
  109. }
  110. ul.bx-menu-main-submenu,
  111. ul.bx-menu-main {
  112. padding:0;
  113. margin:0;
  114. list-style:none;
  115. }
  116. .bx-menu-main-submenu li,
  117. .bx-menu-main li {
  118. float:left;
  119. margin:0;
  120. }
  121. .bx-menu-main li a,
  122. .bx-menu-main li span,
  123. .bx-menu-main li .sys-icon,
  124. .bx-menu-main-submenu li a {
  125. text-decoration:none;
  126. vertical-align:middle;
  127. }
  128. .bx-menu-main li .sys-icon {
  129. font-size:32px;
  130. }
  131. .bx-menu-main-submenu li.bx-menu-tab-active a,
  132. .bx-menu-main li span {
  133. color:#000;
  134. }
  135. /* --------------- toolbar menu */
  136. #bx-menu-toolbar-1-container .bx-menu-toolbar {
  137. float:left;
  138. }
  139. #bx-menu-toolbar-2-container .bx-menu-toolbar {
  140. float:right;
  141. }
  142. .bx-menu-toolbar {
  143. list-style:none;
  144. margin:0 0 0 0;
  145. padding:0;
  146. }
  147. ul.bx-menu-toolbar li {
  148. float:left;
  149. margin:0px;
  150. }
  151. ul.bx-menu-toolbar li a {
  152. position:relative;
  153. display:block;
  154. min-width:32px;
  155. line-height:34px;
  156. font-size: 16px;
  157. font-weight: bold;
  158. text-align: center;
  159. color: #fff;
  160. text-decoration:none;
  161. text-shadow: rgba(0, 0, 0, 0.5) 0px 1px 0px;
  162. }
  163. ul.bx-menu-toolbar li:first-child a {
  164. margin-left:0;
  165. }
  166. ul.bx-menu-toolbar li img {
  167. width:32px;
  168. height:34px;
  169. background-position:center center;
  170. background-repeat:no-repeat;
  171. }
  172. ul.bx-menu-toolbar li .sys-icon {
  173. display:inline-block;
  174. width:48px;
  175. height:41px;
  176. padding-top:7px;
  177. vertical-align:middle;
  178. font-size:32px;
  179. text-align:center;
  180. text-shadow: 0px 0px 2px #000;
  181. }
  182. ul.bx-menu-toolbar li:hover .sys-icon {
  183. background-color:rgba(255, 255, 255, 0.05);
  184. -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px -1px 0px 0px rgba(255, 255, 255, 0.3);
  185. -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px -1px 0px 0px rgba(255, 255, 255, 0.3);
  186. box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px -1px 0px 0px rgba(255, 255, 255, 0.3);
  187. text-shadow: 0px 0px 1px #000;
  188. }
  189. ul.bx-menu-toolbar li.bx-menu-tab-active .sys-icon,
  190. ul.bx-menu-toolbar li:active .sys-icon {
  191. height:40px;
  192. padding-top:8px;
  193. background-color:rgba(0, 0, 0, 0.05);
  194. -moz-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px 1px 0px 0px rgba(255, 255, 255, 0.3);
  195. -webkit-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px 1px 0px 0px rgba(255, 255, 255, 0.3);
  196. box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.3), 0px 1px 0px 0px rgba(255, 255, 255, 0.3);
  197. text-shadow: 0px 0px 1px #000;
  198. }
  199. /* --------------- floating blocks menu */
  200. ul.bx-menu-floating-blocks {
  201. padding:0;
  202. margin:0;
  203. list-style:none;
  204. }
  205. .bx-menu-floating-blocks li {
  206. display: inline-block;
  207. /* For IE 7 */
  208. zoom: 1;
  209. *display: inline;
  210. vertical-align:top;
  211. width:170px;
  212. height:170px;
  213. }
  214. .bx-menu-floating-blocks li:hover {
  215. opacity:0.8;
  216. -moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.5);
  217. -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.5);
  218. box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.3);
  219. }
  220. .bx-menu-floating-blocks li:active,
  221. .bx-menu-floating-blocks li.bx-menu-tab-active {
  222. opacity:1.0;
  223. -moz-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.3);
  224. -webkit-box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.3);
  225. box-shadow: inset 0px 0px 1px 0px rgba(0, 0, 0, 0.4), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.2);
  226. }
  227. .bx-menu-floating-blocks li a {
  228. display:block;
  229. text-decoration:none;
  230. }
  231. .bx-menu-floating-blocks li.bx-menu-tab-active a {
  232. color:#000;
  233. }
  234. .bx-menu-floating-blocks li img {
  235. display:block;
  236. width:128px;
  237. height:128px;
  238. margin:10px 34px 5px 20px;
  239. background-position:center center;
  240. background-repeat:no-repeat;
  241. }
  242. .bx-menu-floating-blocks li .sys-icon {
  243. display:block;
  244. width:128px;
  245. height:128px;
  246. line-height:128px;
  247. margin:15px 34px 0px 20px;
  248. text-align:center;
  249. vertical-align:bottom;
  250. font-size:142px;
  251. }
  252. .bx-menu-floating-blocks-title {
  253. text-align:center;
  254. }
  255. /* --------------- interactive block menu */
  256. ul.bx-menu-inter {
  257. padding:0;
  258. margin:0;
  259. list-style:none;
  260. }
  261. ul.bx-menu-inter li {
  262. float:left;
  263. }
  264. li.bx-menu-inter-div {
  265. padding: 0px 3px;
  266. }
  267. li.bx-menu-inter-div:first-child {
  268. display: none;
  269. }
  270. li.bx-menu-inter-act {}
  271. li.bx-menu-inter-pas {}
  272. li.bx-menu-inter-hidden {
  273. display: none;
  274. }