menu.css 24 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009
  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-sliding-menu-main .bx-menu-account-popup-profile .bx-base-pofile-unit {
  304. margin-bottom:0;
  305. }
  306. .bx-popup-content .bx-menu-floating-blocks-wide,
  307. .bx-popup-content .bx-menu-floating-blocks {
  308. width:256px;
  309. width:16rem;
  310. }
  311. .bx-popup-content .bx-menu-account-popup .bx-menu-floating-blocks-wide,
  312. .bx-popup-content .bx-menu-account-popup .bx-menu-floating-blocks {
  313. width:auto;
  314. }
  315. .bx-menu-account-popup-menu ul.bx-menu-floating-blocks-wide {
  316. display:inline-block;
  317. max-width:800px;
  318. max-width:50rem;
  319. }
  320. ul.bx-menu-floating-blocks-dash{
  321. display: flex;
  322. flex-wrap: wrap;
  323. align-content: space-between;
  324. }
  325. ul.bx-menu-floating-blocks-wide,
  326. ul.bx-menu-floating-blocks-big,
  327. ul.bx-menu-floating-blocks-dash,
  328. ul.bx-menu-floating-blocks {
  329. padding:0;
  330. margin:0;
  331. list-style:none;
  332. }
  333. .bx-menu-floating-blocks-big li,
  334. .bx-menu-floating-blocks-wide li,
  335. .bx-menu-floating-blocks li {
  336. display: inline-block;
  337. /* For IE 7 */
  338. zoom: 1;
  339. *display: inline;
  340. vertical-align:top;
  341. width:80px;
  342. width:5rem;
  343. height:80px;
  344. height:5rem;
  345. }
  346. .bx-menu-floating-blocks-big li {
  347. width:128px;
  348. width:8rem;
  349. height:128px;
  350. height:8rem;
  351. }
  352. .bx-menu-floating-blocks-dash li {
  353. display: block;
  354. width: 24.9%;
  355. height: 3.35rem;
  356. }
  357. .bx-media-desktop .bx-menu-floating-blocks-dash li {
  358. min-width: 14.0rem;
  359. }
  360. .bx-media-phone .bx-menu-floating-blocks-dash li {
  361. width: 49.5%;
  362. }
  363. .bx-menu-floating-blocks-dash-item a {
  364. display:flex !important;
  365. flex-direction: row;
  366. justify-content: flex-start;
  367. align-items: center
  368. }
  369. .bx-menu-floating-blocks-dash-item span a {
  370. display:inline-block !important;
  371. }
  372. .bx-menu-floating-blocks-dash-item .bx-menu-floating-blocks-icon {
  373. position: relative;
  374. display: -webkit-flex;
  375. display: flex;
  376. -webkit-align-items: center;
  377. align-items: center;
  378. -webkit-justify-content: center;
  379. justify-content: center;
  380. width: 2.5rem;
  381. height: 2.5rem;
  382. border-radius: 1.25rem;
  383. background-color: #edf1f7;
  384. }
  385. .bx-menu-floating-blocks-dash-title {
  386. display:flex;
  387. width:calc(100% - 3rem);
  388. height:2.35rem;
  389. flex-direction: column;
  390. justify-content: center;
  391. }
  392. .bx-media-phone .bx-menu-floating-blocks-title {
  393. font-size:0.75rem;
  394. }
  395. .bx-menu-floating-blocks-wide li {
  396. position:relative;
  397. width:100px;
  398. width:6.25rem;
  399. }
  400. .bx-menu-floating-blocks-wide li .bx-menu-item-addon {
  401. right:10px;
  402. right:0.625rem;
  403. bottom:auto;
  404. top:0;
  405. }
  406. .bx-menu-floating-blocks-big li:hover,
  407. .bx-menu-floating-blocks-dash li:hover,
  408. .bx-menu-floating-blocks-wide li:hover,
  409. .bx-menu-floating-blocks li:hover {
  410. opacity:0.8;
  411. }
  412. .bx-menu-floating-blocks-big li:active,
  413. .bx-menu-floating-blocks-big li.bx-menu-tab-active,
  414. .bx-menu-floating-blocks-dash li:active,
  415. .bx-menu-floating-blocks-dash li.bx-menu-tab-active,
  416. .bx-menu-floating-blocks-wide li:active,
  417. .bx-menu-floating-blocks-wide li.bx-menu-tab-active,
  418. .bx-menu-floating-blocks li:active,
  419. .bx-menu-floating-blocks li.bx-menu-tab-active {
  420. opacity:1.0;
  421. }
  422. .bx-menu-floating-blocks-big li a,
  423. .bx-menu-floating-blocks-dash li a,
  424. .bx-menu-floating-blocks-wide li a,
  425. .bx-menu-floating-blocks li a {
  426. display:block;
  427. text-decoration:none;
  428. }
  429. .bx-menu-floating-blocks-big li.bx-menu-tab-active a,
  430. .bx-menu-floating-blocks-dash li.bx-menu-tab-active a,
  431. .bx-menu-floating-blocks-wide li.bx-menu-tab-active a,
  432. .bx-menu-floating-blocks li.bx-menu-tab-active a {
  433. color:#000;
  434. }
  435. .bx-menu-floating-blocks li img,
  436. .bx-menu-floating-blocks-wide li img,
  437. .bx-menu-floating-blocks li .sys-icon,
  438. .bx-menu-floating-blocks-wide li .sys-icon {
  439. display:block;
  440. height:32px;
  441. height:2rem;
  442. margin:16px 0 8px 0;
  443. margin:1rem 0 0.5rem 0;
  444. }
  445. .bx-menu-floating-blocks li img,
  446. .bx-menu-floating-blocks-wide li img {
  447. width:32px;
  448. width:2rem;
  449. margin:16px 20px 3px 20px;
  450. margin:1rem 1.5rem 0.5rem 1.5rem;
  451. background-size:2rem 2rem;
  452. }
  453. .bx-menu-floating-blocks-big li img,
  454. .bx-menu-floating-blocks-big li .sys-icon {
  455. display:block;
  456. height:64px;
  457. height:4rem;
  458. margin:16px 0 8px 0;
  459. margin:1rem 0 0.5rem 0;
  460. }
  461. .bx-menu-floating-blocks-big li img {
  462. width:64px;
  463. width:4rem;
  464. margin:16px 32px 8px 32px;
  465. margin:1rem 2rem 0.5rem 2rem;
  466. background-size:4rem 4rem;
  467. }
  468. .bx-menu-floating-blocks-wide li img {
  469. margin-left:34px;
  470. margin-right:34px;
  471. margin-left:2.125rem;
  472. margin-right:2.125rem;
  473. }
  474. .bx-menu-floating-blocks-big li img,
  475. .bx-menu-floating-blocks-dash li img,
  476. .bx-menu-floating-blocks-wide li img,
  477. .bx-menu-floating-blocks li img {
  478. background-position:center center;
  479. background-repeat:no-repeat;
  480. }
  481. .bx-menu-floating-blocks-big li .sys-icon,
  482. .bx-menu-floating-blocks-dash li .sys-icon,
  483. .bx-menu-floating-blocks-wide li .sys-icon,
  484. .bx-menu-floating-blocks li .sys-icon {
  485. text-align:center;
  486. vertical-align:bottom;
  487. line-height:32px;
  488. line-height:2rem;
  489. font-size:32px;
  490. font-size:2rem;
  491. }
  492. .bx-menu-floating-blocks-big li .sys-icon {
  493. line-height:64px;
  494. line-height:4rem;
  495. font-size:64px;
  496. font-size:4rem;
  497. }
  498. .bx-menu-floating-blocks-dash li .sys-icon {
  499. display: block;
  500. font-size: 1.2rem;
  501. }
  502. .bx-menu-floating-blocks-big li .bx-menu-floating-blocks-title,
  503. .bx-menu-floating-blocks-wide li .bx-menu-floating-blocks-title,
  504. .bx-menu-floating-blocks li .bx-menu-floating-blocks-title {
  505. text-align:center;
  506. overflow:hidden;
  507. text-overflow:ellipsis;
  508. white-space:nowrap;
  509. }
  510. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-title {
  511. text-align:left;
  512. font-weight:bold;
  513. overflow:hidden;
  514. text-overflow:ellipsis;
  515. white-space:nowrap;
  516. }
  517. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-info {
  518. text-align:left;
  519. overflow:hidden;
  520. text-overflow:ellipsis;
  521. white-space:nowrap;
  522. }
  523. .bx-menu-floating-blocks-dash li .bx-menu-floating-blocks-info .divider:first-child {
  524. display: none;
  525. }
  526. /* --------------- interactive block menu */
  527. ul.bx-menu-inter,
  528. ul.bx-menu-inter-vert {
  529. padding:0;
  530. margin:0;
  531. list-style:none;
  532. }
  533. ul.bx-menu-inter li {
  534. float:left;
  535. }
  536. ul.bx-menu-inter li:hover {
  537. background-color: transparent;
  538. }
  539. li.bx-menu-inter-div {
  540. padding: 0px 3px;
  541. }
  542. li.bx-menu-inter-div:first-child {
  543. display: none;
  544. }
  545. li.bx-menu-inter-act .sys-icon {
  546. color: rgba(0, 0, 0, 0.2);
  547. }
  548. li.bx-menu-inter-pas a:hover {
  549. background-color: transparent;
  550. text-decoration: none;
  551. }
  552. li.bx-menu-inter-hidden {
  553. display: none;
  554. }
  555. /* --------------- horizontal buttons menu */
  556. ul.bx-menu-btns-ver,
  557. ul.bx-menu-btns-hor,
  558. ul.bx-menu-btns-icon-hor {
  559. padding:0;
  560. margin:0;
  561. list-style:none;
  562. }
  563. ul.bx-menu-btns-ver,
  564. ul.bx-menu-btns-hor {
  565. text-align:center;
  566. }
  567. ul.bx-menu-btns-hor li,
  568. ul.bx-menu-btns-icon-hor li {
  569. display:inline;
  570. display:inline-block;
  571. vertical-align: bottom;
  572. }
  573. ul.bx-menu-btns-ver li {
  574. text-align:center;
  575. }
  576. ul.bx-menu-btns-ver li .bx-btn {
  577. float:none;
  578. display:inline-block;
  579. }
  580. ul.bx-menu-btns-hor li:last-child .bx-btn,
  581. ul.bx-menu-btns-icon-hor li:last-child .bx-btn {
  582. margin-right:0;
  583. }
  584. /* --------------- account popup menu */
  585. .bx-popup-content .bx-menu-account-popup {
  586. min-width:17em;
  587. }
  588. .bx-menu-account-popup-menu {
  589. text-align:center;
  590. }
  591. .bx-menu-account-popup-profile-switcher-link {
  592. text-align: center;
  593. }
  594. .bx-menu-account-popup-profile-switcher-link a:hover,
  595. .bx-menu-account-popup-profile-switcher-link a {
  596. text-decoration:none;
  597. }
  598. .bx-menu-account-popup-profile-switcher-link .bx-btn {
  599. float: none;
  600. display: inline-block;
  601. width: 100%;
  602. max-width: 20rem;
  603. }
  604. /* --------------- custom menu */
  605. .bx-menu-custom > li > span:not(.bx-menu-meta-item-ex),
  606. .bx-menu-custom > li > a {
  607. display:inline-block;
  608. }
  609. .bx-menu-custom.bx-menu-custom-hor > li > span {
  610. margin-right: 1rem;
  611. }
  612. /*--- Custom Menu with More Auto ---*/
  613. .bx-menu-main-submenu.bx-menu-more-auto,
  614. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto {
  615. position: relative;
  616. display: -webkit-flex;
  617. display: flex;
  618. -webkit-align-items: center;
  619. align-items: center;
  620. -webkit-justify-content: flex-start;
  621. justify-content: flex-start;
  622. }
  623. .bx-menu-main-submenu.bx-menu-more-auto,
  624. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto {
  625. -webkit-flex-wrap: nowrap;
  626. flex-wrap: nowrap;
  627. overflow: hidden;
  628. }
  629. .bx-menu-main-submenu.bx-menu-more-auto {
  630. -webkit-justify-content: center;
  631. justify-content: center;
  632. }
  633. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item,
  634. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item {
  635. position: relative;
  636. display: block;
  637. padding: 0 8px;
  638. padding: 0 0.5rem;
  639. text-align: left;
  640. }
  641. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item .sys-icon {
  642. display: inline-block;
  643. vertical-align: top;
  644. width: 1.6rem;
  645. }
  646. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > a:last-child,
  647. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > a.bx-btn:last-child,
  648. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item > span:last-child,
  649. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > a,
  650. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > a.bx-btn,
  651. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item:last-child > span,
  652. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > a:last-child,
  653. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > a.bx-btn:last-child,
  654. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item > span:last-child,
  655. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > a,
  656. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > a.bx-btn,
  657. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item:last-child > span {
  658. margin-right: 0;
  659. }
  660. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto,
  661. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto {
  662. display: none;
  663. }
  664. .bx-menu-custom-ver .bx-menu-item.bx-menu-item-more-auto {
  665. display: none !important;
  666. }
  667. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto > span,
  668. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto > span {
  669. display: block;
  670. margin: 0;
  671. }
  672. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto .bx-popup .bx-menu-item,
  673. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-item.bx-menu-item-more-auto .bx-popup .bx-menu-item {
  674. padding-top: 0.25rem;
  675. padding-bottom: 0.25rem;
  676. }
  677. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon {
  678. display: inline-block;
  679. vertical-align: middle;
  680. width: 2.0rem;
  681. }
  682. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  683. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  684. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn-height,
  685. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn-height {
  686. height: auto;
  687. line-height: auto;
  688. }
  689. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  690. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn {
  691. position: relative;
  692. display: -webkit-flex;
  693. display: flex;
  694. -webkit-align-items: center;
  695. align-items: center;
  696. margin: 0;
  697. padding: 0;
  698. background-color: transparent;
  699. border-width: 0;
  700. border-radius: 0;
  701. box-shadow: none;
  702. text-shadow: none;
  703. }
  704. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon,
  705. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .sys-icon,
  706. .bx-menu-main-submenu.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn,
  707. .bx-menu-custom.bx-menu-custom-hor.bx-menu-more-auto .bx-menu-submenu-more-auto .bx-menu-item .bx-btn {
  708. color: #3e8685;
  709. }
  710. .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) {
  711. display: none;
  712. }
  713. .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) {
  714. display: inline;
  715. }
  716. .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 {
  717. margin-left: 0px;
  718. }
  719. /*--- Vertical (Vertical Custom) Menus (in Popup) ---*/
  720. .bx-popup .bx-menu-custom-ver li > span {
  721. display: -webkit-flex;
  722. display: flex;
  723. -webkit-align-items: center;
  724. align-items: center;
  725. -webkit-justify-content: space-between;
  726. justify-content: space-between;
  727. }
  728. .bx-popup .bx-menu-custom-ver li a {
  729. position: relative;
  730. display: -webkit-flex;
  731. display: flex;
  732. -webkit-flex-flow: row nowrap;
  733. flex-flow: row nowrap;
  734. -webkit-align-items: center;
  735. align-items: center;
  736. -webkit-justify-content: flex-start;
  737. justify-content: flex-start;
  738. box-sizing: border-box;
  739. width: 100%;
  740. }
  741. .bx-popup .bx-menu-ver li img,
  742. .bx-popup .bx-menu-ver li .sys-icon,
  743. .bx-popup .bx-menu-custom-ver li img,
  744. .bx-popup .bx-menu-custom-ver li .sys-icon {
  745. display: inline-block;
  746. vertical-align: middle;
  747. width: 1.5rem;
  748. height: 1.5rem;
  749. line-height: 1.5rem;
  750. font-size: 1.5rem;
  751. }
  752. .bx-popup .bx-menu-ver li .sys-icon:before,
  753. .bx-popup .bx-menu-custom-ver li .sys-icon:before {
  754. display: block;
  755. text-align: center;
  756. }
  757. /* --------------- profile stats menu */
  758. .bx-menu-ver.bx-menu-vertical-more-less li {
  759. border-width: 0;
  760. border-radius: 0;
  761. }
  762. .bx-menu-ver.bx-menu-vertical-more-less li .bx-menu-item-cnt {
  763. position: relative;
  764. display: -webkit-flex;
  765. display: flex;
  766. -webkit-flex-flow: row nowrap;
  767. flex-flow: row nowrap;
  768. -webkit-align-items: center;
  769. align-items: center;
  770. -webkit-justify-content: space-between;
  771. justify-content: space-between;
  772. }
  773. .bx-menu-ver.bx-menu-vertical-more-less li a {
  774. -webkit-flex-grow: 3;
  775. flex-grow: 3;
  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: flex-start;
  784. justify-content: flex-start;
  785. line-height: 1.5rem;
  786. }
  787. .bx-menu-ver.bx-menu-vertical-more-less li img,
  788. .bx-menu-ver.bx-menu-vertical-more-less li .sys-icon {
  789. display: inline-block;
  790. vertical-align: top;
  791. width: 1.5rem;
  792. height: 1.5rem;
  793. line-height: 1.5rem;
  794. font-size: 1.0rem;
  795. }
  796. /* --------------- profile followings menu */
  797. .bx-menu-ver.bx-menu-object-sys_profile_followings li {
  798. border-width: 0;
  799. border-radius: 0;
  800. }
  801. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-item-link {
  802. position: relative;
  803. display: -webkit-flex;
  804. display: flex;
  805. -webkit-flex-flow: row nowrap;
  806. flex-flow: row nowrap;
  807. -webkit-align-items: center;
  808. align-items: center;
  809. -webkit-justify-content: space-between;
  810. justify-content: space-between;
  811. }
  812. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-item-link > a {
  813. text-transform: uppercase;
  814. }
  815. .bx-menu-ver.bx-menu-object-sys_profile_followings li a {
  816. -webkit-flex-grow: 3;
  817. flex-grow: 3;
  818. position: relative;
  819. display: -webkit-flex;
  820. display: flex;
  821. -webkit-flex-flow: row nowrap;
  822. flex-flow: row nowrap;
  823. -webkit-align-items: center;
  824. align-items: center;
  825. -webkit-justify-content: flex-start;
  826. justify-content: flex-start;
  827. line-height: 1.5rem;
  828. }
  829. .bx-menu-ver.bx-menu-object-sys_profile_followings li img,
  830. .bx-menu-ver.bx-menu-object-sys_profile_followings li .sys-icon {
  831. display: inline-block;
  832. vertical-align: top;
  833. width: 1.5rem;
  834. height: 1.5rem;
  835. line-height: 1.5rem;
  836. font-size: 1.0rem;
  837. }
  838. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-show {
  839. display: none;
  840. }
  841. .bx-menu-ver.bx-menu-object-sys_profile_followings li .bx-menu-hide {
  842. display: inline;
  843. }
  844. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-show {
  845. display: inline;
  846. }
  847. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-hide {
  848. display: none;
  849. }
  850. .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-mi-collapsed .bx-menu-item-subitems {
  851. display: none;
  852. }
  853. /* --------------- add relation menu */
  854. .bx-popup .bx-menu-ver.bx-menu-object-sys_add_relation li a {
  855. line-height: normal;
  856. }
  857. .bx-popup .bx-menu-ver.bx-menu-object-sys_add_relation li a span {
  858. margin-left: 0;
  859. text-transform: capitalize;
  860. }
  861. .bx-menu-add-relation-hidden {
  862. display: none;
  863. }
  864. /* --------------- footer menu */
  865. #bx-menu-footer.bx-menu-hor li {
  866. text-align: left;
  867. }
  868. #bx-menu-footer.bx-menu-hor > li {
  869. vertical-align: top;
  870. }
  871. /* --------------- switch language menu (popup) */
  872. .bx-popup .bx-menu-ver.bx-menu-object-sys_switch_language_popup li a div > span {
  873. margin-left: 0;
  874. }
  875. .bx-popup ul.bx-menu-ver.bx-menu-object-sys_switch_language_popup li span.flag-icon {
  876. margin-right: 0.5rem;
  877. }
  878. /* --------------- switch template menu (popup) */
  879. .bx-popup .bx-menu-ver.bx-menu-object-sys_switch_template li a div > span {
  880. margin-left: 0;
  881. }
  882. .bx-menu-meta-item-ex A{
  883. display: flex !important;
  884. }