menu.css 24 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019
  1. /* --------------- general */
  2. li.bx-mi-aux {}
  3. li.bx-mi-hidden {
  4. display: none;
  5. }
  6. /* --------------- horizontal menu */
  7. ul.bx-menu-hor,
  8. ul.bx-menu-custom-hor {
  9. padding:0;
  10. margin:0;
  11. list-style:none;
  12. }
  13. .bx-menu-hor > li,
  14. .bx-menu-custom-hor > li {
  15. display:inline-block;
  16. vertical-align:middle;
  17. }
  18. .bx-menu-hor li a,
  19. .bx-menu-custom-hor li a {
  20. display:block;
  21. text-decoration:none;
  22. }
  23. .bx-menu-hor-inline li a:not(.bx-btn) {
  24. display: inline-flex;
  25. }
  26. .bx-menu-hor li.bx-menu-tab-active a,
  27. .bx-menu-custom-hor li.bx-menu-tab-active a {
  28. color:#000;
  29. }
  30. .bx-menu-hor li img,
  31. .bx-menu-hor li .sys-icon,
  32. .bx-menu-custom-hor li img,
  33. .bx-menu-custom-hor li .sys-icon {
  34. display:inline-block;
  35. vertical-align:middle;
  36. }
  37. .bx-menu-hor li img,
  38. .bx-menu-custom-hor li img {
  39. height:1.6rem;
  40. width:auto;
  41. background-position: center center;
  42. background-repeat: no-repeat;
  43. }
  44. .bx-menu-hor li a > span,
  45. .bx-menu-custom-hor li a > span{
  46. vertical-align:middle;
  47. }
  48. /* --------------- horizontal inline menu with 'special' buttons */
  49. .bx-menu-hor-inline-sbtn li a {
  50. position: relative;
  51. display: inline-block;
  52. height: 24px;
  53. height: 1.6rem;
  54. line-height: 24px;
  55. line-height: 1.6rem;
  56. }
  57. /* --------------- vertical, vertical lite, notifications menu */
  58. ul.bx-menu-notif,
  59. ul.bx-menu-verlit,
  60. ul.bx-menu-ver,
  61. ul.bx-menu-custom-ver {
  62. padding:0;
  63. margin:0;
  64. list-style:none;
  65. }
  66. .bx-menu-ver li,
  67. .bx-menu-custom-ver li {
  68. margin-top:1px;
  69. }
  70. .bx-menu-notif li:first-child,
  71. .bx-menu-verlit li:first-child,
  72. .bx-menu-ver li:first-child,
  73. .bx-menu-custom-ver li:first-child {
  74. margin-top:0px;
  75. }
  76. .bx-menu-verlit li a,
  77. .bx-menu-ver li a {
  78. display:block;
  79. text-decoration:none;
  80. }
  81. .bx-menu-notif li.bx-menu-tab-active a,
  82. .bx-menu-verlit li.bx-menu-tab-active a,
  83. .bx-menu-ver li.bx-menu-tab-active a {
  84. color:#000;
  85. }
  86. .bx-menu-notif li img,
  87. .bx-menu-notif li .sys-icon,
  88. .bx-menu-notif li span,
  89. .bx-menu-verlit li img,
  90. .bx-menu-verlit li .sys-icon,
  91. .bx-menu-verlit li span,
  92. .bx-menu-ver li img,
  93. .bx-menu-ver li .sys-icon,
  94. .bx-menu-ver li span {
  95. display:inline-block;
  96. vertical-align:middle;
  97. }
  98. .bx-menu-notif li img,
  99. .bx-menu-notif li .sys-icon,
  100. .bx-menu-verlit li img,
  101. .bx-menu-verlit li svg,
  102. .bx-menu-verlit li .sys-icon,
  103. .bx-menu-ver li img,
  104. .bx-menu-ver li svg,
  105. .bx-menu-ver li .sys-icon {
  106. width:20px;
  107. width:1.25rem;
  108. height:20px;
  109. height:1.25rem;
  110. margin-right:2px;
  111. margin-right:0.125rem;
  112. text-align:center;
  113. vertical-align: top;
  114. }
  115. .bx-menu-notif li img,
  116. .bx-menu-verlit li img,
  117. .bx-menu-ver li img {
  118. background-size:1.25rem 1.25rem;
  119. background-position:center center;
  120. background-repeat:no-repeat;
  121. }
  122. .bx-menu-ver li .sys-icon {
  123. font-size:20px;
  124. font-size:1.25rem;
  125. }
  126. .bx-menu-ver li .flag-icon {
  127. vertical-align:baseline;
  128. }
  129. .bx-menu-notif li .sys-icon {
  130. font-size:24px;
  131. font-size:1.5rem;
  132. width:24px;
  133. width:1.5rem;
  134. height:24px;
  135. height:1.5rem;
  136. margin-right:5px;
  137. margin-right:0.3rem;
  138. }
  139. .bx-menu-ver .bx-def-hr {
  140. margin:0;
  141. }
  142. .bx-menu-verlit li img {
  143. width:24px;
  144. width:1.5rem;
  145. height:24px;
  146. height:1.5rem;
  147. background-position:center center;
  148. background-repeat:no-repeat;
  149. vertical-align:middle;
  150. }
  151. .bx-menu-verlit li svg {
  152. vertical-align:middle;
  153. }
  154. .bx-menu-notif .bx-def-unit-alert-middle {
  155. position:relative;
  156. float:right;
  157. }
  158. /* --------------- main menu */
  159. /*--- Main (Top) menu ---*/
  160. #bx-sliding-menu-sys_site ul.bx-menu-object-sys_site li.bx-menu-item-more-auto {
  161. display: none;
  162. }
  163. #bx-homepage-menu-sys_homepage {
  164. text-align:center;
  165. }
  166. #bx-menu-main-submenu {
  167. line-height:2.5rem;
  168. vertical-align:top;
  169. }
  170. .bx-menu-main-submenu-div .sys-icon {
  171. font-size:32px;
  172. font-size:2rem;
  173. }
  174. ul.bx-menu-main-submenu {
  175. padding:0;
  176. margin:0;
  177. list-style:none;
  178. white-space:nowrap;
  179. }
  180. .bx-menu-main-submenu li {
  181. display:inline-block;
  182. margin:0;
  183. vertical-align:top;
  184. }
  185. .bx-menu-main-submenu li a {
  186. display:inline-block;
  187. text-decoration:none;
  188. font-size:1.2rem;
  189. line-height:2.5rem;
  190. vertical-align:top;
  191. }
  192. .bx-menu-main-submenu li.bx-menu-tab-active a {
  193. color:#000;
  194. }
  195. /* --------------- toolbar menu */
  196. .bx-menu-toolbar {
  197. list-style:none;
  198. margin:0 0 0 0;
  199. padding:0;
  200. }
  201. ul.bx-menu-toolbar li {
  202. position:relative;
  203. float:left;
  204. margin:0px;
  205. }
  206. ul.bx-menu-toolbar li a {
  207. position: relative;
  208. display: -webkit-flex;
  209. display: flex;
  210. -webkit-justify-content: center;
  211. justify-content: center;
  212. -webkit-align-items: center;
  213. align-items: center;
  214. height: 3rem;
  215. font-size: 1rem;
  216. text-align: center;
  217. text-decoration: none;
  218. }
  219. ul.bx-menu-toolbar li a .sys-icon,
  220. ul.bx-menu-toolbar li a .sys-icon-a,
  221. ul.bx-menu-toolbar li a img,
  222. ul.bx-menu-toolbar li a span {
  223. vertical-align:top;
  224. }
  225. ul.bx-menu-toolbar li a .sys-icon-a {
  226. margin-top:0.75rem;
  227. }
  228. ul.bx-menu-toolbar li img {
  229. max-height:48px;
  230. max-height:3rem;
  231. background-position:center center;
  232. background-repeat:no-repeat;
  233. }
  234. ul.bx-menu-toolbar li .sys-icon-a,
  235. ul.bx-menu-toolbar li .sys-icon {
  236. display: inline-block;
  237. vertical-align: middle;
  238. width: 1.5rem;
  239. text-align: center;
  240. font-size: 1.5rem;
  241. }
  242. ul.bx-menu-toolbar li img,
  243. ul.bx-menu-toolbar li .sys-icon.sys-icon-svg {
  244. height: 1.5rem;
  245. }
  246. ul.bx-menu-toolbar li .bx-menu-toolbar-item-unit {
  247. display: inline-block;
  248. vertical-align: middle;
  249. }
  250. ul.bx-menu-toolbar li .bx-menu-toolbar-item-unit .bx-base-pofile-unit-online {
  251. display: none;
  252. }
  253. ul.bx-menu-toolbar li a .bx-def-unit-alert-middle {
  254. right: 5px;
  255. right: -0.3125rem;
  256. }
  257. .bx-menu-toolbar-padding {
  258. padding-top: 48px;
  259. padding-top: 3rem;
  260. }
  261. #bx-menu-toolbar-1-container .bx-menu-toolbar {
  262. float:left;
  263. }
  264. #bx-menu-toolbar-2-container .bx-menu-toolbar {
  265. float:right;
  266. }
  267. #bx-menu-toolbar-2-container .bx-menu-toolbar .bx-menu-toolbar-item-title {
  268. display: inline-block;
  269. max-width: 10.0rem;
  270. white-space: nowrap;
  271. text-overflow:ellipsis;
  272. overflow:hidden;
  273. }
  274. /* --------------- floating blocks menu */
  275. .bx-sliding-menu-close,
  276. .bx-sliding-menu-close:hover {
  277. position:absolute;
  278. top:0;
  279. right:0;
  280. text-decoration:none;
  281. }
  282. .bx-sliding-menu,
  283. .bx-sliding-menu-main {
  284. width:100%;
  285. background-color: rgba(255, 255, 255, 0.9);
  286. overflow-x:auto;
  287. -webkit-overflow-scrolling:touch;
  288. }
  289. .bx-sliding-menu-fullheight {
  290. height:calc(100% - 3rem);
  291. overflow-x:hidden;
  292. overflow-y:auto;
  293. }
  294. .bx-sliding-menu > .bx-def-page-width,
  295. .bx-sliding-menu-main > .bx-def-page-width {
  296. position: relative;
  297. }
  298. .bx-sliding-menu-main ul.bx-menu-floating-blocks-big {
  299. display:table;
  300. margin:0 auto;
  301. white-space:nowrap;
  302. }
  303. .bx-popup-content .bx-menu-floating-blocks-wide,
  304. .bx-popup-content .bx-menu-floating-blocks {
  305. width:256px;
  306. width:16rem;
  307. }
  308. ul.bx-menu-floating-blocks-dash{
  309. display: flex;
  310. flex-wrap: wrap;
  311. align-content: space-between;
  312. }
  313. ul.bx-menu-floating-blocks-wide,
  314. ul.bx-menu-floating-blocks-big,
  315. ul.bx-menu-floating-blocks-dash,
  316. ul.bx-menu-floating-blocks {
  317. padding:0;
  318. margin:0;
  319. list-style:none;
  320. }
  321. .bx-menu-floating-blocks-big li,
  322. .bx-menu-floating-blocks-wide li,
  323. .bx-menu-floating-blocks li {
  324. display: inline-block;
  325. /* For IE 7 */
  326. zoom: 1;
  327. *display: inline;
  328. vertical-align:top;
  329. width:80px;
  330. width:5rem;
  331. height:80px;
  332. height:5rem;
  333. }
  334. .bx-menu-floating-blocks-big li {
  335. width:128px;
  336. width:8rem;
  337. height:128px;
  338. height:8rem;
  339. }
  340. .bx-menu-floating-blocks-dash li {
  341. display: block;
  342. width: 24.9%;
  343. height: 3.35rem;
  344. }
  345. .bx-media-desktop .bx-menu-floating-blocks-dash li {
  346. min-width: 14.0rem;
  347. }
  348. .bx-media-phone .bx-menu-floating-blocks-dash li {
  349. width: 49.5%;
  350. }
  351. .bx-menu-floating-blocks-dash-item a {
  352. display:flex !important;
  353. flex-direction: row;
  354. justify-content: flex-start;
  355. align-items: center
  356. }
  357. .bx-menu-floating-blocks-dash-item span a {
  358. display:inline-block !important;
  359. }
  360. .bx-menu-floating-blocks-dash-item .bx-menu-floating-blocks-icon {
  361. position: relative;
  362. display: -webkit-flex;
  363. display: flex;
  364. -webkit-align-items: center;
  365. align-items: center;
  366. -webkit-justify-content: center;
  367. justify-content: center;
  368. width: 2.5rem;
  369. height: 2.5rem;
  370. border-radius: 1.25rem;
  371. background-color: #edf1f7;
  372. }
  373. .bx-menu-floating-blocks-dash-title {
  374. display:flex;
  375. width:calc(100% - 3rem);
  376. height:2.35rem;
  377. flex-direction: column;
  378. justify-content: center;
  379. }
  380. .bx-media-phone .bx-menu-floating-blocks-title {
  381. font-size:0.75rem;
  382. }
  383. .bx-menu-floating-blocks-wide li {
  384. position:relative;
  385. width:100px;
  386. width:6.25rem;
  387. }
  388. .bx-menu-floating-blocks-wide li .bx-menu-item-addon {
  389. right:10px;
  390. right:0.625rem;
  391. bottom:auto;
  392. top:0;
  393. }
  394. .bx-menu-floating-blocks-big li:hover,
  395. .bx-menu-floating-blocks-dash li:hover,
  396. .bx-menu-floating-blocks-wide li:hover,
  397. .bx-menu-floating-blocks li:hover {
  398. opacity:0.8;
  399. }
  400. .bx-menu-floating-blocks-big li:active,
  401. .bx-menu-floating-blocks-big li.bx-menu-tab-active,
  402. .bx-menu-floating-blocks-dash li:active,
  403. .bx-menu-floating-blocks-dash li.bx-menu-tab-active,
  404. .bx-menu-floating-blocks-wide li:active,
  405. .bx-menu-floating-blocks-wide li.bx-menu-tab-active,
  406. .bx-menu-floating-blocks li:active,
  407. .bx-menu-floating-blocks li.bx-menu-tab-active {
  408. opacity:1.0;
  409. }
  410. .bx-menu-floating-blocks-big li a,
  411. .bx-menu-floating-blocks-dash li a,
  412. .bx-menu-floating-blocks-wide li a,
  413. .bx-menu-floating-blocks li a {
  414. display:block;
  415. text-decoration:none;
  416. }
  417. .bx-menu-floating-blocks-big li.bx-menu-tab-active a,
  418. .bx-menu-floating-blocks-dash li.bx-menu-tab-active a,
  419. .bx-menu-floating-blocks-wide li.bx-menu-tab-active a,
  420. .bx-menu-floating-blocks li.bx-menu-tab-active a {
  421. color:#000;
  422. }
  423. .bx-menu-floating-blocks li img,
  424. .bx-menu-floating-blocks-wide li img,
  425. .bx-menu-floating-blocks li .sys-icon,
  426. .bx-menu-floating-blocks-wide li .sys-icon {
  427. display:block;
  428. height:32px;
  429. height:2rem;
  430. margin:16px 0 8px 0;
  431. margin:1rem 0 0.5rem 0;
  432. }
  433. .bx-menu-floating-blocks li img,
  434. .bx-menu-floating-blocks-wide li img {
  435. width:32px;
  436. width:2rem;
  437. margin:16px 20px 3px 20px;
  438. margin:1rem 1.5rem 0.5rem 1.5rem;
  439. background-size:2rem 2rem;
  440. }
  441. .bx-menu-floating-blocks-big li img,
  442. .bx-menu-floating-blocks-big li .sys-icon {
  443. display:block;
  444. height:64px;
  445. height:4rem;
  446. margin:16px 0 8px 0;
  447. margin:1rem 0 0.5rem 0;
  448. }
  449. .bx-menu-floating-blocks-big li img {
  450. width:64px;
  451. width:4rem;
  452. margin:16px 32px 8px 32px;
  453. margin:1rem 2rem 0.5rem 2rem;
  454. background-size:4rem 4rem;
  455. }
  456. .bx-menu-floating-blocks-wide li img {
  457. margin-left:34px;
  458. margin-right:34px;
  459. margin-left:2.125rem;
  460. margin-right:2.125rem;
  461. }
  462. .bx-menu-floating-blocks-big li img,
  463. .bx-menu-floating-blocks-dash li img,
  464. .bx-menu-floating-blocks-wide li img,
  465. .bx-menu-floating-blocks li img {
  466. background-position:center center;
  467. background-repeat:no-repeat;
  468. }
  469. .bx-menu-floating-blocks-big li .sys-icon,
  470. .bx-menu-floating-blocks-dash li .sys-icon,
  471. .bx-menu-floating-blocks-wide li .sys-icon,
  472. .bx-menu-floating-blocks li .sys-icon {
  473. text-align:center;
  474. vertical-align:bottom;
  475. line-height:32px;
  476. line-height:2rem;
  477. font-size:32px;
  478. font-size:2rem;
  479. }
  480. .bx-menu-floating-blocks-big li .sys-icon {
  481. line-height:64px;
  482. line-height:4rem;
  483. font-size:64px;
  484. font-size:4rem;
  485. }
  486. .bx-menu-floating-blocks-dash li .sys-icon {
  487. display: block;
  488. font-size: 1.2rem;
  489. }
  490. .bx-menu-floating-blocks-big li .bx-menu-floating-blocks-title,
  491. .bx-menu-floating-blocks-wide li .bx-menu-floating-blocks-title,
  492. .bx-menu-floating-blocks li .bx-menu-floating-blocks-title {
  493. text-align:center;
  494. overflow:hidden;
  495. text-overflow:ellipsis;
  496. white-space:nowrap;
  497. }
  498. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-title {
  499. text-align:left;
  500. font-weight:bold;
  501. overflow:hidden;
  502. text-overflow:ellipsis;
  503. white-space:nowrap;
  504. }
  505. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-info {
  506. text-align:left;
  507. overflow:hidden;
  508. text-overflow:ellipsis;
  509. white-space:nowrap;
  510. }
  511. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-info .divider:first-child {
  512. display: none;
  513. }
  514. /* --------------- interactive block menu */
  515. ul.bx-menu-inter,
  516. ul.bx-menu-inter-vert {
  517. padding:0;
  518. margin:0;
  519. list-style:none;
  520. }
  521. ul.bx-menu-inter li {
  522. float:left;
  523. }
  524. ul.bx-menu-inter li:hover {
  525. background-color: transparent;
  526. }
  527. li.bx-menu-inter-div {
  528. padding: 0px 3px;
  529. }
  530. li.bx-menu-inter-div:first-child {
  531. display: none;
  532. }
  533. li.bx-menu-inter-act .sys-icon {
  534. color: rgba(0, 0, 0, 0.2);
  535. }
  536. li.bx-menu-inter-pas a:hover {
  537. background-color: transparent;
  538. text-decoration: none;
  539. }
  540. li.bx-menu-inter-hidden {
  541. display: none;
  542. }
  543. /* --------------- horizontal buttons menu */
  544. ul.bx-menu-btns-ver,
  545. ul.bx-menu-btns-hor,
  546. ul.bx-menu-btns-icon-hor {
  547. padding:0;
  548. margin:0;
  549. list-style:none;
  550. }
  551. ul.bx-menu-btns-ver,
  552. ul.bx-menu-btns-hor {
  553. text-align:center;
  554. }
  555. ul.bx-menu-btns-hor li,
  556. ul.bx-menu-btns-icon-hor li {
  557. display:inline;
  558. display:inline-block;
  559. vertical-align: bottom;
  560. }
  561. ul.bx-menu-btns-ver li {
  562. text-align:center;
  563. }
  564. ul.bx-menu-btns-ver li .bx-btn {
  565. float:none;
  566. display:inline-block;
  567. }
  568. ul.bx-menu-btns-hor li .bx-btn,
  569. ul.bx-menu-btns-icon-hor li .bx-btn {
  570. height: auto;
  571. padding-top: 0.375rem;
  572. padding-bottom: 0.375rem;
  573. line-height: normal;
  574. }
  575. ul.bx-menu-btns-hor li:last-child .bx-btn,
  576. ul.bx-menu-btns-icon-hor li:last-child .bx-btn {
  577. margin-right:0;
  578. }
  579. /* --------------- account popup menu */
  580. .bx-popup-content .bx-menu-account-popup {
  581. min-width: 17em;
  582. }
  583. .bx-popup-content .bx-menu-account-popup .bx-menu-floating-blocks-wide,
  584. .bx-popup-content .bx-menu-account-popup .bx-menu-floating-blocks {
  585. width: auto;
  586. }
  587. .bx-menu-account-popup-profile-active .bx-base-pofile-unit {
  588. float: none;
  589. width: 100%;
  590. box-sizing: border-box;
  591. margin: 0;
  592. padding-right: 2rem;
  593. }
  594. .bx-menu-account-popup-profile-notifications {
  595. text-align: center;
  596. }
  597. .bx-menu-account-popup-profile-notifications ul.bx-menu-floating-blocks-wide {
  598. display: inline-block;
  599. max-width: 50rem;
  600. }
  601. .bx-menu-account-popup-profile-switcher .sys-profile-switch-row:last-child {
  602. padding-bottom: 0px;
  603. }
  604. .bx-menu-account-popup-profile-create {
  605. text-align: center;
  606. }
  607. .bx-menu-account-popup-profile-create a:hover,
  608. .bx-menu-account-popup-profile-create a {
  609. text-decoration:none;
  610. }
  611. .bx-menu-account-popup-profile-create .bx-btn {
  612. float: none;
  613. display: inline-block;
  614. width: 100%;
  615. max-width: 20rem;
  616. }
  617. /* --------------- custom menu */
  618. .bx-menu-custom > li > span:not(.bx-menu-meta-item-ex),
  619. .bx-menu-custom > li > a {
  620. display:inline-block;
  621. }
  622. .bx-menu-custom.bx-menu-custom-hor > li > span {
  623. margin-right: 1rem;
  624. }
  625. /*--- Custom Menu with More Auto ---*/
  626. .bx-menu-main-submenu.bx-menu-more-auto,
  627. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto {
  628. position: relative;
  629. display: -webkit-flex;
  630. display: flex;
  631. -webkit-align-items: center;
  632. align-items: center;
  633. -webkit-justify-content: flex-start;
  634. justify-content: flex-start;
  635. }
  636. .bx-menu-main-submenu.bx-menu-more-auto,
  637. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto {
  638. -webkit-flex-wrap: nowrap;
  639. flex-wrap: nowrap;
  640. overflow: hidden;
  641. }
  642. .bx-menu-main-submenu.bx-menu-more-auto {
  643. -webkit-justify-content: center;
  644. justify-content: center;
  645. }
  646. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item,
  647. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item {
  648. position: relative;
  649. display: block;
  650. padding: 0 8px;
  651. padding: 0 0.5rem;
  652. text-align: left;
  653. }
  654. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item .sys-icon {
  655. display: inline-block;
  656. vertical-align: top;
  657. width: 1.6rem;
  658. }
  659. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > a:last-child,
  660. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > a.bx-btn:last-child,
  661. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > span:last-child,
  662. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > a,
  663. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > a.bx-btn,
  664. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > span,
  665. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > a:last-child,
  666. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > a.bx-btn:last-child,
  667. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > span:last-child,
  668. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > a,
  669. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > a.bx-btn,
  670. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > span {
  671. margin-right: 0;
  672. }
  673. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto,
  674. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto {
  675. display: none;
  676. }
  677. .bx-menu-custom-ver .bx-menu-item.bx-menu-item-more-auto {
  678. display: none !important;
  679. }
  680. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto > span,
  681. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto > span {
  682. display: block;
  683. margin: 0;
  684. }
  685. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto .bx-popup .bx-menu-item,
  686. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto .bx-popup .bx-menu-item {
  687. padding-top: 0.25rem;
  688. padding-bottom: 0.25rem;
  689. }
  690. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon {
  691. display: inline-block;
  692. vertical-align: middle;
  693. width: 2.0rem;
  694. }
  695. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  696. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  697. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn-height,
  698. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn-height {
  699. height: auto;
  700. line-height: auto;
  701. }
  702. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  703. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn {
  704. position: relative;
  705. display: -webkit-flex;
  706. display: flex;
  707. -webkit-align-items: center;
  708. align-items: center;
  709. margin: 0;
  710. padding: 0;
  711. background-color: transparent;
  712. border-width: 0;
  713. border-radius: 0;
  714. box-shadow: none;
  715. text-shadow: none;
  716. }
  717. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon,
  718. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon,
  719. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  720. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn {
  721. color: #3e8685;
  722. }
  723. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-base-general-ea-sa .sys-action-element-holder a span:not(.sys-action-do-icon) {
  724. display: none;
  725. }
  726. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item.bx-base-general-ea-sa .sys-action-element-holder a span:not(.sys-action-do-icon) {
  727. display: inline;
  728. }
  729. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item.bx-base-general-ea-sa .sys-action-element-holder a span.sys-action-do {
  730. margin-left: 0px;
  731. }
  732. /*--- Vertical (Vertical Custom) Menus (in Popup) ---*/
  733. .bx-popup .bx-menu-custom-ver li > span {
  734. display: -webkit-flex;
  735. display: flex;
  736. -webkit-align-items: center;
  737. align-items: center;
  738. -webkit-justify-content: space-between;
  739. justify-content: space-between;
  740. }
  741. .bx-popup .bx-menu-custom-ver li a {
  742. position: relative;
  743. display: -webkit-flex;
  744. display: flex;
  745. -webkit-flex-flow: row nowrap;
  746. flex-flow: row nowrap;
  747. -webkit-align-items: center;
  748. align-items: center;
  749. -webkit-justify-content: flex-start;
  750. justify-content: flex-start;
  751. box-sizing: border-box;
  752. width: 100%;
  753. }
  754. .bx-popup .bx-menu-ver li img,
  755. .bx-popup .bx-menu-ver li .sys-icon,
  756. .bx-popup .bx-menu-custom-ver li img,
  757. .bx-popup .bx-menu-custom-ver li .sys-icon {
  758. display: inline-block;
  759. vertical-align: middle;
  760. width: 1.5rem;
  761. height: 1.5rem;
  762. line-height: 1.5rem;
  763. font-size: 1.5rem;
  764. }
  765. .bx-popup .bx-menu-ver li .sys-icon:before,
  766. .bx-popup .bx-menu-custom-ver li .sys-icon:before {
  767. display: block;
  768. text-align: center;
  769. }
  770. /* --------------- profile stats menu */
  771. .bx-menu-ver.bx-menu-vertical-more-less li {
  772. border-width: 0;
  773. border-radius: 0;
  774. }
  775. .bx-menu-ver.bx-menu-vertical-more-less li .bx-menu-item-cnt {
  776. position: relative;
  777. display: -webkit-flex;
  778. display: flex;
  779. -webkit-flex-flow: row nowrap;
  780. flex-flow: row nowrap;
  781. -webkit-align-items: center;
  782. align-items: center;
  783. -webkit-justify-content: space-between;
  784. justify-content: space-between;
  785. }
  786. .bx-menu-ver.bx-menu-vertical-more-less li a {
  787. -webkit-flex-grow: 3;
  788. flex-grow: 3;
  789. position: relative;
  790. display: -webkit-flex;
  791. display: flex;
  792. -webkit-flex-flow: row nowrap;
  793. flex-flow: row nowrap;
  794. -webkit-align-items: center;
  795. align-items: center;
  796. -webkit-justify-content: flex-start;
  797. justify-content: flex-start;
  798. line-height: 1.5rem;
  799. }
  800. .bx-menu-ver.bx-menu-vertical-more-less li img,
  801. .bx-menu-ver.bx-menu-vertical-more-less li .sys-icon {
  802. display: inline-block;
  803. vertical-align: top;
  804. width: 1.5rem;
  805. height: 1.5rem;
  806. line-height: 1.5rem;
  807. font-size: 1.0rem;
  808. }
  809. /* --------------- profile followings menu */
  810. .bx-menu-ver.bx-menu-object-sys_profile_followings li {
  811. border-width: 0;
  812. border-radius: 0;
  813. }
  814. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-item-link {
  815. position: relative;
  816. display: -webkit-flex;
  817. display: flex;
  818. -webkit-flex-flow: row nowrap;
  819. flex-flow: row nowrap;
  820. -webkit-align-items: center;
  821. align-items: center;
  822. -webkit-justify-content: space-between;
  823. justify-content: space-between;
  824. }
  825. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-item-link > a {
  826. text-transform: uppercase;
  827. }
  828. .bx-menu-ver.bx-menu-object-sys_profile_followings li a {
  829. -webkit-flex-grow: 3;
  830. flex-grow: 3;
  831. position: relative;
  832. display: -webkit-flex;
  833. display: flex;
  834. -webkit-flex-flow: row nowrap;
  835. flex-flow: row nowrap;
  836. -webkit-align-items: center;
  837. align-items: center;
  838. -webkit-justify-content: flex-start;
  839. justify-content: flex-start;
  840. line-height: 1.5rem;
  841. }
  842. .bx-menu-ver.bx-menu-object-sys_profile_followings li img,
  843. .bx-menu-ver.bx-menu-object-sys_profile_followings li .sys-icon {
  844. display: inline-block;
  845. vertical-align: top;
  846. width: 1.5rem;
  847. height: 1.5rem;
  848. line-height: 1.5rem;
  849. font-size: 1.0rem;
  850. }
  851. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-show {
  852. display: none;
  853. }
  854. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-hide {
  855. display: inline;
  856. }
  857. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-show {
  858. display: inline;
  859. }
  860. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-hide {
  861. display: none;
  862. }
  863. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-item-subitems {
  864. display: none;
  865. }
  866. /* --------------- add relation menu */
  867. .bx-popup .bx-menu-ver.bx-menu-object-sys_add_relation li a {
  868. line-height: normal;
  869. }
  870. .bx-popup .bx-menu-ver.bx-menu-object-sys_add_relation li a span {
  871. margin-left: 0;
  872. text-transform: capitalize;
  873. }
  874. .bx-menu-add-relation-hidden {
  875. display: none;
  876. }
  877. /* --------------- footer menu */
  878. #bx-menu-footer.bx-menu-hor li {
  879. text-align: left;
  880. }
  881. #bx-menu-footer.bx-menu-hor > li {
  882. vertical-align: top;
  883. }
  884. /* --------------- switch language menu (popup) */
  885. .bx-popup .bx-menu-ver.bx-menu-object-sys_switch_language_popup li a div > span {
  886. margin-left: 0;
  887. }
  888. .bx-popup ul.bx-menu-ver.bx-menu-object-sys_switch_language_popup li span.flag-icon {
  889. margin-right: 0.5rem;
  890. }
  891. /* --------------- switch template menu (popup) */
  892. .bx-popup .bx-menu-ver.bx-menu-object-sys_switch_template li a div > span {
  893. margin-left: 0;
  894. }
  895. .bx-menu-meta-item-ex A{
  896. display: flex !important;
  897. }