IamSnasty

Untitled

Jul 9th, 2017
168
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 342.82 KB | None | 0 0
  1. html, body, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, address, big, cite, code, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, canvas, embed, figure, figcaption, audio, video {
  2. border: 0 none;
  3. margin: 0;
  4. padding: 0;
  5. }
  6. img {
  7. border: 0 none;
  8. }
  9. h1, h2, h3, h4, h5, h6 {
  10. font-size: 100%;
  11. font-weight: normal;
  12. }
  13. ol, ul {
  14. list-style: outside none none;
  15. }
  16. blockquote, q {
  17. quotes: none;
  18. }
  19. blockquote::before, blockquote::after, q::before, q::after {
  20. content: none;
  21. }
  22. address {
  23. font-style: normal;
  24. }
  25. html {
  26. box-sizing: border-box;
  27. }
  28. *, *::before, *::after {
  29. box-sizing: inherit;
  30. min-width: 0;
  31. }
  32. html {
  33. }
  34. .clearfix::before, .clearfix::after {
  35. content: "";
  36. display: table;
  37. }
  38. .clearfix::after {
  39. clear: both;
  40. }
  41. .redactor-layer pre {
  42. background-color: #fff !important;
  43. border-radius: 2px;
  44. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  45. color: #444 !important;
  46. font-family: Consolas,"Courier New",monospace;
  47. margin: 1em 0;
  48. overflow-wrap: break-word;
  49. padding: 10px 20px;
  50. position: relative;
  51. white-space: pre-wrap;
  52. word-break: break-all;
  53. }
  54. .redactor-layer pre:not(.redactorCalcHeight)::before {
  55. color: rgba(230, 81, 0, 1);
  56. content: attr(data-title);
  57. cursor: pointer;
  58. display: block;
  59. font-family: "Roboto",Arial,Helvetica,sans-serif;
  60. font-weight: 400;
  61. line-height: 1.28;
  62. margin-bottom: 20px;
  63. }
  64. @media (min-width: 769px) {
  65. .redactor-layer pre:not(.redactorCalcHeight)::before {
  66. font-size: 18px;
  67. }
  68. }
  69. @media (max-width: 768px) {
  70. .redactor-layer pre:not(.redactorCalcHeight)::before {
  71. font-size: 18px;
  72. }
  73. }
  74. .codeBox {
  75. background-color: rgba(250, 250, 250, 1);
  76. border-radius: 2px;
  77. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  78. clear: both;
  79. margin: 1em 0;
  80. overflow: hidden;
  81. padding: 10px;
  82. position: relative;
  83. }
  84. .codeBox.collapsed {
  85. max-height: 200px;
  86. }
  87. .codeBox.collapsed > .toggleButton {
  88. bottom: 0;
  89. box-shadow: 0 -10px 50px 10px #fafafa;
  90. left: 0;
  91. padding-bottom: 10px;
  92. position: absolute;
  93. right: 0;
  94. z-index: 1;
  95. }
  96. .codeBox > div > .codeBoxHeader {
  97. align-items: center;
  98. display: flex;
  99. }
  100. .codeBox > div > .codeBoxHeader > .codeBoxHeadline {
  101. flex: 1 1 auto;
  102. font-weight: 400;
  103. line-height: 1.28;
  104. padding: 0 10px;
  105. }
  106. @media (min-width: 769px) {
  107. .codeBox > div > .codeBoxHeader > .codeBoxHeadline {
  108. font-size: 18px;
  109. }
  110. }
  111. @media (max-width: 768px) {
  112. .codeBox > div > .codeBoxHeader > .codeBoxHeadline {
  113. font-size: 18px;
  114. }
  115. }
  116. .codeBox > div > .codeBoxHeader > .codeBoxPlainSource {
  117. flex: 0 0 auto;
  118. margin-left: 10px;
  119. }
  120. .codeBox > div > ol {
  121. margin: 20px 0 0 3.4em !important;
  122. position: relative;
  123. }
  124. .codeBox > div > ol::before {
  125. border-right: 1px solid rgba(224, 224, 224, 1);
  126. bottom: 0;
  127. content: "";
  128. left: -5px;
  129. position: absolute;
  130. top: 0;
  131. }
  132. .codeBox > div > ol > li {
  133. font-family: Consolas,"Courier New",monospace;
  134. overflow-wrap: break-word;
  135. padding-left: 5px;
  136. position: relative;
  137. white-space: pre-wrap;
  138. word-break: break-all;
  139. z-index: 1;
  140. }
  141. .codeBox > div > ol > li .lineAnchor {
  142. bottom: 0;
  143. left: -3.4em;
  144. position: absolute;
  145. top: 0;
  146. width: 3.4em;
  147. }
  148. .codeBox .codeBoxJumpAnchor:target {
  149. height: 100%;
  150. pointer-events: none;
  151. position: absolute;
  152. width: 100%;
  153. z-index: -1;
  154. }
  155. .codeBox .codeBoxJumpAnchor:target::after {
  156. background-color: rgba(255, 255, 102, 1);
  157. bottom: 0;
  158. content: "";
  159. display: block;
  160. height: 100%;
  161. left: 0;
  162. position: absolute;
  163. right: 0;
  164. top: 0;
  165. }
  166. @media (max-width: 1024px) {
  167. .codeBox .codeBoxJumpAnchor:target {
  168. top: -52px;
  169. }
  170. .codeBox .codeBoxJumpAnchor:target::after {
  171. top: 52px;
  172. }
  173. }
  174. @media (min-width: 1025px) {
  175. .codeBox .codeBoxJumpAnchor:target {
  176. top: -50px;
  177. }
  178. .codeBox .codeBoxJumpAnchor:target::after {
  179. top: 50px;
  180. }
  181. }
  182. .codeBox > .toggleButton {
  183. background-color: #fafafa;
  184. cursor: pointer;
  185. display: block;
  186. font-weight: 400;
  187. padding: 10px 20px 0 10px;
  188. text-align: center;
  189. }
  190. @media (min-width: 769px) {
  191. .codeBox > .toggleButton {
  192. font-size: 12px;
  193. }
  194. }
  195. @media (max-width: 768px) {
  196. .codeBox > .toggleButton {
  197. font-size: 12px;
  198. }
  199. }
  200. .codeBox .hlQuotes {
  201. color: red;
  202. }
  203. .codeBox .hlComments, .codeBox .hlOperators {
  204. color: green;
  205. }
  206. .codeBox .hlKeywords1 {
  207. color: blue;
  208. }
  209. .codeBox .hlKeywords2 {
  210. color: darkred;
  211. }
  212. .codeBox .hlKeywords3 {
  213. color: darkviolet;
  214. }
  215. .codeBox .hlKeywords4 {
  216. color: darkgoldenrod;
  217. }
  218. .codeBox .hlKeywords5 {
  219. color: crimson;
  220. }
  221. .codeBox .hlNumbers {
  222. color: darkorange;
  223. }
  224. .diffHighlighter .hlComments {
  225. color: darkviolet;
  226. }
  227. .diffHighlighter .hlRemoved {
  228. color: red;
  229. }
  230. .diffHighlighter .hlAdded {
  231. color: green;
  232. }
  233. .phpHighlighter .hlKeywords2 {
  234. color: green;
  235. }
  236. .phpHighlighter .hlComments {
  237. color: darkgoldenrod;
  238. }
  239. .cssHighlighter .hlComments {
  240. color: #236e26;
  241. }
  242. .cssHighlighter .hlColors {
  243. color: #751116;
  244. }
  245. .cssHighlighter .hlNumbers, .sqlHighlighter .hlNumbers {
  246. color: #1906fd;
  247. }
  248. .cssHighlighter .hlKeywords1 {
  249. color: #87154f;
  250. }
  251. .cssHighlighter .hlKeywords2 {
  252. color: #994509;
  253. }
  254. .cssHighlighter .hlKeywords3, .cssHighlighter .hlKeywords4 {
  255. color: inherit;
  256. }
  257. .sqlHighlighter .hlKeywords1 {
  258. color: #663821;
  259. }
  260. .sqlHighlighter .hlKeywords2 {
  261. color: #871550;
  262. }
  263. .inlineCode, kbd {
  264. background-color: rgba(255, 255, 255, 1) !important;
  265. border: 1px solid rgba(196, 196, 196, 1) !important;
  266. border-radius: 2px;
  267. color: rgba(68, 68, 68, 1) !important;
  268. display: inline;
  269. font-family: Consolas,"Courier New",monospace;
  270. font-style: normal;
  271. font-weight: normal;
  272. margin: 1px 2px;
  273. overflow: auto;
  274. overflow-wrap: break-word;
  275. padding: 0 4px;
  276. text-decoration: none;
  277. vertical-align: middle;
  278. word-break: break-all;
  279. }
  280. .mediaBBCode {
  281. display: inline-block;
  282. max-width: 100%;
  283. }
  284. .mediaBBCode .mediaBBCodeCaption {
  285. color: rgba(125, 130, 135, 1);
  286. display: block;
  287. font-weight: 400;
  288. margin-top: 5px;
  289. text-align: center;
  290. }
  291. @media (min-width: 769px) {
  292. .mediaBBCode .mediaBBCodeCaption {
  293. font-size: 12px;
  294. }
  295. }
  296. @media (max-width: 768px) {
  297. .mediaBBCode .mediaBBCodeCaption {
  298. font-size: 12px;
  299. }
  300. }
  301. woltlab-quote, .quoteBox {
  302. background-color: rgba(250, 250, 250, 1);
  303. border-radius: 2px;
  304. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  305. display: block;
  306. font-style: italic;
  307. margin: 1em 0;
  308. }
  309. woltlab-quote:first-child, .quoteBox:first-child {
  310. margin-top: 0;
  311. }
  312. woltlab-quote .quoteBox, .quoteBox .quoteBox {
  313. clear: both;
  314. }
  315. woltlab-quote .quoteBox .quoteBoxIcon, .quoteBox .quoteBox .quoteBoxIcon {
  316. display: none;
  317. }
  318. @media (min-width: 769px) {
  319. woltlab-quote, .quoteBox {
  320. padding: 20px;
  321. }
  322. }
  323. @media (max-width: 768px) {
  324. woltlab-quote, .quoteBox {
  325. padding: 10px;
  326. }
  327. }
  328. .quoteBox {
  329. clear: both;
  330. overflow: hidden;
  331. }
  332. @media (min-width: 769px) {
  333. .quoteBox {
  334. min-height: 104px;
  335. }
  336. }
  337. .quoteBox.collapsed {
  338. position: relative;
  339. }
  340. .quoteBox.collapsed > .quoteBoxContent {
  341. max-height: 100px;
  342. overflow: hidden;
  343. }
  344. .quoteBox.collapsed > .toggleButton {
  345. bottom: 0;
  346. box-shadow: 0 -10px 50px 10px #fafafa;
  347. left: 0;
  348. padding-bottom: 10px;
  349. position: absolute;
  350. right: 0;
  351. z-index: 1;
  352. }
  353. .quoteBox > .toggleButton {
  354. background-color: #fafafa;
  355. cursor: pointer;
  356. display: block;
  357. font-weight: 400;
  358. padding: 10px 20px 0 10px;
  359. text-align: center;
  360. }
  361. @media (min-width: 769px) {
  362. .quoteBox > .toggleButton {
  363. font-size: 12px;
  364. }
  365. }
  366. @media (max-width: 768px) {
  367. .quoteBox > .toggleButton {
  368. font-size: 12px;
  369. }
  370. }
  371. .quoteBox .quoteBox {
  372. min-height: 0;
  373. }
  374. woltlab-quote:not(.redactorCalcHeight)::before {
  375. color: rgba(230, 81, 0, 1);
  376. content: attr(data-title);
  377. cursor: pointer;
  378. display: block;
  379. font-style: normal;
  380. font-weight: 400;
  381. line-height: 1.28;
  382. margin-bottom: 20px;
  383. }
  384. @media (min-width: 769px) {
  385. woltlab-quote:not(.redactorCalcHeight)::before {
  386. font-size: 18px;
  387. }
  388. }
  389. @media (max-width: 768px) {
  390. woltlab-quote:not(.redactorCalcHeight)::before {
  391. font-size: 18px;
  392. }
  393. }
  394. .quoteBoxTitle {
  395. font-style: normal;
  396. font-weight: 400;
  397. line-height: 1.28;
  398. margin-bottom: 20px;
  399. }
  400. @media (min-width: 769px) {
  401. .quoteBoxTitle {
  402. font-size: 18px;
  403. }
  404. }
  405. @media (max-width: 768px) {
  406. .quoteBoxTitle {
  407. font-size: 18px;
  408. }
  409. }
  410. .quoteBoxIcon {
  411. float: right;
  412. margin: 0 0 10px 10px;
  413. }
  414. .quoteBoxIcon > a {
  415. display: block;
  416. font-size: 0;
  417. }
  418. .quoteBoxIcon > .quoteBoxQuoteSymbol {
  419. color: rgba(125, 130, 135, 1);
  420. display: block;
  421. font-family: Georgia,"Times New Roman",serif;
  422. font-style: normal;
  423. text-align: center;
  424. }
  425. @media (min-width: 769px) {
  426. .quoteBoxIcon > .quoteBoxQuoteSymbol {
  427. font-size: 160px;
  428. height: 64px;
  429. line-height: 160px;
  430. width: 64px;
  431. }
  432. }
  433. @media (max-width: 768px) {
  434. .quoteBoxIcon > .quoteBoxQuoteSymbol {
  435. font-size: 80px;
  436. height: 32px;
  437. line-height: 80px;
  438. width: 32px;
  439. }
  440. }
  441. .quoteBoxIcon > .quoteBoxQuoteSymbol::before {
  442. content: "“";
  443. position: relative;
  444. }
  445. @media (min-width: 769px) {
  446. .quoteBoxIcon > .quoteBoxQuoteSymbol::before {
  447. top: -5px;
  448. }
  449. }
  450. @media (max-width: 768px) {
  451. .quoteBoxIcon .userAvatarImage {
  452. height: 32px !important;
  453. width: 32px !important;
  454. }
  455. }
  456. .redactor-layer woltlab-spoiler {
  457. background-color: rgba(250, 250, 250, 1);
  458. border-radius: 2px;
  459. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  460. display: block;
  461. margin: 1em 0;
  462. padding: 10px 20px;
  463. position: relative;
  464. }
  465. .redactor-layer woltlab-spoiler:not(.redactorCalcHeight)::before {
  466. color: rgba(230, 81, 0, 1);
  467. content: attr(data-title);
  468. cursor: pointer;
  469. display: block;
  470. font-weight: 400;
  471. line-height: 1.28;
  472. margin-bottom: 20px;
  473. }
  474. @media (min-width: 769px) {
  475. .redactor-layer woltlab-spoiler:not(.redactorCalcHeight)::before {
  476. font-size: 18px;
  477. }
  478. }
  479. @media (max-width: 768px) {
  480. .redactor-layer woltlab-spoiler:not(.redactorCalcHeight)::before {
  481. font-size: 18px;
  482. }
  483. }
  484. .spoilerBox {
  485. clear: both;
  486. margin: 1em 0;
  487. }
  488. .spoilerBox > .spoilerBoxContent {
  489. background-color: rgba(250, 250, 250, 1);
  490. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  491. margin-top: 10px;
  492. padding: 10px 20px;
  493. }
  494. .spoilerBox > .spoilerBoxContent > p:first-child {
  495. margin-top: 0;
  496. }
  497. .spoilerBox > .spoilerBoxContent > p:last-child {
  498. margin-bottom: 0;
  499. }
  500. .userMention {
  501. background-color: rgba(236, 241, 247, 1);
  502. border-radius: 2px;
  503. padding: 1px 5px;
  504. }
  505. .userMention::before {
  506. content: "@";
  507. }
  508. .videoContainer {
  509. overflow: hidden;
  510. padding-bottom: 56.25%;
  511. position: relative;
  512. }
  513. .videoContainer iframe {
  514. height: 100%;
  515. position: absolute;
  516. width: 100%;
  517. }
  518. dl:not(.plain) {
  519. display: block;
  520. }
  521. dl:not(.plain):not(:first-child) {
  522. margin-top: 20px;
  523. }
  524. dl:not(.plain) > dt {
  525. color: rgba(59, 109, 169, 1);
  526. display: block;
  527. }
  528. dl:not(.plain) > dt:not(:empty) {
  529. margin-bottom: 5px;
  530. }
  531. dl:not(.plain) > dd {
  532. display: block;
  533. }
  534. dl:not(.plain) > dd:not(:last-child) {
  535. margin-bottom: 20px;
  536. }
  537. dl:not(.plain) > dd > small:not(.innerError) {
  538. color: rgba(125, 130, 135, 1);
  539. display: block;
  540. margin-top: 3px;
  541. }
  542. dl:not(.plain) > dd > label {
  543. display: block;
  544. }
  545. dl:not(.plain) > dd > label + small:not(.innerError) {
  546. margin-left: 24px;
  547. }
  548. dl:not(.plain) > dd > label:not(:first-child) {
  549. margin-top: 5px;
  550. }
  551. dl:not(.plain) > dd.floated {
  552. display: flex;
  553. flex-wrap: wrap;
  554. }
  555. dl:not(.plain) > dd.floated > label {
  556. flex: 0 0 auto;
  557. margin: 0 10px 5px 0;
  558. }
  559. dl:not(.plain) > dd.floated > label:last-child {
  560. margin-right: 0;
  561. }
  562. dl:not(.plain) > dd.floated > label + small:not(.innerError) {
  563. margin-left: 0;
  564. }
  565. dl:not(.plain) > dd.floated small {
  566. flex: 1 1 100%;
  567. }
  568. dl.wide:not(.plain) > dt {
  569. display: none;
  570. }
  571. dl.dataList {
  572. overflow: hidden;
  573. }
  574. dl.dataList::before, dl.dataList::after {
  575. content: "";
  576. display: table;
  577. }
  578. dl.dataList::after {
  579. clear: both;
  580. }
  581. dl.dataList > dt {
  582. clear: right;
  583. color: rgba(125, 130, 135, 1);
  584. float: left;
  585. margin-right: 4px;
  586. text-align: left;
  587. }
  588. dl.dataList > dt::after {
  589. content: ":";
  590. }
  591. dl.dataList > dd {
  592. float: right;
  593. min-height: 20px;
  594. text-align: right;
  595. }
  596. dl.dataList > dd:not(:last-child) {
  597. margin-bottom: 3px;
  598. }
  599. dl.inlineDataList > dt {
  600. display: inline-block;
  601. vertical-align: middle;
  602. }
  603. dl.inlineDataList > dt::after {
  604. content: ":";
  605. padding-left: 1px;
  606. }
  607. dl.inlineDataList > dd {
  608. display: inline-block;
  609. vertical-align: middle;
  610. }
  611. dl.inlineDataList > dd:not(:last-of-type)::after {
  612. content: ",";
  613. padding-left: 1px;
  614. }
  615. dl.statsDataList {
  616. align-items: center;
  617. display: flex;
  618. flex-flow: row-reverse wrap;
  619. }
  620. dl.statsDataList > dt {
  621. color: rgba(125, 130, 135, 1);
  622. flex: 0 0 60%;
  623. font-weight: 400;
  624. margin-left: 5px;
  625. overflow: hidden;
  626. text-align: left;
  627. white-space: nowrap;
  628. }
  629. @media (min-width: 769px) {
  630. dl.statsDataList > dt {
  631. font-size: 12px;
  632. }
  633. }
  634. @media (max-width: 768px) {
  635. dl.statsDataList > dt {
  636. font-size: 12px;
  637. }
  638. }
  639. dl.statsDataList > dd {
  640. flex: 0 0 auto;
  641. overflow: hidden;
  642. text-align: right;
  643. text-overflow: ellipsis;
  644. white-space: nowrap;
  645. width: calc(40% - 5px);
  646. }
  647. .row.rowColGap > dl {
  648. margin-top: 0;
  649. }
  650. .inlineList {
  651. display: flex;
  652. flex-wrap: wrap;
  653. }
  654. .inlineList > li {
  655. flex: 0 1 auto;
  656. }
  657. .inlineList > li:not(:last-child) {
  658. margin-right: 5px;
  659. }
  660. .inlineList.commaSeparated > li:not(:last-child)::after {
  661. content: ",";
  662. padding-left: 1px;
  663. }
  664. .inlineList.dotSeparated > li:not(:last-child)::after {
  665. content: "·";
  666. margin-left: 5px;
  667. }
  668. .nativeList {
  669. margin: 1em 0 1em 40px;
  670. }
  671. .nativeList li {
  672. margin: 7px 0;
  673. }
  674. ul.nativeList {
  675. list-style-type: disc;
  676. }
  677. ol.nativeList {
  678. list-style-type: decimal;
  679. }
  680. .tagList {
  681. align-items: baseline;
  682. display: flex;
  683. flex-wrap: wrap;
  684. margin-bottom: -4px;
  685. margin-right: -8px;
  686. }
  687. .tagList > li {
  688. flex: 0 1 auto;
  689. }
  690. .tagList > li:not(:last-child) {
  691. margin-right: 5px;
  692. }
  693. .tagList.commaSeparated > li:not(:last-child)::after {
  694. content: ",";
  695. padding-left: 1px;
  696. }
  697. .tagList.dotSeparated > li:not(:last-child)::after {
  698. content: "·";
  699. margin-left: 5px;
  700. }
  701. .tagList > li {
  702. margin-bottom: 4px;
  703. margin-right: 8px;
  704. }
  705. .tagList .tag {
  706. background-color: rgba(207, 216, 220, 1);
  707. color: rgba(33, 33, 33, 1);
  708. display: inline-block;
  709. font-weight: 600;
  710. margin-left: 11px;
  711. padding: 3px 6px 2px 2px;
  712. position: relative;
  713. text-decoration: none;
  714. text-transform: uppercase;
  715. }
  716. @media (min-width: 769px) {
  717. .tagList .tag {
  718. font-size: 12px;
  719. }
  720. }
  721. @media (max-width: 768px) {
  722. .tagList .tag {
  723. font-size: 12px;
  724. }
  725. }
  726. .tagList .tag::before {
  727. -moz-border-bottom-colors: none;
  728. -moz-border-left-colors: none;
  729. -moz-border-right-colors: none;
  730. -moz-border-top-colors: none;
  731. border-color: transparent rgba(207, 216, 220, 1) transparent transparent;
  732. border-image: none;
  733. border-style: solid;
  734. border-width: 11px 11px 11px 0;
  735. content: "";
  736. display: block;
  737. left: -11px;
  738. position: absolute;
  739. top: 0;
  740. }
  741. .tagList .tag:hover {
  742. background-color: rgba(26, 119, 201, 1);
  743. color: rgba(255, 255, 255, 1);
  744. text-decoration: none;
  745. }
  746. .tagList .tag:hover::before {
  747. border-right-color: rgba(26, 119, 201, 1);
  748. }
  749. .tagList .tagWeight1 {
  750. font-size: 12px;
  751. }
  752. .tagList .tagWeight2 {
  753. font-size: 14px;
  754. }
  755. .tagList .tagWeight3 {
  756. font-size: 16px;
  757. }
  758. .tagList .tagWeight4 {
  759. font-size: 18px;
  760. }
  761. .tagList .tagWeight5 {
  762. font-size: 20px;
  763. }
  764. .tagList .tagWeight6 {
  765. font-size: 23px;
  766. }
  767. .tagList .tagWeight7 {
  768. font-size: 28px;
  769. }
  770. .smileyList {
  771. align-items: center;
  772. }
  773. @media (min-width: 1025px) {
  774. .smileyList {
  775. margin-bottom: -5px;
  776. }
  777. .smileyList > li {
  778. margin-bottom: 5px;
  779. }
  780. }
  781. ol.dataList, ul.dataList {
  782. display: flex;
  783. flex-wrap: wrap;
  784. font-weight: 400;
  785. }
  786. ol.dataList > li, ul.dataList > li {
  787. flex: 0 1 auto;
  788. }
  789. ol.dataList > li:not(:last-child), ul.dataList > li:not(:last-child) {
  790. margin-right: 5px;
  791. }
  792. ol.dataList.commaSeparated > li:not(:last-child)::after, ul.dataList.commaSeparated > li:not(:last-child)::after {
  793. content: ",";
  794. padding-left: 1px;
  795. }
  796. ol.dataList.dotSeparated > li:not(:last-child)::after, ul.dataList.dotSeparated > li:not(:last-child)::after {
  797. content: "·";
  798. margin-left: 5px;
  799. }
  800. @media (min-width: 769px) {
  801. ol.dataList, ul.dataList {
  802. font-size: 12px;
  803. }
  804. }
  805. @media (max-width: 768px) {
  806. ol.dataList, ul.dataList {
  807. font-size: 12px;
  808. }
  809. }
  810. ol.dataList > li:not(:last-child)::after, ul.dataList > li:not(:last-child)::after {
  811. content: ",";
  812. padding-left: 1px;
  813. }
  814. @font-face {
  815. font-family: "FontAwesome";
  816. font-style: normal;
  817. font-weight: normal;
  818. src: url("../font/getFont.php?type=eot&v=4.7.0#iefix") format("embedded-opentype"), url("../font/getFont.php?type=woff2&v=4.7.0") format("woff2"), url("../font/getFont.php?type=woff&v=4.7.0") format("woff"), url("../font/getFont.php?type=ttf&v=4.7.0") format("truetype");
  819. }
  820. .icon, .fa {
  821. -moz-user-select: none;
  822. color: rgba(44, 62, 80, 1);
  823. display: inline-block;
  824. font-family: FontAwesome;
  825. font-style: normal !important;
  826. font-weight: normal !important;
  827. text-align: center;
  828. }
  829. .icon.disabled, .fa.disabled {
  830. opacity: 0.3;
  831. }
  832. .icon:hover, .fa:hover {
  833. text-decoration: none;
  834. }
  835. .icon.green, .fa.green {
  836. color: rgba(0, 153, 0, 1);
  837. }
  838. .icon.red, .fa.red {
  839. color: rgba(204, 0, 0, 1);
  840. }
  841. .icon.black, .fa.black {
  842. color: #333;
  843. }
  844. .icon.brown, .fa.brown {
  845. color: #c63;
  846. }
  847. .icon.orange, .fa.orange {
  848. color: #f90;
  849. }
  850. .icon.yellow, .fa.yellow {
  851. color: #ff0;
  852. }
  853. .icon.blue, .fa.blue {
  854. color: #369;
  855. }
  856. .icon.purple, .fa.purple {
  857. color: #c0f;
  858. }
  859. .icon.pink, .fa.pink {
  860. color: #f0c;
  861. }
  862. span.icon:not(.pointer):not(.disabled), span.fa:not(.pointer):not(.disabled) {
  863. cursor: default;
  864. }
  865. a > span.icon:not(.pointer), a > span.fa:not(.pointer) {
  866. cursor: pointer !important;
  867. }
  868. .icon16 {
  869. font-size: 14px;
  870. height: 16px;
  871. line-height: 16px;
  872. width: 16px;
  873. }
  874. .icon24 {
  875. font-size: 18px;
  876. height: 24px;
  877. line-height: 24px;
  878. width: 24px;
  879. }
  880. .icon32 {
  881. font-size: 28px;
  882. height: 32px;
  883. line-height: 32px;
  884. vertical-align: -5px;
  885. width: 32px;
  886. }
  887. .icon48, .wcfImageViewer > div.loading::before, .wcfImageViewer > footer > div > ul > li.loading::before {
  888. font-size: 42px;
  889. height: 48px;
  890. line-height: 48px;
  891. width: 48px;
  892. }
  893. .icon64 {
  894. font-size: 56px;
  895. height: 64px;
  896. line-height: 64px;
  897. width: 64px;
  898. }
  899. .icon96 {
  900. font-size: 84px;
  901. height: 96px;
  902. line-height: 96px;
  903. width: 96px;
  904. }
  905. .icon144 {
  906. font-size: 130px;
  907. height: 144px;
  908. line-height: 144px;
  909. width: 144px;
  910. }
  911. .fa-spinner, .wcfImageViewer > div.loading::before, .wcfImageViewer > footer > div > ul > li.loading::before {
  912. -moz-border-bottom-colors: none;
  913. -moz-border-left-colors: none;
  914. -moz-border-right-colors: none;
  915. -moz-border-top-colors: none;
  916. animation: 0.6s linear 0s normal none infinite running wcfSpinner;
  917. border-color: #4f81bd #ccc #ccc;
  918. border-image: none;
  919. border-radius: 50%;
  920. border-style: solid;
  921. border-width: 2px;
  922. vertical-align: middle;
  923. }
  924. .fa-spinner.fa-spinner::before {
  925. display: none;
  926. }
  927. @keyframes wcfSpinner {
  928. 100% {
  929. transform: rotate(360deg);
  930. }
  931. }
  932. @keyframes wcfSpinner {
  933. 100% {
  934. transform: rotate(360deg);
  935. }
  936. }
  937. @keyframes spin {
  938. 0% {
  939. transform: rotate(0deg);
  940. }
  941. 100% {
  942. transform: rotate(359deg);
  943. }
  944. }
  945. @keyframes spin {
  946. 0% {
  947. transform: rotate(0deg);
  948. }
  949. 100% {
  950. transform: rotate(359deg);
  951. }
  952. }
  953. .fa-rotate-90::before {
  954. transform: rotate(90deg);
  955. }
  956. .fa-rotate-180::before {
  957. transform: rotate(180deg);
  958. }
  959. .fa-rotate-270::before {
  960. transform: rotate(270deg);
  961. }
  962. .fa-flip-horizontal::before {
  963. transform: scale(-1, 1);
  964. }
  965. .fa-flip-vertical::before {
  966. transform: scale(1, -1);
  967. }
  968. @keyframes fa-bell-ring {
  969. 0% {
  970. transform: rotate(-15deg);
  971. }
  972. 2% {
  973. transform: rotate(15deg);
  974. }
  975. 4% {
  976. transform: rotate(-18deg);
  977. }
  978. 6% {
  979. transform: rotate(18deg);
  980. }
  981. 8% {
  982. transform: rotate(-22deg);
  983. }
  984. 10% {
  985. transform: rotate(22deg);
  986. }
  987. 12% {
  988. transform: rotate(-18deg);
  989. }
  990. 14% {
  991. transform: rotate(18deg);
  992. }
  993. 16% {
  994. transform: rotate(-12deg);
  995. }
  996. 18% {
  997. transform: rotate(12deg);
  998. }
  999. 20%, 100% {
  1000. transform: rotate(0deg);
  1001. }
  1002. }
  1003. .fa-glass::before {
  1004. content: "";
  1005. }
  1006. .fa-music::before {
  1007. content: "";
  1008. }
  1009. .fa-search::before {
  1010. content: "";
  1011. }
  1012. .fa-envelope-o::before {
  1013. content: "";
  1014. }
  1015. .fa-heart::before {
  1016. content: "";
  1017. }
  1018. .fa-star::before {
  1019. content: "";
  1020. }
  1021. .fa-star-o::before {
  1022. content: "";
  1023. }
  1024. .fa-user::before {
  1025. content: "";
  1026. }
  1027. .fa-film::before {
  1028. content: "";
  1029. }
  1030. .fa-th-large::before {
  1031. content: "";
  1032. }
  1033. .fa-th::before {
  1034. content: "";
  1035. }
  1036. .fa-th-list::before {
  1037. content: "";
  1038. }
  1039. .fa-check::before {
  1040. content: "";
  1041. }
  1042. .fa-remove::before, .fa-close::before, .fa-times::before {
  1043. content: "";
  1044. }
  1045. .fa-search-plus::before {
  1046. content: "";
  1047. }
  1048. .fa-search-minus::before {
  1049. content: "";
  1050. }
  1051. .fa-power-off::before {
  1052. content: "";
  1053. }
  1054. .fa-signal::before {
  1055. content: "";
  1056. }
  1057. .fa-gear::before, .fa-cog::before {
  1058. content: "";
  1059. }
  1060. .fa-trash-o::before {
  1061. content: "";
  1062. }
  1063. .fa-home::before {
  1064. content: "";
  1065. }
  1066. .fa-file-o::before {
  1067. content: "";
  1068. }
  1069. .fa-clock-o::before {
  1070. content: "";
  1071. }
  1072. .fa-road::before {
  1073. content: "";
  1074. }
  1075. .fa-download::before {
  1076. content: "";
  1077. }
  1078. .fa-arrow-circle-o-down::before {
  1079. content: "";
  1080. }
  1081. .fa-arrow-circle-o-up::before {
  1082. content: "";
  1083. }
  1084. .fa-inbox::before {
  1085. content: "";
  1086. }
  1087. .fa-play-circle-o::before {
  1088. content: "";
  1089. }
  1090. .fa-rotate-right::before, .fa-repeat::before {
  1091. content: "";
  1092. }
  1093. .fa-refresh::before {
  1094. content: "";
  1095. }
  1096. .fa-list-alt::before {
  1097. content: "";
  1098. }
  1099. .fa-lock::before {
  1100. content: "";
  1101. }
  1102. .fa-flag::before {
  1103. content: "";
  1104. }
  1105. .fa-headphones::before {
  1106. content: "";
  1107. }
  1108. .fa-volume-off::before {
  1109. content: "";
  1110. }
  1111. .fa-volume-down::before {
  1112. content: "";
  1113. }
  1114. .fa-volume-up::before {
  1115. content: "";
  1116. }
  1117. .fa-qrcode::before {
  1118. content: "";
  1119. }
  1120. .fa-barcode::before {
  1121. content: "";
  1122. }
  1123. .fa-tag::before {
  1124. content: "";
  1125. }
  1126. .fa-tags::before {
  1127. content: "";
  1128. }
  1129. .fa-book::before {
  1130. content: "";
  1131. }
  1132. .fa-bookmark::before {
  1133. content: "";
  1134. }
  1135. .fa-print::before {
  1136. content: "";
  1137. }
  1138. .fa-camera::before {
  1139. content: "";
  1140. }
  1141. .fa-font::before {
  1142. content: "";
  1143. }
  1144. .fa-bold::before {
  1145. content: "";
  1146. }
  1147. .fa-italic::before {
  1148. content: "";
  1149. }
  1150. .fa-text-height::before {
  1151. content: "";
  1152. }
  1153. .fa-text-width::before {
  1154. content: "";
  1155. }
  1156. .fa-align-left::before {
  1157. content: "";
  1158. }
  1159. .fa-align-center::before {
  1160. content: "";
  1161. }
  1162. .fa-align-right::before {
  1163. content: "";
  1164. }
  1165. .fa-align-justify::before {
  1166. content: "";
  1167. }
  1168. .fa-list::before {
  1169. content: "";
  1170. }
  1171. .fa-dedent::before, .fa-outdent::before {
  1172. content: "";
  1173. }
  1174. .fa-indent::before {
  1175. content: "";
  1176. }
  1177. .fa-video-camera::before {
  1178. content: "";
  1179. }
  1180. .fa-photo::before, .fa-image::before, .fa-picture-o::before {
  1181. content: "";
  1182. }
  1183. .fa-pencil::before {
  1184. content: "";
  1185. }
  1186. .fa-map-marker::before {
  1187. content: "";
  1188. }
  1189. .fa-adjust::before {
  1190. content: "";
  1191. }
  1192. .fa-tint::before {
  1193. content: "";
  1194. }
  1195. .fa-edit::before, .fa-pencil-square-o::before {
  1196. content: "";
  1197. }
  1198. .fa-share-square-o::before {
  1199. content: "";
  1200. }
  1201. .fa-check-square-o::before {
  1202. content: "";
  1203. }
  1204. .fa-arrows::before {
  1205. content: "";
  1206. }
  1207. .fa-step-backward::before {
  1208. content: "";
  1209. }
  1210. .fa-fast-backward::before {
  1211. content: "";
  1212. }
  1213. .fa-backward::before {
  1214. content: "";
  1215. }
  1216. .fa-play::before {
  1217. content: "";
  1218. }
  1219. .fa-pause::before {
  1220. content: "";
  1221. }
  1222. .fa-stop::before {
  1223. content: "";
  1224. }
  1225. .fa-forward::before {
  1226. content: "";
  1227. }
  1228. .fa-fast-forward::before {
  1229. content: "";
  1230. }
  1231. .fa-step-forward::before {
  1232. content: "";
  1233. }
  1234. .fa-eject::before {
  1235. content: "";
  1236. }
  1237. .fa-chevron-left::before {
  1238. content: "";
  1239. }
  1240. .fa-chevron-right::before {
  1241. content: "";
  1242. }
  1243. .fa-plus-circle::before {
  1244. content: "";
  1245. }
  1246. .fa-minus-circle::before {
  1247. content: "";
  1248. }
  1249. .fa-times-circle::before {
  1250. content: "";
  1251. }
  1252. .fa-check-circle::before {
  1253. content: "";
  1254. }
  1255. .fa-question-circle::before {
  1256. content: "";
  1257. }
  1258. .fa-info-circle::before {
  1259. content: "";
  1260. }
  1261. .fa-crosshairs::before {
  1262. content: "";
  1263. }
  1264. .fa-times-circle-o::before {
  1265. content: "";
  1266. }
  1267. .fa-check-circle-o::before {
  1268. content: "";
  1269. }
  1270. .fa-ban::before {
  1271. content: "";
  1272. }
  1273. .fa-arrow-left::before {
  1274. content: "";
  1275. }
  1276. .fa-arrow-right::before {
  1277. content: "";
  1278. }
  1279. .fa-arrow-up::before {
  1280. content: "";
  1281. }
  1282. .fa-arrow-down::before {
  1283. content: "";
  1284. }
  1285. .fa-mail-forward::before, .fa-share::before {
  1286. content: "";
  1287. }
  1288. .fa-expand::before {
  1289. content: "";
  1290. }
  1291. .fa-compress::before {
  1292. content: "";
  1293. }
  1294. .fa-plus::before {
  1295. content: "";
  1296. }
  1297. .fa-minus::before {
  1298. content: "";
  1299. }
  1300. .fa-asterisk::before {
  1301. content: "";
  1302. }
  1303. .fa-exclamation-circle::before {
  1304. content: "";
  1305. }
  1306. .fa-gift::before {
  1307. content: "";
  1308. }
  1309. .fa-leaf::before {
  1310. content: "";
  1311. }
  1312. .fa-fire::before {
  1313. content: "";
  1314. }
  1315. .fa-eye::before {
  1316. content: "";
  1317. }
  1318. .fa-eye-slash::before {
  1319. content: "";
  1320. }
  1321. .fa-warning::before, .fa-exclamation-triangle::before {
  1322. content: "";
  1323. }
  1324. .fa-plane::before {
  1325. content: "";
  1326. }
  1327. .fa-calendar::before {
  1328. content: "";
  1329. }
  1330. .fa-random::before {
  1331. content: "";
  1332. }
  1333. .fa-comment::before {
  1334. content: "";
  1335. }
  1336. .fa-magnet::before {
  1337. content: "";
  1338. }
  1339. .fa-chevron-up::before {
  1340. content: "";
  1341. }
  1342. .fa-chevron-down::before {
  1343. content: "";
  1344. }
  1345. .fa-retweet::before {
  1346. content: "";
  1347. }
  1348. .fa-shopping-cart::before {
  1349. content: "";
  1350. }
  1351. .fa-folder::before {
  1352. content: "";
  1353. }
  1354. .fa-folder-open::before {
  1355. content: "";
  1356. }
  1357. .fa-arrows-v::before {
  1358. content: "";
  1359. }
  1360. .fa-arrows-h::before {
  1361. content: "";
  1362. }
  1363. .fa-bar-chart-o::before, .fa-bar-chart::before {
  1364. content: "";
  1365. }
  1366. .fa-twitter-square::before {
  1367. content: "";
  1368. }
  1369. .fa-facebook-square::before {
  1370. content: "";
  1371. }
  1372. .fa-camera-retro::before {
  1373. content: "";
  1374. }
  1375. .fa-key::before {
  1376. content: "";
  1377. }
  1378. .fa-gears::before, .fa-cogs::before {
  1379. content: "";
  1380. }
  1381. .fa-comments::before {
  1382. content: "";
  1383. }
  1384. .fa-thumbs-o-up::before {
  1385. content: "";
  1386. }
  1387. .fa-thumbs-o-down::before {
  1388. content: "";
  1389. }
  1390. .fa-star-half::before {
  1391. content: "";
  1392. }
  1393. .fa-heart-o::before {
  1394. content: "";
  1395. }
  1396. .fa-sign-out::before {
  1397. content: "";
  1398. }
  1399. .fa-linkedin-square::before {
  1400. content: "";
  1401. }
  1402. .fa-thumb-tack::before {
  1403. content: "";
  1404. }
  1405. .fa-external-link::before {
  1406. content: "";
  1407. }
  1408. .fa-sign-in::before {
  1409. content: "";
  1410. }
  1411. .fa-trophy::before {
  1412. content: "";
  1413. }
  1414. .fa-github-square::before {
  1415. content: "";
  1416. }
  1417. .fa-upload::before {
  1418. content: "";
  1419. }
  1420. .fa-lemon-o::before {
  1421. content: "";
  1422. }
  1423. .fa-phone::before {
  1424. content: "";
  1425. }
  1426. .fa-square-o::before {
  1427. content: "";
  1428. }
  1429. .fa-bookmark-o::before {
  1430. content: "";
  1431. }
  1432. .fa-phone-square::before {
  1433. content: "";
  1434. }
  1435. .fa-twitter::before {
  1436. content: "";
  1437. }
  1438. .fa-facebook-f::before, .fa-facebook::before {
  1439. content: "";
  1440. }
  1441. .fa-github::before {
  1442. content: "";
  1443. }
  1444. .fa-unlock::before {
  1445. content: "";
  1446. }
  1447. .fa-credit-card::before {
  1448. content: "";
  1449. }
  1450. .fa-feed::before, .fa-rss::before {
  1451. content: "";
  1452. }
  1453. .fa-hdd-o::before {
  1454. content: "";
  1455. }
  1456. .fa-bullhorn::before {
  1457. content: "";
  1458. }
  1459. .fa-bell::before {
  1460. content: "";
  1461. }
  1462. .fa-certificate::before {
  1463. content: "";
  1464. }
  1465. .fa-hand-o-right::before {
  1466. content: "";
  1467. }
  1468. .fa-hand-o-left::before {
  1469. content: "";
  1470. }
  1471. .fa-hand-o-up::before {
  1472. content: "";
  1473. }
  1474. .fa-hand-o-down::before {
  1475. content: "";
  1476. }
  1477. .fa-arrow-circle-left::before {
  1478. content: "";
  1479. }
  1480. .fa-arrow-circle-right::before {
  1481. content: "";
  1482. }
  1483. .fa-arrow-circle-up::before {
  1484. content: "";
  1485. }
  1486. .fa-arrow-circle-down::before {
  1487. content: "";
  1488. }
  1489. .fa-globe::before {
  1490. content: "";
  1491. }
  1492. .fa-wrench::before {
  1493. content: "";
  1494. }
  1495. .fa-tasks::before {
  1496. content: "";
  1497. }
  1498. .fa-filter::before {
  1499. content: "";
  1500. }
  1501. .fa-briefcase::before {
  1502. content: "";
  1503. }
  1504. .fa-arrows-alt::before {
  1505. content: "";
  1506. }
  1507. .fa-group::before, .fa-users::before {
  1508. content: "";
  1509. }
  1510. .fa-chain::before, .fa-link::before {
  1511. content: "";
  1512. }
  1513. .fa-cloud::before {
  1514. content: "";
  1515. }
  1516. .fa-flask::before {
  1517. content: "";
  1518. }
  1519. .fa-cut::before, .fa-scissors::before {
  1520. content: "";
  1521. }
  1522. .fa-copy::before, .fa-files-o::before {
  1523. content: "";
  1524. }
  1525. .fa-paperclip::before {
  1526. content: "";
  1527. }
  1528. .fa-save::before, .fa-floppy-o::before {
  1529. content: "";
  1530. }
  1531. .fa-square::before {
  1532. content: "";
  1533. }
  1534. .fa-navicon::before, .fa-reorder::before, .fa-bars::before {
  1535. content: "";
  1536. }
  1537. .fa-list-ul::before {
  1538. content: "";
  1539. }
  1540. .fa-list-ol::before {
  1541. content: "";
  1542. }
  1543. .fa-strikethrough::before {
  1544. content: "";
  1545. }
  1546. .fa-underline::before {
  1547. content: "";
  1548. }
  1549. .fa-table::before {
  1550. content: "";
  1551. }
  1552. .fa-magic::before {
  1553. content: "";
  1554. }
  1555. .fa-truck::before {
  1556. content: "";
  1557. }
  1558. .fa-pinterest::before {
  1559. content: "";
  1560. }
  1561. .fa-pinterest-square::before {
  1562. content: "";
  1563. }
  1564. .fa-google-plus-square::before {
  1565. content: "";
  1566. }
  1567. .fa-google-plus::before {
  1568. content: "";
  1569. }
  1570. .fa-money::before {
  1571. content: "";
  1572. }
  1573. .fa-caret-down::before {
  1574. content: "";
  1575. }
  1576. .fa-caret-up::before {
  1577. content: "";
  1578. }
  1579. .fa-caret-left::before {
  1580. content: "";
  1581. }
  1582. .fa-caret-right::before {
  1583. content: "";
  1584. }
  1585. .fa-columns::before {
  1586. content: "";
  1587. }
  1588. .fa-unsorted::before, .fa-sort::before {
  1589. content: "";
  1590. }
  1591. .fa-sort-down::before, .fa-sort-desc::before {
  1592. content: "";
  1593. }
  1594. .fa-sort-up::before, .fa-sort-asc::before {
  1595. content: "";
  1596. }
  1597. .fa-envelope::before {
  1598. content: "";
  1599. }
  1600. .fa-linkedin::before {
  1601. content: "";
  1602. }
  1603. .fa-rotate-left::before, .fa-undo::before {
  1604. content: "";
  1605. }
  1606. .fa-legal::before, .fa-gavel::before {
  1607. content: "";
  1608. }
  1609. .fa-dashboard::before, .fa-tachometer::before {
  1610. content: "";
  1611. }
  1612. .fa-comment-o::before {
  1613. content: "";
  1614. }
  1615. .fa-comments-o::before {
  1616. content: "";
  1617. }
  1618. .fa-flash::before, .fa-bolt::before {
  1619. content: "";
  1620. }
  1621. .fa-sitemap::before {
  1622. content: "";
  1623. }
  1624. .fa-umbrella::before {
  1625. content: "";
  1626. }
  1627. .fa-paste::before, .fa-clipboard::before {
  1628. content: "";
  1629. }
  1630. .fa-lightbulb-o::before {
  1631. content: "";
  1632. }
  1633. .fa-exchange::before {
  1634. content: "";
  1635. }
  1636. .fa-cloud-download::before {
  1637. content: "";
  1638. }
  1639. .fa-cloud-upload::before {
  1640. content: "";
  1641. }
  1642. .fa-user-md::before {
  1643. content: "";
  1644. }
  1645. .fa-stethoscope::before {
  1646. content: "";
  1647. }
  1648. .fa-suitcase::before {
  1649. content: "";
  1650. }
  1651. .fa-bell-o::before {
  1652. content: "";
  1653. }
  1654. .fa-coffee::before {
  1655. content: "";
  1656. }
  1657. .fa-cutlery::before {
  1658. content: "";
  1659. }
  1660. .fa-file-text-o::before {
  1661. content: "";
  1662. }
  1663. .fa-building-o::before {
  1664. content: "";
  1665. }
  1666. .fa-hospital-o::before {
  1667. content: "";
  1668. }
  1669. .fa-ambulance::before {
  1670. content: "";
  1671. }
  1672. .fa-medkit::before {
  1673. content: "";
  1674. }
  1675. .fa-fighter-jet::before {
  1676. content: "";
  1677. }
  1678. .fa-beer::before {
  1679. content: "";
  1680. }
  1681. .fa-h-square::before {
  1682. content: "";
  1683. }
  1684. .fa-plus-square::before {
  1685. content: "";
  1686. }
  1687. .fa-angle-double-left::before {
  1688. content: "";
  1689. }
  1690. .fa-angle-double-right::before {
  1691. content: "";
  1692. }
  1693. .fa-angle-double-up::before {
  1694. content: "";
  1695. }
  1696. .fa-angle-double-down::before {
  1697. content: "";
  1698. }
  1699. .fa-angle-left::before {
  1700. content: "";
  1701. }
  1702. .fa-angle-right::before {
  1703. content: "";
  1704. }
  1705. .fa-angle-up::before {
  1706. content: "";
  1707. }
  1708. .fa-angle-down::before {
  1709. content: "";
  1710. }
  1711. .fa-desktop::before {
  1712. content: "";
  1713. }
  1714. .fa-laptop::before {
  1715. content: "";
  1716. }
  1717. .fa-tablet::before {
  1718. content: "";
  1719. }
  1720. .fa-mobile-phone::before, .fa-mobile::before {
  1721. content: "";
  1722. }
  1723. .fa-circle-o::before {
  1724. content: "";
  1725. }
  1726. .fa-quote-left::before {
  1727. content: "";
  1728. }
  1729. .fa-quote-right::before {
  1730. content: "";
  1731. }
  1732. .fa-circle::before {
  1733. content: "";
  1734. }
  1735. .fa-mail-reply::before, .fa-reply::before {
  1736. content: "";
  1737. }
  1738. .fa-github-alt::before {
  1739. content: "";
  1740. }
  1741. .fa-folder-o::before {
  1742. content: "";
  1743. }
  1744. .fa-folder-open-o::before {
  1745. content: "";
  1746. }
  1747. .fa-smile-o::before {
  1748. content: "";
  1749. }
  1750. .fa-frown-o::before {
  1751. content: "";
  1752. }
  1753. .fa-meh-o::before {
  1754. content: "";
  1755. }
  1756. .fa-gamepad::before {
  1757. content: "";
  1758. }
  1759. .fa-keyboard-o::before {
  1760. content: "";
  1761. }
  1762. .fa-flag-o::before {
  1763. content: "";
  1764. }
  1765. .fa-flag-checkered::before {
  1766. content: "";
  1767. }
  1768. .fa-terminal::before {
  1769. content: "";
  1770. }
  1771. .fa-code::before {
  1772. content: "";
  1773. }
  1774. .fa-mail-reply-all::before, .fa-reply-all::before {
  1775. content: "";
  1776. }
  1777. .fa-star-half-empty::before, .fa-star-half-full::before, .fa-star-half-o::before {
  1778. content: "";
  1779. }
  1780. .fa-location-arrow::before {
  1781. content: "";
  1782. }
  1783. .fa-crop::before {
  1784. content: "";
  1785. }
  1786. .fa-code-fork::before {
  1787. content: "";
  1788. }
  1789. .fa-unlink::before, .fa-chain-broken::before {
  1790. content: "";
  1791. }
  1792. .fa-question::before {
  1793. content: "";
  1794. }
  1795. .fa-info::before {
  1796. content: "";
  1797. }
  1798. .fa-exclamation::before {
  1799. content: "";
  1800. }
  1801. .fa-superscript::before {
  1802. content: "";
  1803. }
  1804. .fa-subscript::before {
  1805. content: "";
  1806. }
  1807. .fa-eraser::before {
  1808. content: "";
  1809. }
  1810. .fa-puzzle-piece::before {
  1811. content: "";
  1812. }
  1813. .fa-microphone::before {
  1814. content: "";
  1815. }
  1816. .fa-microphone-slash::before {
  1817. content: "";
  1818. }
  1819. .fa-shield::before {
  1820. content: "";
  1821. }
  1822. .fa-calendar-o::before {
  1823. content: "";
  1824. }
  1825. .fa-fire-extinguisher::before {
  1826. content: "";
  1827. }
  1828. .fa-rocket::before {
  1829. content: "";
  1830. }
  1831. .fa-maxcdn::before {
  1832. content: "";
  1833. }
  1834. .fa-chevron-circle-left::before {
  1835. content: "";
  1836. }
  1837. .fa-chevron-circle-right::before {
  1838. content: "";
  1839. }
  1840. .fa-chevron-circle-up::before {
  1841. content: "";
  1842. }
  1843. .fa-chevron-circle-down::before {
  1844. content: "";
  1845. }
  1846. .fa-html5::before {
  1847. content: "";
  1848. }
  1849. .fa-css3::before {
  1850. content: "";
  1851. }
  1852. .fa-anchor::before {
  1853. content: "";
  1854. }
  1855. .fa-unlock-alt::before {
  1856. content: "";
  1857. }
  1858. .fa-bullseye::before {
  1859. content: "";
  1860. }
  1861. .fa-ellipsis-h::before {
  1862. content: "";
  1863. }
  1864. .fa-ellipsis-v::before {
  1865. content: "";
  1866. }
  1867. .fa-rss-square::before {
  1868. content: "";
  1869. }
  1870. .fa-play-circle::before {
  1871. content: "";
  1872. }
  1873. .fa-ticket::before {
  1874. content: "";
  1875. }
  1876. .fa-minus-square::before {
  1877. content: "";
  1878. }
  1879. .fa-minus-square-o::before {
  1880. content: "";
  1881. }
  1882. .fa-level-up::before {
  1883. content: "";
  1884. }
  1885. .fa-level-down::before {
  1886. content: "";
  1887. }
  1888. .fa-check-square::before {
  1889. content: "";
  1890. }
  1891. .fa-pencil-square::before {
  1892. content: "";
  1893. }
  1894. .fa-external-link-square::before {
  1895. content: "";
  1896. }
  1897. .fa-share-square::before {
  1898. content: "";
  1899. }
  1900. .fa-compass::before {
  1901. content: "";
  1902. }
  1903. .fa-toggle-down::before, .fa-caret-square-o-down::before {
  1904. content: "";
  1905. }
  1906. .fa-toggle-up::before, .fa-caret-square-o-up::before {
  1907. content: "";
  1908. }
  1909. .fa-toggle-right::before, .fa-caret-square-o-right::before {
  1910. content: "";
  1911. }
  1912. .fa-euro::before, .fa-eur::before {
  1913. content: "";
  1914. }
  1915. .fa-gbp::before {
  1916. content: "";
  1917. }
  1918. .fa-dollar::before, .fa-usd::before {
  1919. content: "";
  1920. }
  1921. .fa-rupee::before, .fa-inr::before {
  1922. content: "";
  1923. }
  1924. .fa-cny::before, .fa-rmb::before, .fa-yen::before, .fa-jpy::before {
  1925. content: "";
  1926. }
  1927. .fa-ruble::before, .fa-rouble::before, .fa-rub::before {
  1928. content: "";
  1929. }
  1930. .fa-won::before, .fa-krw::before {
  1931. content: "";
  1932. }
  1933. .fa-bitcoin::before, .fa-btc::before {
  1934. content: "";
  1935. }
  1936. .fa-file::before {
  1937. content: "";
  1938. }
  1939. .fa-file-text::before {
  1940. content: "";
  1941. }
  1942. .fa-sort-alpha-asc::before {
  1943. content: "";
  1944. }
  1945. .fa-sort-alpha-desc::before {
  1946. content: "";
  1947. }
  1948. .fa-sort-amount-asc::before {
  1949. content: "";
  1950. }
  1951. .fa-sort-amount-desc::before {
  1952. content: "";
  1953. }
  1954. .fa-sort-numeric-asc::before {
  1955. content: "";
  1956. }
  1957. .fa-sort-numeric-desc::before {
  1958. content: "";
  1959. }
  1960. .fa-thumbs-up::before {
  1961. content: "";
  1962. }
  1963. .fa-thumbs-down::before {
  1964. content: "";
  1965. }
  1966. .fa-youtube-square::before {
  1967. content: "";
  1968. }
  1969. .fa-youtube::before {
  1970. content: "";
  1971. }
  1972. .fa-xing::before {
  1973. content: "";
  1974. }
  1975. .fa-xing-square::before {
  1976. content: "";
  1977. }
  1978. .fa-youtube-play::before {
  1979. content: "";
  1980. }
  1981. .fa-dropbox::before {
  1982. content: "";
  1983. }
  1984. .fa-stack-overflow::before {
  1985. content: "";
  1986. }
  1987. .fa-instagram::before {
  1988. content: "";
  1989. }
  1990. .fa-flickr::before {
  1991. content: "";
  1992. }
  1993. .fa-adn::before {
  1994. content: "";
  1995. }
  1996. .fa-bitbucket::before {
  1997. content: "";
  1998. }
  1999. .fa-bitbucket-square::before {
  2000. content: "";
  2001. }
  2002. .fa-tumblr::before {
  2003. content: "";
  2004. }
  2005. .fa-tumblr-square::before {
  2006. content: "";
  2007. }
  2008. .fa-long-arrow-down::before {
  2009. content: "";
  2010. }
  2011. .fa-long-arrow-up::before {
  2012. content: "";
  2013. }
  2014. .fa-long-arrow-left::before {
  2015. content: "";
  2016. }
  2017. .fa-long-arrow-right::before {
  2018. content: "";
  2019. }
  2020. .fa-apple::before {
  2021. content: "";
  2022. }
  2023. .fa-windows::before {
  2024. content: "";
  2025. }
  2026. .fa-android::before {
  2027. content: "";
  2028. }
  2029. .fa-linux::before {
  2030. content: "";
  2031. }
  2032. .fa-dribbble::before {
  2033. content: "";
  2034. }
  2035. .fa-skype::before {
  2036. content: "";
  2037. }
  2038. .fa-foursquare::before {
  2039. content: "";
  2040. }
  2041. .fa-trello::before {
  2042. content: "";
  2043. }
  2044. .fa-female::before {
  2045. content: "";
  2046. }
  2047. .fa-male::before {
  2048. content: "";
  2049. }
  2050. .fa-gittip::before, .fa-gratipay::before {
  2051. content: "";
  2052. }
  2053. .fa-sun-o::before {
  2054. content: "";
  2055. }
  2056. .fa-moon-o::before {
  2057. content: "";
  2058. }
  2059. .fa-archive::before {
  2060. content: "";
  2061. }
  2062. .fa-bug::before {
  2063. content: "";
  2064. }
  2065. .fa-vk::before {
  2066. content: "";
  2067. }
  2068. .fa-weibo::before {
  2069. content: "";
  2070. }
  2071. .fa-renren::before {
  2072. content: "";
  2073. }
  2074. .fa-pagelines::before {
  2075. content: "";
  2076. }
  2077. .fa-stack-exchange::before {
  2078. content: "";
  2079. }
  2080. .fa-arrow-circle-o-right::before {
  2081. content: "";
  2082. }
  2083. .fa-arrow-circle-o-left::before {
  2084. content: "";
  2085. }
  2086. .fa-toggle-left::before, .fa-caret-square-o-left::before {
  2087. content: "";
  2088. }
  2089. .fa-dot-circle-o::before {
  2090. content: "";
  2091. }
  2092. .fa-wheelchair::before {
  2093. content: "";
  2094. }
  2095. .fa-vimeo-square::before {
  2096. content: "";
  2097. }
  2098. .fa-turkish-lira::before, .fa-try::before {
  2099. content: "";
  2100. }
  2101. .fa-plus-square-o::before {
  2102. content: "";
  2103. }
  2104. .fa-space-shuttle::before {
  2105. content: "";
  2106. }
  2107. .fa-slack::before {
  2108. content: "";
  2109. }
  2110. .fa-envelope-square::before {
  2111. content: "";
  2112. }
  2113. .fa-wordpress::before {
  2114. content: "";
  2115. }
  2116. .fa-openid::before {
  2117. content: "";
  2118. }
  2119. .fa-institution::before, .fa-bank::before, .fa-university::before {
  2120. content: "";
  2121. }
  2122. .fa-mortar-board::before, .fa-graduation-cap::before {
  2123. content: "";
  2124. }
  2125. .fa-yahoo::before {
  2126. content: "";
  2127. }
  2128. .fa-google::before {
  2129. content: "";
  2130. }
  2131. .fa-reddit::before {
  2132. content: "";
  2133. }
  2134. .fa-reddit-square::before {
  2135. content: "";
  2136. }
  2137. .fa-stumbleupon-circle::before {
  2138. content: "";
  2139. }
  2140. .fa-stumbleupon::before {
  2141. content: "";
  2142. }
  2143. .fa-delicious::before {
  2144. content: "";
  2145. }
  2146. .fa-digg::before {
  2147. content: "";
  2148. }
  2149. .fa-pied-piper-pp::before {
  2150. content: "";
  2151. }
  2152. .fa-pied-piper-alt::before {
  2153. content: "";
  2154. }
  2155. .fa-drupal::before {
  2156. content: "";
  2157. }
  2158. .fa-joomla::before {
  2159. content: "";
  2160. }
  2161. .fa-language::before {
  2162. content: "";
  2163. }
  2164. .fa-fax::before {
  2165. content: "";
  2166. }
  2167. .fa-building::before {
  2168. content: "";
  2169. }
  2170. .fa-child::before {
  2171. content: "";
  2172. }
  2173. .fa-paw::before {
  2174. content: "";
  2175. }
  2176. .fa-spoon::before {
  2177. content: "";
  2178. }
  2179. .fa-cube::before {
  2180. content: "";
  2181. }
  2182. .fa-cubes::before {
  2183. content: "";
  2184. }
  2185. .fa-behance::before {
  2186. content: "";
  2187. }
  2188. .fa-behance-square::before {
  2189. content: "";
  2190. }
  2191. .fa-steam::before {
  2192. content: "";
  2193. }
  2194. .fa-steam-square::before {
  2195. content: "";
  2196. }
  2197. .fa-recycle::before {
  2198. content: "";
  2199. }
  2200. .fa-automobile::before, .fa-car::before {
  2201. content: "";
  2202. }
  2203. .fa-cab::before, .fa-taxi::before {
  2204. content: "";
  2205. }
  2206. .fa-tree::before {
  2207. content: "";
  2208. }
  2209. .fa-spotify::before {
  2210. content: "";
  2211. }
  2212. .fa-deviantart::before {
  2213. content: "";
  2214. }
  2215. .fa-soundcloud::before {
  2216. content: "";
  2217. }
  2218. .fa-database::before {
  2219. content: "";
  2220. }
  2221. .fa-file-pdf-o::before {
  2222. content: "";
  2223. }
  2224. .fa-file-word-o::before {
  2225. content: "";
  2226. }
  2227. .fa-file-excel-o::before {
  2228. content: "";
  2229. }
  2230. .fa-file-powerpoint-o::before {
  2231. content: "";
  2232. }
  2233. .fa-file-photo-o::before, .fa-file-picture-o::before, .fa-file-image-o::before {
  2234. content: "";
  2235. }
  2236. .fa-file-zip-o::before, .fa-file-archive-o::before {
  2237. content: "";
  2238. }
  2239. .fa-file-sound-o::before, .fa-file-audio-o::before {
  2240. content: "";
  2241. }
  2242. .fa-file-movie-o::before, .fa-file-video-o::before {
  2243. content: "";
  2244. }
  2245. .fa-file-code-o::before {
  2246. content: "";
  2247. }
  2248. .fa-vine::before {
  2249. content: "";
  2250. }
  2251. .fa-codepen::before {
  2252. content: "";
  2253. }
  2254. .fa-jsfiddle::before {
  2255. content: "";
  2256. }
  2257. .fa-life-bouy::before, .fa-life-buoy::before, .fa-life-saver::before, .fa-support::before, .fa-life-ring::before {
  2258. content: "";
  2259. }
  2260. .fa-circle-o-notch::before {
  2261. content: "";
  2262. }
  2263. .fa-ra::before, .fa-resistance::before, .fa-rebel::before {
  2264. content: "";
  2265. }
  2266. .fa-ge::before, .fa-empire::before {
  2267. content: "";
  2268. }
  2269. .fa-git-square::before {
  2270. content: "";
  2271. }
  2272. .fa-git::before {
  2273. content: "";
  2274. }
  2275. .fa-y-combinator-square::before, .fa-yc-square::before, .fa-hacker-news::before {
  2276. content: "";
  2277. }
  2278. .fa-tencent-weibo::before {
  2279. content: "";
  2280. }
  2281. .fa-qq::before {
  2282. content: "";
  2283. }
  2284. .fa-wechat::before, .fa-weixin::before {
  2285. content: "";
  2286. }
  2287. .fa-send::before, .fa-paper-plane::before {
  2288. content: "";
  2289. }
  2290. .fa-send-o::before, .fa-paper-plane-o::before {
  2291. content: "";
  2292. }
  2293. .fa-history::before {
  2294. content: "";
  2295. }
  2296. .fa-circle-thin::before {
  2297. content: "";
  2298. }
  2299. .fa-header::before {
  2300. content: "";
  2301. }
  2302. .fa-paragraph::before {
  2303. content: "";
  2304. }
  2305. .fa-sliders::before {
  2306. content: "";
  2307. }
  2308. .fa-share-alt::before {
  2309. content: "";
  2310. }
  2311. .fa-share-alt-square::before {
  2312. content: "";
  2313. }
  2314. .fa-bomb::before {
  2315. content: "";
  2316. }
  2317. .fa-soccer-ball-o::before, .fa-futbol-o::before {
  2318. content: "";
  2319. }
  2320. .fa-tty::before {
  2321. content: "";
  2322. }
  2323. .fa-binoculars::before {
  2324. content: "";
  2325. }
  2326. .fa-plug::before {
  2327. content: "";
  2328. }
  2329. .fa-slideshare::before {
  2330. content: "";
  2331. }
  2332. .fa-twitch::before {
  2333. content: "";
  2334. }
  2335. .fa-yelp::before {
  2336. content: "";
  2337. }
  2338. .fa-newspaper-o::before {
  2339. content: "";
  2340. }
  2341. .fa-wifi::before {
  2342. content: "";
  2343. }
  2344. .fa-calculator::before {
  2345. content: "";
  2346. }
  2347. .fa-paypal::before {
  2348. content: "";
  2349. }
  2350. .fa-google-wallet::before {
  2351. content: "";
  2352. }
  2353. .fa-cc-visa::before {
  2354. content: "";
  2355. }
  2356. .fa-cc-mastercard::before {
  2357. content: "";
  2358. }
  2359. .fa-cc-discover::before {
  2360. content: "";
  2361. }
  2362. .fa-cc-amex::before {
  2363. content: "";
  2364. }
  2365. .fa-cc-paypal::before {
  2366. content: "";
  2367. }
  2368. .fa-cc-stripe::before {
  2369. content: "";
  2370. }
  2371. .fa-bell-slash::before {
  2372. content: "";
  2373. }
  2374. .fa-bell-slash-o::before {
  2375. content: "";
  2376. }
  2377. .fa-trash::before {
  2378. content: "";
  2379. }
  2380. .fa-copyright::before {
  2381. content: "";
  2382. }
  2383. .fa-at::before {
  2384. content: "";
  2385. }
  2386. .fa-eyedropper::before {
  2387. content: "";
  2388. }
  2389. .fa-paint-brush::before {
  2390. content: "";
  2391. }
  2392. .fa-birthday-cake::before {
  2393. content: "";
  2394. }
  2395. .fa-area-chart::before {
  2396. content: "";
  2397. }
  2398. .fa-pie-chart::before {
  2399. content: "";
  2400. }
  2401. .fa-line-chart::before {
  2402. content: "";
  2403. }
  2404. .fa-lastfm::before {
  2405. content: "";
  2406. }
  2407. .fa-lastfm-square::before {
  2408. content: "";
  2409. }
  2410. .fa-toggle-off::before {
  2411. content: "";
  2412. }
  2413. .fa-toggle-on::before {
  2414. content: "";
  2415. }
  2416. .fa-bicycle::before {
  2417. content: "";
  2418. }
  2419. .fa-bus::before {
  2420. content: "";
  2421. }
  2422. .fa-ioxhost::before {
  2423. content: "";
  2424. }
  2425. .fa-angellist::before {
  2426. content: "";
  2427. }
  2428. .fa-cc::before {
  2429. content: "";
  2430. }
  2431. .fa-shekel::before, .fa-sheqel::before, .fa-ils::before {
  2432. content: "";
  2433. }
  2434. .fa-meanpath::before {
  2435. content: "";
  2436. }
  2437. .fa-buysellads::before {
  2438. content: "";
  2439. }
  2440. .fa-connectdevelop::before {
  2441. content: "";
  2442. }
  2443. .fa-dashcube::before {
  2444. content: "";
  2445. }
  2446. .fa-forumbee::before {
  2447. content: "";
  2448. }
  2449. .fa-leanpub::before {
  2450. content: "";
  2451. }
  2452. .fa-sellsy::before {
  2453. content: "";
  2454. }
  2455. .fa-shirtsinbulk::before {
  2456. content: "";
  2457. }
  2458. .fa-simplybuilt::before {
  2459. content: "";
  2460. }
  2461. .fa-skyatlas::before {
  2462. content: "";
  2463. }
  2464. .fa-cart-plus::before {
  2465. content: "";
  2466. }
  2467. .fa-cart-arrow-down::before {
  2468. content: "";
  2469. }
  2470. .fa-diamond::before {
  2471. content: "";
  2472. }
  2473. .fa-ship::before {
  2474. content: "";
  2475. }
  2476. .fa-user-secret::before {
  2477. content: "";
  2478. }
  2479. .fa-motorcycle::before {
  2480. content: "";
  2481. }
  2482. .fa-street-view::before {
  2483. content: "";
  2484. }
  2485. .fa-heartbeat::before {
  2486. content: "";
  2487. }
  2488. .fa-venus::before {
  2489. content: "";
  2490. }
  2491. .fa-mars::before {
  2492. content: "";
  2493. }
  2494. .fa-mercury::before {
  2495. content: "";
  2496. }
  2497. .fa-intersex::before, .fa-transgender::before {
  2498. content: "";
  2499. }
  2500. .fa-transgender-alt::before {
  2501. content: "";
  2502. }
  2503. .fa-venus-double::before {
  2504. content: "";
  2505. }
  2506. .fa-mars-double::before {
  2507. content: "";
  2508. }
  2509. .fa-venus-mars::before {
  2510. content: "";
  2511. }
  2512. .fa-mars-stroke::before {
  2513. content: "";
  2514. }
  2515. .fa-mars-stroke-v::before {
  2516. content: "";
  2517. }
  2518. .fa-mars-stroke-h::before {
  2519. content: "";
  2520. }
  2521. .fa-neuter::before {
  2522. content: "";
  2523. }
  2524. .fa-genderless::before {
  2525. content: "";
  2526. }
  2527. .fa-facebook-official::before {
  2528. content: "";
  2529. }
  2530. .fa-pinterest-p::before {
  2531. content: "";
  2532. }
  2533. .fa-whatsapp::before {
  2534. content: "";
  2535. }
  2536. .fa-server::before {
  2537. content: "";
  2538. }
  2539. .fa-user-plus::before {
  2540. content: "";
  2541. }
  2542. .fa-user-times::before {
  2543. content: "";
  2544. }
  2545. .fa-hotel::before, .fa-bed::before {
  2546. content: "";
  2547. }
  2548. .fa-viacoin::before {
  2549. content: "";
  2550. }
  2551. .fa-train::before {
  2552. content: "";
  2553. }
  2554. .fa-subway::before {
  2555. content: "";
  2556. }
  2557. .fa-medium::before {
  2558. content: "";
  2559. }
  2560. .fa-yc::before, .fa-y-combinator::before {
  2561. content: "";
  2562. }
  2563. .fa-optin-monster::before {
  2564. content: "";
  2565. }
  2566. .fa-opencart::before {
  2567. content: "";
  2568. }
  2569. .fa-expeditedssl::before {
  2570. content: "";
  2571. }
  2572. .fa-battery-4::before, .fa-battery::before, .fa-battery-full::before {
  2573. content: "";
  2574. }
  2575. .fa-battery-3::before, .fa-battery-three-quarters::before {
  2576. content: "";
  2577. }
  2578. .fa-battery-2::before, .fa-battery-half::before {
  2579. content: "";
  2580. }
  2581. .fa-battery-1::before, .fa-battery-quarter::before {
  2582. content: "";
  2583. }
  2584. .fa-battery-0::before, .fa-battery-empty::before {
  2585. content: "";
  2586. }
  2587. .fa-mouse-pointer::before {
  2588. content: "";
  2589. }
  2590. .fa-i-cursor::before {
  2591. content: "";
  2592. }
  2593. .fa-object-group::before {
  2594. content: "";
  2595. }
  2596. .fa-object-ungroup::before {
  2597. content: "";
  2598. }
  2599. .fa-sticky-note::before {
  2600. content: "";
  2601. }
  2602. .fa-sticky-note-o::before {
  2603. content: "";
  2604. }
  2605. .fa-cc-jcb::before {
  2606. content: "";
  2607. }
  2608. .fa-cc-diners-club::before {
  2609. content: "";
  2610. }
  2611. .fa-clone::before {
  2612. content: "";
  2613. }
  2614. .fa-balance-scale::before {
  2615. content: "";
  2616. }
  2617. .fa-hourglass-o::before {
  2618. content: "";
  2619. }
  2620. .fa-hourglass-1::before, .fa-hourglass-start::before {
  2621. content: "";
  2622. }
  2623. .fa-hourglass-2::before, .fa-hourglass-half::before {
  2624. content: "";
  2625. }
  2626. .fa-hourglass-3::before, .fa-hourglass-end::before {
  2627. content: "";
  2628. }
  2629. .fa-hourglass::before {
  2630. content: "";
  2631. }
  2632. .fa-hand-grab-o::before, .fa-hand-rock-o::before {
  2633. content: "";
  2634. }
  2635. .fa-hand-stop-o::before, .fa-hand-paper-o::before {
  2636. content: "";
  2637. }
  2638. .fa-hand-scissors-o::before {
  2639. content: "";
  2640. }
  2641. .fa-hand-lizard-o::before {
  2642. content: "";
  2643. }
  2644. .fa-hand-spock-o::before {
  2645. content: "";
  2646. }
  2647. .fa-hand-pointer-o::before {
  2648. content: "";
  2649. }
  2650. .fa-hand-peace-o::before {
  2651. content: "";
  2652. }
  2653. .fa-trademark::before {
  2654. content: "";
  2655. }
  2656. .fa-registered::before {
  2657. content: "";
  2658. }
  2659. .fa-creative-commons::before {
  2660. content: "";
  2661. }
  2662. .fa-gg::before {
  2663. content: "";
  2664. }
  2665. .fa-gg-circle::before {
  2666. content: "";
  2667. }
  2668. .fa-tripadvisor::before {
  2669. content: "";
  2670. }
  2671. .fa-odnoklassniki::before {
  2672. content: "";
  2673. }
  2674. .fa-odnoklassniki-square::before {
  2675. content: "";
  2676. }
  2677. .fa-get-pocket::before {
  2678. content: "";
  2679. }
  2680. .fa-wikipedia-w::before {
  2681. content: "";
  2682. }
  2683. .fa-safari::before {
  2684. content: "";
  2685. }
  2686. .fa-chrome::before {
  2687. content: "";
  2688. }
  2689. .fa-firefox::before {
  2690. content: "";
  2691. }
  2692. .fa-opera::before {
  2693. content: "";
  2694. }
  2695. .fa-internet-explorer::before {
  2696. content: "";
  2697. }
  2698. .fa-tv::before, .fa-television::before {
  2699. content: "";
  2700. }
  2701. .fa-contao::before {
  2702. content: "";
  2703. }
  2704. .fa-500px::before {
  2705. content: "";
  2706. }
  2707. .fa-amazon::before {
  2708. content: "";
  2709. }
  2710. .fa-calendar-plus-o::before {
  2711. content: "";
  2712. }
  2713. .fa-calendar-minus-o::before {
  2714. content: "";
  2715. }
  2716. .fa-calendar-times-o::before {
  2717. content: "";
  2718. }
  2719. .fa-calendar-check-o::before {
  2720. content: "";
  2721. }
  2722. .fa-industry::before {
  2723. content: "";
  2724. }
  2725. .fa-map-pin::before {
  2726. content: "";
  2727. }
  2728. .fa-map-signs::before {
  2729. content: "";
  2730. }
  2731. .fa-map-o::before {
  2732. content: "";
  2733. }
  2734. .fa-map::before {
  2735. content: "";
  2736. }
  2737. .fa-commenting::before {
  2738. content: "";
  2739. }
  2740. .fa-commenting-o::before {
  2741. content: "";
  2742. }
  2743. .fa-houzz::before {
  2744. content: "";
  2745. }
  2746. .fa-vimeo::before {
  2747. content: "";
  2748. }
  2749. .fa-black-tie::before {
  2750. content: "";
  2751. }
  2752. .fa-fonticons::before {
  2753. content: "";
  2754. }
  2755. .fa-reddit-alien::before {
  2756. content: "";
  2757. }
  2758. .fa-edge::before {
  2759. content: "";
  2760. }
  2761. .fa-credit-card-alt::before {
  2762. content: "";
  2763. }
  2764. .fa-codiepie::before {
  2765. content: "";
  2766. }
  2767. .fa-modx::before {
  2768. content: "";
  2769. }
  2770. .fa-fort-awesome::before {
  2771. content: "";
  2772. }
  2773. .fa-usb::before {
  2774. content: "";
  2775. }
  2776. .fa-product-hunt::before {
  2777. content: "";
  2778. }
  2779. .fa-mixcloud::before {
  2780. content: "";
  2781. }
  2782. .fa-scribd::before {
  2783. content: "";
  2784. }
  2785. .fa-pause-circle::before {
  2786. content: "";
  2787. }
  2788. .fa-pause-circle-o::before {
  2789. content: "";
  2790. }
  2791. .fa-stop-circle::before {
  2792. content: "";
  2793. }
  2794. .fa-stop-circle-o::before {
  2795. content: "";
  2796. }
  2797. .fa-shopping-bag::before {
  2798. content: "";
  2799. }
  2800. .fa-shopping-basket::before {
  2801. content: "";
  2802. }
  2803. .fa-hashtag::before {
  2804. content: "";
  2805. }
  2806. .fa-bluetooth::before {
  2807. content: "";
  2808. }
  2809. .fa-bluetooth-b::before {
  2810. content: "";
  2811. }
  2812. .fa-percent::before {
  2813. content: "";
  2814. }
  2815. .fa-gitlab::before {
  2816. content: "";
  2817. }
  2818. .fa-wpbeginner::before {
  2819. content: "";
  2820. }
  2821. .fa-wpforms::before {
  2822. content: "";
  2823. }
  2824. .fa-envira::before {
  2825. content: "";
  2826. }
  2827. .fa-universal-access::before {
  2828. content: "";
  2829. }
  2830. .fa-wheelchair-alt::before {
  2831. content: "";
  2832. }
  2833. .fa-question-circle-o::before {
  2834. content: "";
  2835. }
  2836. .fa-blind::before {
  2837. content: "";
  2838. }
  2839. .fa-audio-description::before {
  2840. content: "";
  2841. }
  2842. .fa-volume-control-phone::before {
  2843. content: "";
  2844. }
  2845. .fa-braille::before {
  2846. content: "";
  2847. }
  2848. .fa-assistive-listening-systems::before {
  2849. content: "";
  2850. }
  2851. .fa-asl-interpreting::before, .fa-american-sign-language-interpreting::before {
  2852. content: "";
  2853. }
  2854. .fa-deafness::before, .fa-hard-of-hearing::before, .fa-deaf::before {
  2855. content: "";
  2856. }
  2857. .fa-glide::before {
  2858. content: "";
  2859. }
  2860. .fa-glide-g::before {
  2861. content: "";
  2862. }
  2863. .fa-signing::before, .fa-sign-language::before {
  2864. content: "";
  2865. }
  2866. .fa-low-vision::before {
  2867. content: "";
  2868. }
  2869. .fa-viadeo::before {
  2870. content: "";
  2871. }
  2872. .fa-viadeo-square::before {
  2873. content: "";
  2874. }
  2875. .fa-snapchat::before {
  2876. content: "";
  2877. }
  2878. .fa-snapchat-ghost::before {
  2879. content: "";
  2880. }
  2881. .fa-snapchat-square::before {
  2882. content: "";
  2883. }
  2884. .fa-pied-piper::before {
  2885. content: "";
  2886. }
  2887. .fa-first-order::before {
  2888. content: "";
  2889. }
  2890. .fa-yoast::before {
  2891. content: "";
  2892. }
  2893. .fa-themeisle::before {
  2894. content: "";
  2895. }
  2896. .fa-google-plus-circle::before, .fa-google-plus-official::before {
  2897. content: "";
  2898. }
  2899. .fa-fa::before, .fa-font-awesome::before {
  2900. content: "";
  2901. }
  2902. .fa-handshake-o::before {
  2903. content: "";
  2904. }
  2905. .fa-envelope-open::before {
  2906. content: "";
  2907. }
  2908. .fa-envelope-open-o::before {
  2909. content: "";
  2910. }
  2911. .fa-linode::before {
  2912. content: "";
  2913. }
  2914. .fa-address-book::before {
  2915. content: "";
  2916. }
  2917. .fa-address-book-o::before {
  2918. content: "";
  2919. }
  2920. .fa-vcard::before, .fa-address-card::before {
  2921. content: "";
  2922. }
  2923. .fa-vcard-o::before, .fa-address-card-o::before {
  2924. content: "";
  2925. }
  2926. .fa-user-circle::before {
  2927. content: "";
  2928. }
  2929. .fa-user-circle-o::before {
  2930. content: "";
  2931. }
  2932. .fa-user-o::before {
  2933. content: "";
  2934. }
  2935. .fa-id-badge::before {
  2936. content: "";
  2937. }
  2938. .fa-drivers-license::before, .fa-id-card::before {
  2939. content: "";
  2940. }
  2941. .fa-drivers-license-o::before, .fa-id-card-o::before {
  2942. content: "";
  2943. }
  2944. .fa-quora::before {
  2945. content: "";
  2946. }
  2947. .fa-free-code-camp::before {
  2948. content: "";
  2949. }
  2950. .fa-telegram::before {
  2951. content: "";
  2952. }
  2953. .fa-thermometer-4::before, .fa-thermometer::before, .fa-thermometer-full::before {
  2954. content: "";
  2955. }
  2956. .fa-thermometer-3::before, .fa-thermometer-three-quarters::before {
  2957. content: "";
  2958. }
  2959. .fa-thermometer-2::before, .fa-thermometer-half::before {
  2960. content: "";
  2961. }
  2962. .fa-thermometer-1::before, .fa-thermometer-quarter::before {
  2963. content: "";
  2964. }
  2965. .fa-thermometer-0::before, .fa-thermometer-empty::before {
  2966. content: "";
  2967. }
  2968. .fa-shower::before {
  2969. content: "";
  2970. }
  2971. .fa-bathtub::before, .fa-s15::before, .fa-bath::before {
  2972. content: "";
  2973. }
  2974. .fa-podcast::before {
  2975. content: "";
  2976. }
  2977. .fa-window-maximize::before {
  2978. content: "";
  2979. }
  2980. .fa-window-minimize::before {
  2981. content: "";
  2982. }
  2983. .fa-window-restore::before {
  2984. content: "";
  2985. }
  2986. .fa-times-rectangle::before, .fa-window-close::before {
  2987. content: "";
  2988. }
  2989. .fa-times-rectangle-o::before, .fa-window-close-o::before {
  2990. content: "";
  2991. }
  2992. .fa-bandcamp::before {
  2993. content: "";
  2994. }
  2995. .fa-grav::before {
  2996. content: "";
  2997. }
  2998. .fa-etsy::before {
  2999. content: "";
  3000. }
  3001. .fa-imdb::before {
  3002. content: "";
  3003. }
  3004. .fa-ravelry::before {
  3005. content: "";
  3006. }
  3007. .fa-eercast::before {
  3008. content: "";
  3009. }
  3010. .fa-microchip::before {
  3011. content: "";
  3012. }
  3013. .fa-snowflake-o::before {
  3014. content: "";
  3015. }
  3016. .fa-superpowers::before {
  3017. content: "";
  3018. }
  3019. .fa-wpexplorer::before {
  3020. content: "";
  3021. }
  3022. .fa-meetup::before {
  3023. content: "";
  3024. }
  3025. .box {
  3026. box-sizing: border-box;
  3027. }
  3028. .boxImage img {
  3029. max-width: 100%;
  3030. }
  3031. .boxTitle {
  3032. font-weight: 400;
  3033. line-height: 1.28;
  3034. }
  3035. @media (min-width: 769px) {
  3036. .boxTitle {
  3037. font-size: 18px;
  3038. }
  3039. }
  3040. @media (max-width: 768px) {
  3041. .boxTitle {
  3042. font-size: 18px;
  3043. }
  3044. }
  3045. .boxTitle + .boxContent {
  3046. margin-top: 20px;
  3047. }
  3048. .boxTitle .badge {
  3049. top: -2px;
  3050. }
  3051. .boxContent + .boxContent {
  3052. margin-top: 20px;
  3053. }
  3054. .boxContent + .boxTitle {
  3055. margin-top: 30px;
  3056. }
  3057. .boxContentSeparator {
  3058. background: rgba(224, 224, 224, 1) none repeat scroll 0 0;
  3059. border: 0 none;
  3060. height: 1px;
  3061. margin: 30px auto;
  3062. width: 60%;
  3063. }
  3064. @media (max-width: 1024px) {
  3065. .boxesHero .boxContainer {
  3066. padding: 40px 0;
  3067. }
  3068. }
  3069. @media (min-width: 1025px) {
  3070. .boxesHero .boxContainer {
  3071. padding: 60px 0;
  3072. }
  3073. }
  3074. .boxesHero .box {
  3075. text-align: center;
  3076. }
  3077. @media (max-width: 1024px) {
  3078. .boxesHero .box:not(:last-child) {
  3079. margin-bottom: 40px;
  3080. }
  3081. }
  3082. @media (min-width: 1025px) {
  3083. .boxesHero .box:not(:last-child) {
  3084. margin-bottom: 60px;
  3085. }
  3086. }
  3087. .boxesHero .boxTitle {
  3088. font-weight: 300;
  3089. line-height: 1.05;
  3090. }
  3091. @media (min-width: 769px) {
  3092. .boxesHero .boxTitle {
  3093. font-size: 28px;
  3094. }
  3095. }
  3096. @media (max-width: 768px) {
  3097. .boxesHero .boxTitle {
  3098. font-size: 23px;
  3099. }
  3100. }
  3101. .boxesHero .boxWithImage {
  3102. display: flex;
  3103. flex-wrap: wrap;
  3104. }
  3105. .boxesHero .boxWithImage .boxImage, .boxesHero .boxWithImage .boxTitle, .boxesHero .boxWithImage .boxContent {
  3106. flex: 0 0 100%;
  3107. }
  3108. .boxesHero .boxWithImage .boxImage {
  3109. align-items: center;
  3110. display: flex;
  3111. justify-content: center;
  3112. max-height: 750px;
  3113. order: 3;
  3114. overflow: hidden;
  3115. }
  3116. @media (max-width: 1024px) {
  3117. .boxesHero .boxWithImage .boxImage {
  3118. margin-top: 20px;
  3119. }
  3120. }
  3121. @media (min-width: 1025px) {
  3122. .boxesHero .boxWithImage .boxImage {
  3123. margin-top: 30px;
  3124. }
  3125. }
  3126. .boxesHeaderBoxes {
  3127. background-color: rgba(236, 239, 241, 1);
  3128. color: rgba(44, 62, 80, 1);
  3129. }
  3130. .boxesHeaderBoxes a {
  3131. color: rgba(230, 81, 0, 1);
  3132. }
  3133. .boxesHeaderBoxes a:hover {
  3134. color: rgba(191, 54, 12, 1);
  3135. }
  3136. .boxesHeaderBoxes .icon {
  3137. color: rgba(44, 62, 80, 1);
  3138. }
  3139. @media (min-width: 545px) {
  3140. .boxesHeaderBoxes .boxContainer {
  3141. display: flex;
  3142. flex-wrap: wrap;
  3143. }
  3144. }
  3145. @media (max-width: 1024px) {
  3146. .boxesHeaderBoxes .boxContainer {
  3147. margin-bottom: -40px;
  3148. margin-left: -10px;
  3149. margin-right: -10px;
  3150. padding: 40px 0;
  3151. }
  3152. }
  3153. @media (min-width: 1025px) {
  3154. .boxesHeaderBoxes .boxContainer {
  3155. margin-bottom: -60px;
  3156. margin-left: -15px;
  3157. margin-right: -15px;
  3158. padding: 60px 0;
  3159. }
  3160. }
  3161. .boxesHeaderBoxes .box {
  3162. overflow: hidden;
  3163. padding-left: 15px;
  3164. padding-right: 15px;
  3165. }
  3166. @media (max-width: 1024px) {
  3167. .boxesHeaderBoxes .box {
  3168. margin-bottom: 40px;
  3169. }
  3170. }
  3171. @media (min-width: 545px) and (max-width: 1024px) {
  3172. .boxesHeaderBoxes .box {
  3173. flex: 0 0 50%;
  3174. max-width: 50%;
  3175. }
  3176. .boxesHeaderBoxes .box.boxFullWidth {
  3177. flex-basis: 100%;
  3178. max-width: 100%;
  3179. }
  3180. .boxesHeaderBoxes .box:first-child:nth-last-child(1) {
  3181. flex-basis: 100%;
  3182. max-width: 100%;
  3183. }
  3184. }
  3185. @media (min-width: 1025px) {
  3186. .boxesHeaderBoxes .box {
  3187. flex: 0 0 25%;
  3188. margin-bottom: 60px;
  3189. max-width: 25%;
  3190. }
  3191. .boxesHeaderBoxes .box.boxFullWidth {
  3192. flex-basis: 100%;
  3193. max-width: 100%;
  3194. }
  3195. .boxesHeaderBoxes .box:first-child:nth-last-child(1) {
  3196. flex-basis: 100%;
  3197. max-width: 100%;
  3198. }
  3199. .boxesHeaderBoxes .box:first-child:nth-last-child(2), .boxesHeaderBoxes .box:first-child:nth-last-child(2) ~ .box {
  3200. flex-basis: 50%;
  3201. max-width: 50%;
  3202. }
  3203. .boxesHeaderBoxes .box:first-child:nth-last-child(3), .boxesHeaderBoxes .box:first-child:nth-last-child(3) ~ .box {
  3204. flex-basis: 33.3333%;
  3205. max-width: 33.3333%;
  3206. }
  3207. }
  3208. .boxesHeaderBoxes .boxImage {
  3209. align-items: center;
  3210. display: flex;
  3211. justify-content: center;
  3212. margin-bottom: 20px;
  3213. max-height: 100px;
  3214. overflow: hidden;
  3215. }
  3216. @media (max-width: 1024px) {
  3217. .boxesTop .box, .boxesBottom .box {
  3218. margin-bottom: 40px;
  3219. margin-top: 40px;
  3220. }
  3221. }
  3222. @media (min-width: 1025px) {
  3223. .boxesTop .box, .boxesBottom .box {
  3224. margin-bottom: 60px;
  3225. margin-top: 60px;
  3226. }
  3227. }
  3228. .boxesTop .boxTitle, .boxesBottom .boxTitle {
  3229. color: rgba(44, 62, 80, 1);
  3230. font-weight: 300;
  3231. line-height: 1.28;
  3232. }
  3233. @media (min-width: 769px) {
  3234. .boxesTop .boxTitle, .boxesBottom .boxTitle {
  3235. font-size: 23px;
  3236. }
  3237. }
  3238. @media (max-width: 768px) {
  3239. .boxesTop .boxTitle, .boxesBottom .boxTitle {
  3240. font-size: 20px;
  3241. }
  3242. }
  3243. .boxesTop .boxTitle a, .boxesBottom .boxTitle a {
  3244. color: rgba(44, 62, 80, 1);
  3245. }
  3246. .boxesTop .boxTitle a:hover, .boxesBottom .boxTitle a:hover {
  3247. color: rgba(44, 62, 80, 1);
  3248. }
  3249. @media (max-width: 544px) {
  3250. .boxesTop .boxImage, .boxesBottom .boxImage {
  3251. align-items: center;
  3252. display: flex;
  3253. justify-content: center;
  3254. margin-bottom: 20px;
  3255. max-height: 100px;
  3256. overflow: hidden;
  3257. }
  3258. }
  3259. @media (min-width: 545px) {
  3260. .boxesTop .boxImage, .boxesBottom .boxImage {
  3261. width: 30%;
  3262. }
  3263. .boxesTop .boxWithImage::before, .boxesBottom .boxWithImage::before, .boxesTop .boxWithImage::after, .boxesBottom .boxWithImage::after {
  3264. content: "";
  3265. display: table;
  3266. }
  3267. .boxesTop .boxWithImage::after, .boxesBottom .boxWithImage::after {
  3268. clear: both;
  3269. }
  3270. .boxesTop .boxWithImage:nth-child(2n+1) .boxImage, .boxesBottom .boxWithImage:nth-child(2n+1) .boxImage {
  3271. float: left;
  3272. }
  3273. .boxesTop .boxWithImage:nth-child(2n) .boxImage, .boxesBottom .boxWithImage:nth-child(2n) .boxImage {
  3274. float: right;
  3275. }
  3276. }
  3277. @media (min-width: 545px) and (max-width: 1024px) {
  3278. .boxesTop .boxWithImage:nth-child(2n+1) .boxTitle, .boxesBottom .boxWithImage:nth-child(2n+1) .boxTitle, .boxesTop .boxWithImage:nth-child(2n+1) .boxContent, .boxesBottom .boxWithImage:nth-child(2n+1) .boxContent {
  3279. margin-left: calc(30% + 15px);
  3280. }
  3281. }
  3282. @media (min-width: 545px) and (min-width: 1025px) {
  3283. .boxesTop .boxWithImage:nth-child(2n+1) .boxTitle, .boxesBottom .boxWithImage:nth-child(2n+1) .boxTitle, .boxesTop .boxWithImage:nth-child(2n+1) .boxContent, .boxesBottom .boxWithImage:nth-child(2n+1) .boxContent {
  3284. margin-left: calc(30% + 30px);
  3285. }
  3286. }
  3287. @media (min-width: 545px) and (max-width: 1024px) {
  3288. .boxesTop .boxWithImage:nth-child(2n) .boxTitle, .boxesBottom .boxWithImage:nth-child(2n) .boxTitle, .boxesTop .boxWithImage:nth-child(2n) .boxContent, .boxesBottom .boxWithImage:nth-child(2n) .boxContent {
  3289. margin-right: calc(30% + 15px);
  3290. }
  3291. }
  3292. @media (min-width: 545px) and (min-width: 1025px) {
  3293. .boxesTop .boxWithImage:nth-child(2n) .boxTitle, .boxesBottom .boxWithImage:nth-child(2n) .boxTitle, .boxesTop .boxWithImage:nth-child(2n) .boxContent, .boxesBottom .boxWithImage:nth-child(2n) .boxContent {
  3294. margin-right: calc(30% + 30px);
  3295. }
  3296. }
  3297. .boxesTop {
  3298. border-bottom: 1px solid rgba(224, 224, 224, 1);
  3299. }
  3300. .boxesBottom {
  3301. border-top: 1px solid rgba(224, 224, 224, 1);
  3302. }
  3303. .boxesSidebarLeft, .boxesSidebarRight {
  3304. color: rgba(44, 62, 80, 1);
  3305. }
  3306. .boxesSidebarLeft a, .boxesSidebarRight a {
  3307. color: rgba(230, 81, 0, 1);
  3308. }
  3309. .boxesSidebarLeft a:hover, .boxesSidebarRight a:hover {
  3310. color: rgba(191, 54, 12, 1);
  3311. }
  3312. @media (min-width: 545px) and (max-width: 768px) {
  3313. .boxesSidebarLeft > .boxContainer, .boxesSidebarRight > .boxContainer {
  3314. -moz-columns: 2 auto;
  3315. }
  3316. }
  3317. @media (min-width: 769px) and (max-width: 1024px) {
  3318. .boxesSidebarLeft > .boxContainer, .boxesSidebarRight > .boxContainer {
  3319. -moz-columns: 3 auto;
  3320. }
  3321. }
  3322. @media (min-width: 545px) and (max-width: 1024px) {
  3323. .boxesSidebarLeft > .boxContainer, .boxesSidebarRight > .boxContainer {
  3324. -moz-column-gap: 30px;
  3325. margin-bottom: -30px;
  3326. }
  3327. .boxesSidebarLeft > .boxContainer > .box, .boxesSidebarRight > .boxContainer > .box {
  3328. background-clip: padding-box;
  3329. border-bottom: 30px solid transparent;
  3330. display: block;
  3331. margin: 0 !important;
  3332. overflow: hidden;
  3333. page-break-inside: avoid;
  3334. width: 100%;
  3335. }
  3336. }
  3337. .boxesSidebarLeft .icon, .boxesSidebarRight .icon {
  3338. color: rgba(44, 62, 80, 1);
  3339. }
  3340. .boxesSidebarLeft small, .boxesSidebarRight small, .boxesSidebarLeft .dimmed, .boxesSidebarRight .dimmed {
  3341. color: rgba(127, 140, 141, 1);
  3342. }
  3343. .boxesSidebarLeft small a, .boxesSidebarRight small a, .boxesSidebarLeft .dimmed a, .boxesSidebarRight .dimmed a {
  3344. color: rgba(44, 62, 80, 1);
  3345. }
  3346. .boxesSidebarLeft small a:hover, .boxesSidebarRight small a:hover, .boxesSidebarLeft .dimmed a:hover, .boxesSidebarRight .dimmed a:hover {
  3347. color: rgba(44, 62, 80, 1);
  3348. }
  3349. .boxesSidebarLeft .boxTitle, .boxesSidebarRight .boxTitle {
  3350. color: rgba(44, 62, 80, 1);
  3351. }
  3352. .boxesSidebarLeft .boxTitle a, .boxesSidebarRight .boxTitle a {
  3353. color: rgba(44, 62, 80, 1);
  3354. }
  3355. .boxesSidebarLeft .boxTitle a:hover, .boxesSidebarRight .boxTitle a:hover {
  3356. color: rgba(44, 62, 80, 1);
  3357. }
  3358. .boxesSidebarLeft .box:not(.boxBorderless), .boxesSidebarRight .box:not(.boxBorderless) {
  3359. background-color: rgba(236, 241, 247, 1);
  3360. }
  3361. @media (max-width: 1024px) {
  3362. .boxesSidebarLeft .box:not(.boxBorderless), .boxesSidebarRight .box:not(.boxBorderless) {
  3363. padding: 20px 10px;
  3364. }
  3365. .boxesSidebarLeft .box:not(.boxBorderless) .boxMenu, .boxesSidebarRight .box:not(.boxBorderless) .boxMenu {
  3366. margin-left: -10px;
  3367. margin-right: -10px;
  3368. }
  3369. }
  3370. @media (min-width: 1025px) {
  3371. .boxesSidebarLeft .box:not(.boxBorderless), .boxesSidebarRight .box:not(.boxBorderless) {
  3372. padding: 20px;
  3373. }
  3374. .boxesSidebarLeft .box:not(.boxBorderless) .boxMenu, .boxesSidebarRight .box:not(.boxBorderless) .boxMenu {
  3375. margin-left: -20px;
  3376. margin-right: -20px;
  3377. }
  3378. }
  3379. .boxesSidebarLeft .box:not(:first-child), .boxesSidebarRight .box:not(:first-child) {
  3380. margin-top: 30px;
  3381. }
  3382. .boxesSidebarLeft .box.boxError a:not(.button), .boxesSidebarRight .box.boxError a:not(.button), .boxesSidebarLeft .box.boxInfo a:not(.button), .boxesSidebarRight .box.boxInfo a:not(.button), .boxesSidebarLeft .box.boxSuccess a:not(.button), .boxesSidebarRight .box.boxSuccess a:not(.button), .boxesSidebarLeft .box.boxWarning a:not(.button), .boxesSidebarRight .box.boxWarning a:not(.button) {
  3383. font-weight: 600;
  3384. }
  3385. .boxesSidebarLeft .box.boxError a:hover:not(.button), .boxesSidebarRight .box.boxError a:hover:not(.button), .boxesSidebarLeft .box.boxInfo a:hover:not(.button), .boxesSidebarRight .box.boxInfo a:hover:not(.button), .boxesSidebarLeft .box.boxSuccess a:hover:not(.button), .boxesSidebarRight .box.boxSuccess a:hover:not(.button), .boxesSidebarLeft .box.boxWarning a:hover:not(.button), .boxesSidebarRight .box.boxWarning a:hover:not(.button) {
  3386. text-decoration: underline;
  3387. }
  3388. .boxesSidebarLeft .box.boxError, .boxesSidebarRight .box.boxError {
  3389. background-color: rgba(242, 222, 222, 1);
  3390. color: rgba(169, 68, 66, 1);
  3391. }
  3392. .boxesSidebarLeft .box.boxError a:not(.button), .boxesSidebarRight .box.boxError a:not(.button) {
  3393. color: rgba(169, 68, 66, 1);
  3394. }
  3395. .boxesSidebarLeft .box.boxError a:hover:not(.button), .boxesSidebarRight .box.boxError a:hover:not(.button) {
  3396. color: rgba(169, 68, 66, 1);
  3397. }
  3398. .boxesSidebarLeft .box.boxInfo, .boxesSidebarRight .box.boxInfo {
  3399. background-color: rgba(217, 237, 247, 1);
  3400. color: rgba(49, 112, 143, 1);
  3401. }
  3402. .boxesSidebarLeft .box.boxInfo a:not(.button), .boxesSidebarRight .box.boxInfo a:not(.button) {
  3403. color: rgba(49, 112, 143, 1);
  3404. }
  3405. .boxesSidebarLeft .box.boxInfo a:hover:not(.button), .boxesSidebarRight .box.boxInfo a:hover:not(.button) {
  3406. color: rgba(49, 112, 143, 1);
  3407. }
  3408. .boxesSidebarLeft .box.boxSuccess, .boxesSidebarRight .box.boxSuccess {
  3409. background-color: rgba(223, 240, 216, 1);
  3410. color: rgba(60, 118, 61, 1);
  3411. }
  3412. .boxesSidebarLeft .box.boxSuccess a:not(.button), .boxesSidebarRight .box.boxSuccess a:not(.button) {
  3413. color: rgba(60, 118, 61, 1);
  3414. }
  3415. .boxesSidebarLeft .box.boxSuccess a:hover:not(.button), .boxesSidebarRight .box.boxSuccess a:hover:not(.button) {
  3416. color: rgba(60, 118, 61, 1);
  3417. }
  3418. .boxesSidebarLeft .box.boxWarning, .boxesSidebarRight .box.boxWarning {
  3419. background-color: rgba(252, 248, 227, 1);
  3420. color: rgba(138, 109, 59, 1);
  3421. }
  3422. .boxesSidebarLeft .box.boxWarning a:not(.button), .boxesSidebarRight .box.boxWarning a:not(.button) {
  3423. color: rgba(138, 109, 59, 1);
  3424. }
  3425. .boxesSidebarLeft .box.boxWarning a:hover:not(.button), .boxesSidebarRight .box.boxWarning a:hover:not(.button) {
  3426. color: rgba(138, 109, 59, 1);
  3427. }
  3428. .boxesSidebarLeft .box .boxMenu .boxMenuLink, .boxesSidebarRight .box .boxMenu .boxMenuLink {
  3429. align-items: flex-start;
  3430. display: flex;
  3431. padding: 5px 20px;
  3432. }
  3433. .boxesSidebarLeft .box .boxMenu .boxMenuLink .boxMenuLinkTitle, .boxesSidebarRight .box .boxMenu .boxMenuLink .boxMenuLinkTitle {
  3434. flex: 1 1 auto;
  3435. }
  3436. .boxesSidebarLeft .box .boxMenu .boxMenuLink .badge, .boxesSidebarRight .box .boxMenu .boxMenuLink .badge {
  3437. flex: 0 0 auto;
  3438. }
  3439. .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink, .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink {
  3440. background-color: rgba(250, 250, 250, 1);
  3441. }
  3442. .boxesSidebarLeft .box .boxMenu .boxMenuDepth1 .boxMenuLink, .boxesSidebarRight .box .boxMenu .boxMenuDepth1 .boxMenuLink {
  3443. padding-left: 40px;
  3444. }
  3445. .boxesSidebarLeft .box .boxMenu .boxMenuDepth2 .boxMenuLink, .boxesSidebarRight .box .boxMenu .boxMenuDepth2 .boxMenuLink {
  3446. padding-left: 60px;
  3447. }
  3448. @media (max-width: 1024px) {
  3449. .boxesSidebarLeft .box .boxMenu, .boxesSidebarRight .box .boxMenu {
  3450. position: relative;
  3451. }
  3452. .boxesSidebarLeft .box .boxMenu .boxMenuLink, .boxesSidebarRight .box .boxMenu .boxMenuLink, .boxesSidebarLeft .box .boxMenu .boxMenuLinkTitle, .boxesSidebarRight .box .boxMenu .boxMenuLinkTitle {
  3453. overflow: hidden;
  3454. text-overflow: ellipsis;
  3455. white-space: nowrap;
  3456. }
  3457. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) {
  3458. pointer-events: none;
  3459. }
  3460. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child > a::after, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) > a::after {
  3461. content: "";
  3462. font-family: FontAwesome;
  3463. font-size: 14px;
  3464. margin-left: 7px;
  3465. }
  3466. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 {
  3467. position: relative;
  3468. }
  3469. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li:not(.active), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li:not(.active), .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li:not(.active), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li:not(.active), .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li:not(.active), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li:not(.active), .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li:not(.active), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li:not(.active) {
  3470. display: none;
  3471. }
  3472. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li.active, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li.active, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li.active, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li.active, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li.active, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li.active, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li.active, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li.active {
  3473. left: 0;
  3474. position: absolute;
  3475. right: 0;
  3476. top: 0;
  3477. transform: translateY(-100%);
  3478. }
  3479. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li.active > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth1 > li.active > a::after, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li.active > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth1 > li.active > a::after, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li.active > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child .boxMenuDepth2 > li.active > a::after, .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li.active > a::after, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) .boxMenuDepth2 > li.active > a::after {
  3480. content: "";
  3481. font-family: FontAwesome;
  3482. font-size: 14px;
  3483. margin-left: 7px;
  3484. }
  3485. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li:first-child ~ li, .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li:first-child ~ li {
  3486. display: none;
  3487. }
  3488. .boxesSidebarLeft .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child), .boxesSidebarRight .box .boxMenu:not(.open):not(.forceOpen) > li.active:not(:first-child) {
  3489. display: block;
  3490. left: 0;
  3491. position: absolute;
  3492. right: 0;
  3493. top: 0;
  3494. }
  3495. }
  3496. @media (max-width: 544px) {
  3497. .boxesSidebarLeft .boxImage, .boxesSidebarRight .boxImage {
  3498. align-items: center;
  3499. display: flex;
  3500. justify-content: center;
  3501. margin-bottom: 20px;
  3502. max-height: 100px;
  3503. overflow: hidden;
  3504. }
  3505. }
  3506. @media (min-width: 545px) and (max-width: 1024px) {
  3507. .boxesSidebarLeft .boxWithImage::before, .boxesSidebarRight .boxWithImage::before, .boxesSidebarLeft .boxWithImage::after, .boxesSidebarRight .boxWithImage::after {
  3508. content: "";
  3509. display: table;
  3510. }
  3511. .boxesSidebarLeft .boxWithImage::after, .boxesSidebarRight .boxWithImage::after {
  3512. clear: both;
  3513. }
  3514. .boxesSidebarLeft .boxWithImage .boxTitle, .boxesSidebarRight .boxWithImage .boxTitle, .boxesSidebarLeft .boxWithImage .boxContent, .boxesSidebarRight .boxWithImage .boxContent {
  3515. margin-left: calc(30% + 15px);
  3516. }
  3517. .boxesSidebarLeft .boxImage, .boxesSidebarRight .boxImage {
  3518. float: left;
  3519. width: 30%;
  3520. }
  3521. }
  3522. @media (min-width: 1025px) {
  3523. .boxesSidebarLeft .boxImage, .boxesSidebarRight .boxImage {
  3524. align-items: center;
  3525. display: flex;
  3526. justify-content: center;
  3527. margin-bottom: 20px;
  3528. max-height: 100px;
  3529. overflow: hidden;
  3530. }
  3531. }
  3532. .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink {
  3533. margin-left: 10px;
  3534. padding-left: 10px;
  3535. }
  3536. .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink {
  3537. margin-right: 10px;
  3538. padding-right: 10px;
  3539. }
  3540. .boxesContentTop .box:not(:first-child), .boxesContentBottom .box:not(:first-child) {
  3541. margin-top: 40px;
  3542. }
  3543. .boxesContentTop .boxTitle, .boxesContentBottom .boxTitle {
  3544. color: rgba(44, 62, 80, 1);
  3545. font-weight: 300;
  3546. line-height: 1.28;
  3547. }
  3548. @media (min-width: 769px) {
  3549. .boxesContentTop .boxTitle, .boxesContentBottom .boxTitle {
  3550. font-size: 23px;
  3551. }
  3552. }
  3553. @media (max-width: 768px) {
  3554. .boxesContentTop .boxTitle, .boxesContentBottom .boxTitle {
  3555. font-size: 20px;
  3556. }
  3557. }
  3558. .boxesContentTop .boxTitle a, .boxesContentBottom .boxTitle a {
  3559. color: rgba(44, 62, 80, 1);
  3560. }
  3561. .boxesContentTop .boxTitle a:hover, .boxesContentBottom .boxTitle a:hover {
  3562. color: rgba(44, 62, 80, 1);
  3563. }
  3564. @media (max-width: 544px) {
  3565. .boxesContentTop .boxImage, .boxesContentBottom .boxImage {
  3566. align-items: center;
  3567. display: flex;
  3568. justify-content: center;
  3569. margin-bottom: 20px;
  3570. max-height: 100px;
  3571. overflow: hidden;
  3572. }
  3573. }
  3574. @media (min-width: 545px) {
  3575. .boxesContentTop .boxWithImage::before, .boxesContentBottom .boxWithImage::before, .boxesContentTop .boxWithImage::after, .boxesContentBottom .boxWithImage::after {
  3576. content: "";
  3577. display: table;
  3578. }
  3579. .boxesContentTop .boxWithImage::after, .boxesContentBottom .boxWithImage::after {
  3580. clear: both;
  3581. }
  3582. .boxesContentTop .boxImage, .boxesContentBottom .boxImage {
  3583. float: left;
  3584. width: 30%;
  3585. }
  3586. }
  3587. @media (min-width: 545px) and (max-width: 1024px) {
  3588. .boxesContentTop .boxWithImage .boxTitle, .boxesContentBottom .boxWithImage .boxTitle, .boxesContentTop .boxWithImage .boxContent, .boxesContentBottom .boxWithImage .boxContent {
  3589. margin-left: calc(30% + 15px);
  3590. }
  3591. }
  3592. @media (min-width: 545px) and (min-width: 1025px) {
  3593. .boxesContentTop .boxWithImage .boxTitle, .boxesContentBottom .boxWithImage .boxTitle, .boxesContentTop .boxWithImage .boxContent, .boxesContentBottom .boxWithImage .boxContent {
  3594. margin-left: calc(30% + 30px);
  3595. }
  3596. }
  3597. .boxesContentTop:not(:first-child) {
  3598. margin-top: 40px;
  3599. }
  3600. .boxesContentBottom {
  3601. margin-top: 40px;
  3602. }
  3603. .boxesFooterBoxes {
  3604. background-color: rgba(236, 239, 241, 1);
  3605. color: rgba(44, 62, 80, 1);
  3606. }
  3607. .boxesFooterBoxes a {
  3608. color: rgba(230, 81, 0, 1);
  3609. }
  3610. .boxesFooterBoxes a:hover {
  3611. color: rgba(191, 54, 12, 1);
  3612. }
  3613. .boxesFooterBoxes .icon {
  3614. color: rgba(44, 62, 80, 1);
  3615. }
  3616. @media (max-width: 768px) {
  3617. .boxesFooterBoxes .boxContainer {
  3618. padding: 40px 0;
  3619. }
  3620. }
  3621. @media (max-width: 1024px) {
  3622. .boxesFooterBoxes .boxContainer {
  3623. margin-left: -10px;
  3624. margin-right: -10px;
  3625. }
  3626. }
  3627. @media (min-width: 769px) {
  3628. .boxesFooterBoxes .boxContainer {
  3629. display: flex;
  3630. flex-wrap: wrap;
  3631. margin-bottom: -60px;
  3632. padding: 60px 0;
  3633. }
  3634. }
  3635. @media (min-width: 1025px) {
  3636. .boxesFooterBoxes .boxContainer {
  3637. margin-left: -15px;
  3638. margin-right: -15px;
  3639. }
  3640. }
  3641. .boxesFooterBoxes .box {
  3642. overflow: hidden;
  3643. padding-left: 15px;
  3644. padding-right: 15px;
  3645. }
  3646. @media (max-width: 768px) {
  3647. .boxesFooterBoxes .box:not(:last-child) {
  3648. margin-bottom: 40px;
  3649. }
  3650. }
  3651. @media (min-width: 769px) {
  3652. .boxesFooterBoxes .box {
  3653. flex: 0 0 50%;
  3654. margin-bottom: 60px;
  3655. max-width: 50%;
  3656. }
  3657. .boxesFooterBoxes .box.boxFullWidth {
  3658. flex-basis: 100%;
  3659. max-width: 100%;
  3660. }
  3661. }
  3662. .boxesFooterBoxes .boxTitle {
  3663. color: rgba(44, 62, 80, 1);
  3664. }
  3665. .boxesFooterBoxes .boxTitle a {
  3666. color: rgba(44, 62, 80, 1);
  3667. }
  3668. .boxesFooterBoxes .boxTitle a:hover {
  3669. color: rgba(44, 62, 80, 1);
  3670. }
  3671. .boxesFooterBoxes .boxImage {
  3672. align-items: center;
  3673. display: flex;
  3674. justify-content: center;
  3675. margin-bottom: 20px;
  3676. max-height: 100px;
  3677. overflow: hidden;
  3678. }
  3679. .boxesFooter {
  3680. background-color: rgba(58, 109, 156, 1);
  3681. color: rgba(217, 220, 222, 1);
  3682. padding: 20px 0;
  3683. }
  3684. .boxesFooter .icon {
  3685. color: rgba(217, 220, 222, 1);
  3686. }
  3687. .boxesFooter a {
  3688. color: rgba(255, 255, 255, 1);
  3689. }
  3690. .boxesFooter a:hover {
  3691. color: rgba(255, 255, 255, 1);
  3692. text-decoration: underline;
  3693. }
  3694. .boxesFooter .box:not(:first-child) {
  3695. margin-top: 20px;
  3696. }
  3697. .boxesFooter .boxTitle {
  3698. color: rgba(189, 195, 199, 1);
  3699. }
  3700. .boxesFooter .boxTitle a {
  3701. color: rgba(255, 255, 255, 1);
  3702. }
  3703. .boxesFooter .boxTitle a:hover {
  3704. color: rgba(255, 255, 255, 1);
  3705. }
  3706. @media (max-width: 544px) {
  3707. .boxesFooter .boxImage {
  3708. align-items: center;
  3709. display: flex;
  3710. justify-content: center;
  3711. margin-bottom: 20px;
  3712. max-height: 100px;
  3713. overflow: hidden;
  3714. }
  3715. }
  3716. @media (min-width: 545px) {
  3717. .boxesFooter .boxWithImage::before, .boxesFooter .boxWithImage::after {
  3718. content: "";
  3719. display: table;
  3720. }
  3721. .boxesFooter .boxWithImage::after {
  3722. clear: both;
  3723. }
  3724. .boxesFooter .boxImage {
  3725. float: left;
  3726. width: 30%;
  3727. }
  3728. }
  3729. @media (min-width: 545px) and (max-width: 1024px) {
  3730. .boxesFooter .boxWithImage .boxTitle, .boxesFooter .boxWithImage .boxContent {
  3731. margin-left: calc(30% + 15px);
  3732. }
  3733. }
  3734. @media (min-width: 545px) and (min-width: 1025px) {
  3735. .boxesFooter .boxWithImage .boxTitle, .boxesFooter .boxWithImage .boxContent {
  3736. margin-left: calc(30% + 30px);
  3737. }
  3738. }
  3739. .boxesFooter .boxMenuLinkGroup .boxMenu > li > ol a {
  3740. color: rgba(217, 220, 222, 1);
  3741. }
  3742. @media (max-width: 768px) {
  3743. .boxesFooter .styleChanger {
  3744. display: none;
  3745. }
  3746. }
  3747. @media (min-width: 769px) {
  3748. .boxesFooter .styleChanger {
  3749. float: right;
  3750. padding-left: 20px;
  3751. }
  3752. }
  3753. .boxesTop .boxMenu, .boxesBottom .boxMenu, .boxesFooter .boxMenu {
  3754. display: inline-flex;
  3755. flex-wrap: wrap;
  3756. margin-left: -10px;
  3757. margin-right: -10px;
  3758. }
  3759. .boxesTop .boxMenu > li, .boxesBottom .boxMenu > li, .boxesFooter .boxMenu > li {
  3760. flex: 0 0 auto;
  3761. padding-left: 10px;
  3762. padding-right: 10px;
  3763. }
  3764. .boxesTop .boxMenuLinkGroup:not(:first-child), .boxesBottom .boxMenuLinkGroup:not(:first-child), .boxesFooter .boxMenuLinkGroup:not(:first-child) {
  3765. margin-top: 40px;
  3766. }
  3767. .boxesTop .boxMenuLinkGroup .boxMenu, .boxesBottom .boxMenuLinkGroup .boxMenu, .boxesFooter .boxMenuLinkGroup .boxMenu {
  3768. display: flex;
  3769. flex-wrap: wrap;
  3770. margin-bottom: -20px;
  3771. }
  3772. .boxesTop .boxMenuLinkGroup .boxMenu .boxMenuLink, .boxesBottom .boxMenuLinkGroup .boxMenu .boxMenuLink, .boxesFooter .boxMenuLinkGroup .boxMenu .boxMenuLink {
  3773. display: inline-block;
  3774. }
  3775. .boxesTop .boxMenuLinkGroup .boxMenu > li, .boxesBottom .boxMenuLinkGroup .boxMenu > li, .boxesFooter .boxMenuLinkGroup .boxMenu > li {
  3776. margin-bottom: 20px;
  3777. }
  3778. @media (min-width: 769px) {
  3779. .boxesTop .boxMenuLinkGroup .boxMenu > li, .boxesBottom .boxMenuLinkGroup .boxMenu > li, .boxesFooter .boxMenuLinkGroup .boxMenu > li {
  3780. flex: 0 0 25%;
  3781. max-width: 25%;
  3782. }
  3783. }
  3784. @media (max-width: 768px) {
  3785. .boxesTop .boxMenuLinkGroup .boxMenu > li, .boxesBottom .boxMenuLinkGroup .boxMenu > li, .boxesFooter .boxMenuLinkGroup .boxMenu > li {
  3786. flex: 1 1 100%;
  3787. }
  3788. }
  3789. .boxesTop .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesBottom .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesFooter .boxMenuLinkGroup .boxMenu > li > .boxMenuLink {
  3790. font-weight: 400;
  3791. line-height: 1.28;
  3792. margin-bottom: 10px;
  3793. }
  3794. @media (min-width: 769px) {
  3795. .boxesTop .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesBottom .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesFooter .boxMenuLinkGroup .boxMenu > li > .boxMenuLink {
  3796. font-size: 18px;
  3797. }
  3798. }
  3799. @media (max-width: 768px) {
  3800. .boxesTop .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesBottom .boxMenuLinkGroup .boxMenu > li > .boxMenuLink, .boxesFooter .boxMenuLinkGroup .boxMenu > li > .boxMenuLink {
  3801. font-size: 18px;
  3802. }
  3803. }
  3804. .containerList > li {
  3805. position: relative;
  3806. transition: background-color 0.2s ease 0s;
  3807. }
  3808. @media (max-width: 1024px) {
  3809. .containerList > li {
  3810. padding: 10px 0;
  3811. }
  3812. }
  3813. @media (min-width: 1025px) {
  3814. .containerList > li {
  3815. padding: 20px;
  3816. }
  3817. }
  3818. .containerList > li:not(:last-child) {
  3819. border-bottom: 1px solid rgba(224, 224, 224, 1);
  3820. }
  3821. .containerList > li:first-child {
  3822. border-top: 1px solid rgba(65, 121, 173, 1);
  3823. }
  3824. .containerList > li:last-child {
  3825. border-bottom: 1px solid rgba(65, 121, 173, 1);
  3826. }
  3827. .containerList > li:hover {
  3828. background-color: rgba(242, 242, 242, 1);
  3829. }
  3830. .containerList > li.showMore {
  3831. text-align: center;
  3832. }
  3833. .containerList > li.showMore:hover {
  3834. background-color: transparent;
  3835. }
  3836. .containerList > li .containerHeadline {
  3837. position: relative;
  3838. }
  3839. .containerList > li .containerHeadline > .containerContentType {
  3840. color: rgba(125, 130, 135, 1);
  3841. position: absolute;
  3842. right: 0;
  3843. top: 5px;
  3844. }
  3845. @media (max-width: 544px) {
  3846. .containerList > li .containerHeadline > .containerContentType {
  3847. display: none;
  3848. }
  3849. }
  3850. .containerList > li.containerListButtonGroup {
  3851. text-align: right;
  3852. }
  3853. .containerList > li.containerListButtonGroup:hover {
  3854. background-color: transparent;
  3855. }
  3856. .containerList > li.containerListButtonGroup > .buttonGroup, .containerList > li.containerListButtonGroup > .messageFooterButtons {
  3857. display: inline-flex;
  3858. }
  3859. .containerList > li.containerListButtonGroup > .buttonGroup:not(:first-child), .containerList > li.containerListButtonGroup > .messageFooterButtons:not(:first-child) {
  3860. margin-left: 5px;
  3861. }
  3862. @media (max-width: 1024px) {
  3863. .containerList > li .hasMobileNavigation > .containerHeadline > h3 {
  3864. padding-right: 30px;
  3865. }
  3866. .containerList > li .buttonGroupNavigation {
  3867. position: absolute;
  3868. right: 0;
  3869. top: 14px;
  3870. }
  3871. .containerList > li .buttonGroupNavigation.open {
  3872. left: 0;
  3873. z-index: 10;
  3874. }
  3875. .containerList > li .buttonGroupNavigation.open > .buttonList {
  3876. display: block;
  3877. visibility: visible;
  3878. }
  3879. .containerList > li .buttonGroupNavigation > .dropdownLabel {
  3880. left: calc(100% - 24px);
  3881. position: relative;
  3882. }
  3883. .containerList > li .buttonGroupNavigation > .buttonList {
  3884. background-color: rgba(255, 255, 255, 1);
  3885. border-radius: 2px;
  3886. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  3887. color: rgba(33, 33, 33, 1);
  3888. display: none;
  3889. min-width: 160px;
  3890. padding: 3px 0;
  3891. pointer-events: all;
  3892. position: static !important;
  3893. text-align: left;
  3894. top: 0;
  3895. visibility: hidden;
  3896. z-index: 450;
  3897. }
  3898. .containerList > li .buttonGroupNavigation > .buttonList.dropdownMenuPageSearch {
  3899. border-top-left-radius: 0;
  3900. border-top-right-radius: 0;
  3901. }
  3902. .containerList > li .buttonGroupNavigation > .buttonList.dropdownOpen {
  3903. display: block;
  3904. visibility: visible;
  3905. }
  3906. .containerList > li .buttonGroupNavigation > .buttonList li {
  3907. display: block;
  3908. }
  3909. .containerList > li .buttonGroupNavigation > .buttonList li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText), .containerList > li .buttonGroupNavigation > .buttonList li.dropdownList > li:hover:not(.dropdownDivider), .containerList > li .buttonGroupNavigation > .buttonList li.dropdownNavigationItem, .containerList > li .buttonGroupNavigation > .buttonList li.active {
  3910. background-color: rgba(238, 238, 238, 1);
  3911. color: rgba(33, 33, 33, 1);
  3912. }
  3913. .containerList > li .buttonGroupNavigation > .buttonList li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText) > a, .containerList > li .buttonGroupNavigation > .buttonList li.dropdownList > li:hover:not(.dropdownDivider) > a, .containerList > li .buttonGroupNavigation > .buttonList li.dropdownNavigationItem > a, .containerList > li .buttonGroupNavigation > .buttonList li.active > a {
  3914. color: rgba(33, 33, 33, 1);
  3915. }
  3916. .containerList > li .buttonGroupNavigation > .buttonList li.dropdownDivider {
  3917. border-top: 1px solid rgba(238, 238, 238, 1);
  3918. margin: 3px 0;
  3919. }
  3920. .containerList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  3921. font-weight: 400;
  3922. padding: 5px 20px;
  3923. }
  3924. .containerList > li .buttonGroupNavigation > .buttonList li.boxFlag {
  3925. padding-top: 2px;
  3926. }
  3927. .containerList > li .buttonGroupNavigation > .buttonList li.missingValue > span {
  3928. padding-right: 40px;
  3929. position: relative;
  3930. }
  3931. .containerList > li .buttonGroupNavigation > .buttonList li.missingValue > span::after {
  3932. color: rgba(169, 68, 66, 1);
  3933. content: "";
  3934. font-family: FontAwesome;
  3935. position: absolute;
  3936. right: 20px;
  3937. top: 5px;
  3938. }
  3939. .containerList > li .buttonGroupNavigation > .buttonList li > a, .containerList > li .buttonGroupNavigation > .buttonList li > span {
  3940. clear: both;
  3941. cursor: pointer;
  3942. display: block;
  3943. max-width: 350px;
  3944. overflow: hidden;
  3945. overflow-wrap: normal;
  3946. padding: 5px 20px;
  3947. text-decoration: none;
  3948. text-overflow: ellipsis;
  3949. white-space: nowrap;
  3950. }
  3951. .containerList > li .buttonGroupNavigation > .buttonList li > a > div > h3, .containerList > li .buttonGroupNavigation > .buttonList li > span > div > h3 {
  3952. overflow: hidden;
  3953. text-overflow: ellipsis;
  3954. }
  3955. .containerList > li .buttonGroupNavigation > .buttonList li > a {
  3956. color: rgba(33, 33, 33, 1);
  3957. }
  3958. .containerList > li .buttonGroupNavigation > .buttonList li > a > small {
  3959. display: block;
  3960. }
  3961. .containerList > li .buttonGroupNavigation > .buttonList li > a + span.badge {
  3962. display: none;
  3963. }
  3964. .containerList > li .buttonGroupNavigation > .buttonList li > .box16 {
  3965. align-items: center;
  3966. cursor: pointer;
  3967. min-height: 0;
  3968. padding: 5px 10px;
  3969. }
  3970. .containerList > li .buttonGroupNavigation > .buttonList li > label {
  3971. display: block;
  3972. }
  3973. .containerList > li .buttonGroupNavigation > .buttonList li .containerHeadline {
  3974. margin-bottom: 0;
  3975. }
  3976. .containerList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  3977. font-weight: 400;
  3978. }
  3979. .containerList > li .buttonGroupNavigation > .buttonList li .icon {
  3980. color: inherit;
  3981. }
  3982. .containerList > li .buttonGroupNavigation > .buttonList .scrollableDropdownMenu {
  3983. max-height: 300px;
  3984. overflow: auto;
  3985. }
  3986. .containerList > li .buttonGroupNavigation > .buttonList .scrollableDropdownMenu.forceScrollbar {
  3987. overflow-x: hidden;
  3988. overflow-y: scroll;
  3989. }
  3990. .containerList > li .buttonGroupNavigation > .buttonList > li .invisible {
  3991. display: inline;
  3992. padding-left: 5px;
  3993. }
  3994. }
  3995. @media (max-width: 1024px) and (min-width: 769px) {
  3996. .containerList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  3997. font-size: 12px;
  3998. }
  3999. }
  4000. @media (max-width: 1024px) and (max-width: 768px) {
  4001. .containerList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  4002. font-size: 12px;
  4003. }
  4004. }
  4005. @media (max-width: 1024px) and (min-width: 769px) {
  4006. .containerList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  4007. font-size: 12px;
  4008. }
  4009. }
  4010. @media (max-width: 1024px) and (max-width: 768px) {
  4011. .containerList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  4012. font-size: 12px;
  4013. }
  4014. }
  4015. @media (max-width: 1024px) and (max-width: 544px) {
  4016. .containerList > li .buttonGroupNavigation > .buttonList {
  4017. left: 0 !important;
  4018. right: 0 !important;
  4019. }
  4020. }
  4021. @media (max-width: 1024px) and (max-width: 1024px) {
  4022. .containerList > li .buttonGroupNavigation > .buttonList li {
  4023. overflow: hidden;
  4024. }
  4025. .containerList > li .buttonGroupNavigation > .buttonList li > a, .containerList > li .buttonGroupNavigation > .buttonList li > span {
  4026. max-width: none;
  4027. white-space: normal;
  4028. }
  4029. }
  4030. @media (max-width: 1024px) and (min-width: 769px) {
  4031. .containerList > li .buttonGroupNavigation > .buttonList .dropdownMenu.pageHeaderSearchDropdown {
  4032. transform: translateY(-10px);
  4033. }
  4034. }
  4035. @media (min-width: 1025px) {
  4036. .containerList > li .buttonGroupNavigation {
  4037. opacity: 0;
  4038. position: absolute;
  4039. right: 20px;
  4040. top: 15px;
  4041. transition: opacity 0.12s ease 0s;
  4042. }
  4043. .containerList > li .buttonGroupNavigation > .dropdownLabel {
  4044. display: none;
  4045. }
  4046. .containerList > li .buttonGroupNavigation > ul {
  4047. background-color: rgba(250, 250, 250, 1);
  4048. border: 1px solid rgba(0, 0, 0, 0.15);
  4049. border-radius: 6px;
  4050. }
  4051. .containerList > li .buttonGroupNavigation > ul > li {
  4052. margin-right: 0;
  4053. }
  4054. .containerList > li .buttonGroupNavigation > ul > li:not(:last-child) {
  4055. border-right: 1px solid rgba(0, 0, 0, 0.15);
  4056. }
  4057. .containerList > li .buttonGroupNavigation > ul > li > a {
  4058. display: inline-block;
  4059. padding: 3px 5px;
  4060. }
  4061. .containerList > li .buttonGroupNavigation > ul > li > a > .icon {
  4062. color: rgba(0, 0, 0, 0.5);
  4063. }
  4064. .containerList > li .buttonGroupNavigation > ul > li.active > a > .icon, .containerList > li .buttonGroupNavigation > ul > li:hover > a > .icon {
  4065. color: rgba(44, 62, 80, 1);
  4066. }
  4067. .containerList > li:hover .buttonGroupNavigation {
  4068. opacity: 1;
  4069. }
  4070. }
  4071. @media (max-width: 768px) {
  4072. .containerBoxList.doubleColumned > li + li, .containerBoxList.tripleColumned > li + li {
  4073. margin-top: 10px;
  4074. }
  4075. }
  4076. @media (min-width: 769px) {
  4077. .containerBoxList.doubleColumned, .containerBoxList.tripleColumned {
  4078. display: flex;
  4079. flex-wrap: wrap;
  4080. margin-bottom: -15px;
  4081. }
  4082. .containerBoxList.doubleColumned > li, .containerBoxList.tripleColumned > li {
  4083. margin-bottom: 15px;
  4084. overflow: hidden;
  4085. padding-right: 15px;
  4086. }
  4087. .containerBoxList.doubleColumned > li .containerBoxContent, .containerBoxList.tripleColumned > li .containerBoxContent {
  4088. overflow: hidden;
  4089. }
  4090. .containerBoxList.doubleColumned > li .containerBoxContent h3, .containerBoxList.tripleColumned > li .containerBoxContent h3 {
  4091. overflow: hidden;
  4092. text-overflow: ellipsis;
  4093. white-space: nowrap;
  4094. }
  4095. .containerBoxList.doubleColumned > li {
  4096. flex: 0 0 50%;
  4097. max-width: 50%;
  4098. }
  4099. .containerBoxList.tripleColumned > li {
  4100. flex: 0 0 calc(100% / 3);
  4101. width: calc(100% / 3);
  4102. }
  4103. }
  4104. .recentActivityList .box48 {
  4105. max-height: 500px;
  4106. overflow: hidden;
  4107. }
  4108. .flexibleCategoryList {
  4109. position: relative;
  4110. }
  4111. .flexibleCategoryList > li {
  4112. margin-bottom: 14px;
  4113. }
  4114. .flexibleCategoryList > li > ol {
  4115. margin-left: 21px;
  4116. }
  4117. .flexibleCategoryList > li > ol > li > ol {
  4118. margin-bottom: 7px;
  4119. margin-left: 21px;
  4120. }
  4121. .flexibleCategoryList > li > ol > li > ol > li {
  4122. font-size: 12px;
  4123. }
  4124. @media (min-width: 769px) {
  4125. .flexibleCategoryList:not(.flexibleCategoryListDisabled) {
  4126. -moz-column-count: 2;
  4127. }
  4128. .flexibleCategoryList:not(.flexibleCategoryListDisabled) > li {
  4129. }
  4130. .flexibleCategoryList:not(.flexibleCategoryListDisabled) > li > ol > li > ol {
  4131. font-size: 0;
  4132. }
  4133. .flexibleCategoryList:not(.flexibleCategoryListDisabled) > li > ol > li > ol > li {
  4134. display: inline-block;
  4135. }
  4136. @-moz-document url-prefix("") {
  4137. .flexibleCategoryList:not(.flexibleCategoryListDisabled) > li {
  4138. display: block;
  4139. overflow: hidden;
  4140. }
  4141. }
  4142. }
  4143. @media (max-width: 1024px) {
  4144. .styleList > li {
  4145. padding: 10px;
  4146. }
  4147. }
  4148. .contentHeader, .boxHeadline {
  4149. color: rgba(44, 62, 80, 1);
  4150. }
  4151. .contentHeader .contentTitle, .boxHeadline .contentTitle, .contentHeader > h1, .boxHeadline > h1 {
  4152. font-weight: 300;
  4153. line-height: 1.05;
  4154. }
  4155. @media (min-width: 769px) {
  4156. .contentHeader .contentTitle, .boxHeadline .contentTitle, .contentHeader > h1, .boxHeadline > h1 {
  4157. font-size: 28px;
  4158. }
  4159. }
  4160. @media (max-width: 768px) {
  4161. .contentHeader .contentTitle, .boxHeadline .contentTitle, .contentHeader > h1, .boxHeadline > h1 {
  4162. font-size: 23px;
  4163. }
  4164. }
  4165. .contentHeader .contentTitle .badge, .boxHeadline .contentTitle .badge, .contentHeader > h1 .badge, .boxHeadline > h1 .badge {
  4166. line-height: 1.48;
  4167. top: -2px;
  4168. }
  4169. .contentHeader .contentTitle a, .boxHeadline .contentTitle a, .contentHeader > h1 a, .boxHeadline > h1 a {
  4170. color: rgba(44, 62, 80, 1);
  4171. }
  4172. .contentHeader .contentTitle a:hover, .boxHeadline .contentTitle a:hover, .contentHeader > h1 a:hover, .boxHeadline > h1 a:hover {
  4173. color: rgba(44, 62, 80, 1);
  4174. }
  4175. .contentHeader .contentHeaderDescription {
  4176. color: rgba(125, 130, 135, 1);
  4177. margin-top: 5px;
  4178. }
  4179. .contentHeader .contentHeaderMetaData {
  4180. color: rgba(125, 130, 135, 1);
  4181. margin-top: 5px;
  4182. }
  4183. .contentHeader .contentHeaderMetaData.inlineList > li:not(:last-child) {
  4184. margin-right: 10px;
  4185. }
  4186. .contentHeader .contentHeaderMetaData > li a, .contentHeader .contentHeaderMetaData > li a:hover, .contentHeader .contentHeaderMetaData > li .icon {
  4187. color: rgba(125, 130, 135, 1);
  4188. }
  4189. .contentHeader .contentTitle + .inlineDataList {
  4190. margin-top: 5px;
  4191. }
  4192. .contentHeader .inlineDataList {
  4193. color: rgba(125, 130, 135, 1);
  4194. }
  4195. @media (max-width: 768px) {
  4196. .contentHeader .contentHeaderIcon {
  4197. display: none;
  4198. }
  4199. }
  4200. @media (min-width: 545px) and (max-width: 768px) {
  4201. .contentHeader .contentHeaderNavigation > ul {
  4202. display: flex;
  4203. flex-wrap: wrap;
  4204. justify-content: flex-end;
  4205. margin-top: 20px;
  4206. }
  4207. .contentHeader .contentHeaderNavigation > ul > li {
  4208. flex: 0 1 auto;
  4209. }
  4210. .contentHeader .contentHeaderNavigation > ul > li:not(:last-child) {
  4211. margin-right: 5px;
  4212. }
  4213. .contentHeader .contentHeaderNavigation > ul.commaSeparated > li:not(:last-child)::after {
  4214. content: ",";
  4215. padding-left: 1px;
  4216. }
  4217. .contentHeader .contentHeaderNavigation > ul.dotSeparated > li:not(:last-child)::after {
  4218. content: "·";
  4219. margin-left: 5px;
  4220. }
  4221. }
  4222. @media (min-width: 769px) {
  4223. .contentHeader {
  4224. align-items: flex-start;
  4225. display: flex;
  4226. }
  4227. .contentHeader .contentHeaderIcon {
  4228. flex: 0 0 64px;
  4229. margin-right: 15px;
  4230. }
  4231. .contentHeader .contentHeaderTitle {
  4232. flex: 1 1 0;
  4233. }
  4234. .contentHeader .contentHeaderNavigation {
  4235. flex: 0 0 auto;
  4236. margin-left: 15px;
  4237. max-width: 50%;
  4238. }
  4239. .contentHeader .contentHeaderNavigation > ul {
  4240. display: flex;
  4241. flex-wrap: wrap;
  4242. justify-content: flex-end;
  4243. margin-top: -5px;
  4244. }
  4245. .contentHeader .contentHeaderNavigation > ul > li {
  4246. flex: 0 1 auto;
  4247. }
  4248. .contentHeader .contentHeaderNavigation > ul > li:not(:last-child) {
  4249. margin-right: 5px;
  4250. }
  4251. .contentHeader .contentHeaderNavigation > ul.commaSeparated > li:not(:last-child)::after {
  4252. content: ",";
  4253. padding-left: 1px;
  4254. }
  4255. .contentHeader .contentHeaderNavigation > ul.dotSeparated > li:not(:last-child)::after {
  4256. content: "·";
  4257. margin-left: 5px;
  4258. }
  4259. .contentHeader .contentHeaderNavigation > ul > li {
  4260. margin-top: 5px;
  4261. }
  4262. .contentHeader .contentHeaderNavigation > ul > li:not(:last-child) {
  4263. margin-right: 0;
  4264. }
  4265. .contentHeader .contentHeaderNavigation > ul > li:not(:first-child) {
  4266. margin-left: 5px;
  4267. }
  4268. }
  4269. .boxHeadline.boxSubHeadline {
  4270. margin-bottom: 20px;
  4271. margin-top: 40px;
  4272. }
  4273. .boxHeadline.boxSubHeadline > h2 {
  4274. color: rgba(44, 62, 80, 1);
  4275. font-weight: 300;
  4276. line-height: 1.28;
  4277. }
  4278. @media (min-width: 769px) {
  4279. .boxHeadline.boxSubHeadline > h2 {
  4280. font-size: 23px;
  4281. }
  4282. }
  4283. @media (max-width: 768px) {
  4284. .boxHeadline.boxSubHeadline > h2 {
  4285. font-size: 20px;
  4286. }
  4287. }
  4288. .boxHeadline.boxSubHeadline > h2 a {
  4289. color: rgba(44, 62, 80, 1);
  4290. }
  4291. .boxHeadline.boxSubHeadline > h2 a:hover {
  4292. color: rgba(44, 62, 80, 1);
  4293. }
  4294. .boxHeadline.boxSubHeadline > h2 .badge {
  4295. top: -2px;
  4296. }
  4297. .section {
  4298. margin-top: 40px;
  4299. }
  4300. .section > *:first-child {
  4301. margin-top: 0;
  4302. }
  4303. .section .sectionTitle {
  4304. color: rgba(44, 62, 80, 1);
  4305. font-weight: 300;
  4306. line-height: 1.28;
  4307. }
  4308. @media (min-width: 769px) {
  4309. .section .sectionTitle {
  4310. font-size: 23px;
  4311. }
  4312. }
  4313. @media (max-width: 768px) {
  4314. .section .sectionTitle {
  4315. font-size: 20px;
  4316. }
  4317. }
  4318. .section .sectionTitle a {
  4319. color: rgba(44, 62, 80, 1);
  4320. }
  4321. .section .sectionTitle a:hover {
  4322. color: rgba(44, 62, 80, 1);
  4323. }
  4324. .section .sectionTitle .badge {
  4325. top: -2px;
  4326. }
  4327. .section .sectionDescription {
  4328. color: rgba(125, 130, 135, 1);
  4329. }
  4330. .section > .sectionHeader, .section > .sectionTitle {
  4331. margin-bottom: 20px;
  4332. }
  4333. .section > .sectionHeader + .section, .section > .sectionTitle + .section {
  4334. margin-top: 20px;
  4335. }
  4336. .section:not(.sectionContainerList) > .sectionHeader, .section:not(.sectionContainerList) > .sectionTitle {
  4337. border-bottom: 1px solid rgba(224, 224, 224, 1);
  4338. padding-bottom: 10px;
  4339. }
  4340. .section.sectionContainerList > .sectionHeader, .section.sectionContainerList > .sectionTitle {
  4341. margin-bottom: 10px;
  4342. }
  4343. .section.tabularBox > .sectionHeader, .section.tabularBox > .sectionTitle {
  4344. border-color: rgba(65, 121, 173, 1);
  4345. margin-bottom: 0;
  4346. }
  4347. .section .section {
  4348. margin-top: 30px;
  4349. }
  4350. .section .section:first-child {
  4351. margin-top: 20px;
  4352. }
  4353. .section .section .sectionTitle {
  4354. font-weight: 400;
  4355. line-height: 1.28;
  4356. }
  4357. @media (min-width: 769px) {
  4358. .section .section .sectionTitle {
  4359. font-size: 18px;
  4360. }
  4361. }
  4362. @media (max-width: 768px) {
  4363. .section .section .sectionTitle {
  4364. font-size: 18px;
  4365. }
  4366. }
  4367. .section .section > .sectionHeader, .section .section > .sectionTitle {
  4368. margin-bottom: 15px;
  4369. }
  4370. fieldset {
  4371. margin-top: 40px;
  4372. }
  4373. fieldset > legend {
  4374. border-bottom: 1px solid rgba(224, 224, 224, 1);
  4375. color: rgba(44, 62, 80, 1);
  4376. float: left;
  4377. font-weight: 300;
  4378. line-height: 1.28;
  4379. margin-bottom: 20px;
  4380. padding-bottom: 10px;
  4381. width: 100%;
  4382. }
  4383. @media (min-width: 769px) {
  4384. fieldset > legend {
  4385. font-size: 23px;
  4386. }
  4387. }
  4388. @media (max-width: 768px) {
  4389. fieldset > legend {
  4390. font-size: 20px;
  4391. }
  4392. }
  4393. fieldset > legend a {
  4394. color: rgba(44, 62, 80, 1);
  4395. }
  4396. fieldset > legend a:hover {
  4397. color: rgba(44, 62, 80, 1);
  4398. }
  4399. fieldset > legend .badge {
  4400. top: -2px;
  4401. }
  4402. fieldset > legend + * {
  4403. clear: left;
  4404. }
  4405. fieldset > legend + small {
  4406. color: rgba(125, 130, 135, 1);
  4407. position: relative;
  4408. top: -12px;
  4409. }
  4410. .section fieldset {
  4411. margin-top: 20px;
  4412. }
  4413. .section fieldset > legend {
  4414. font-weight: 400;
  4415. line-height: 1.28;
  4416. margin-bottom: 15px;
  4417. }
  4418. @media (min-width: 769px) {
  4419. .section fieldset > legend {
  4420. font-size: 18px;
  4421. }
  4422. }
  4423. @media (max-width: 768px) {
  4424. .section fieldset > legend {
  4425. font-size: 18px;
  4426. }
  4427. }
  4428. .containerHeadline > h3 {
  4429. font-weight: 400;
  4430. line-height: 1.28;
  4431. }
  4432. @media (min-width: 769px) {
  4433. .containerHeadline > h3 {
  4434. font-size: 18px;
  4435. }
  4436. }
  4437. @media (max-width: 768px) {
  4438. .containerHeadline > h3 {
  4439. font-size: 18px;
  4440. }
  4441. }
  4442. .containerHeadline > h3 > .badge {
  4443. top: -2px;
  4444. }
  4445. .containerHeadline ~ .containerContent {
  4446. margin-top: 10px;
  4447. }
  4448. .contentNavigation + .section {
  4449. margin-top: 30px;
  4450. }
  4451. @media (max-width: 768px) {
  4452. .contentNavigation ul {
  4453. margin-top: 30px;
  4454. }
  4455. .contentNavigation ul > li > .button {
  4456. display: block;
  4457. padding: 7px 10px;
  4458. text-align: center;
  4459. }
  4460. .contentNavigation > nav:not(.pagination) > ul > li + li {
  4461. margin-top: 10px;
  4462. }
  4463. }
  4464. @media (min-width: 769px) {
  4465. .contentNavigation {
  4466. align-items: center;
  4467. display: flex;
  4468. justify-content: flex-end;
  4469. }
  4470. .contentNavigation > nav {
  4471. flex: 0 0 auto;
  4472. margin-top: 30px;
  4473. order: 3;
  4474. }
  4475. .contentNavigation > nav.pagination {
  4476. flex: 1 1 auto;
  4477. order: 1;
  4478. }
  4479. .contentNavigation > nav.jsClipboardEditor {
  4480. margin-right: 5px;
  4481. order: 2;
  4482. }
  4483. .contentNavigation > nav + nav {
  4484. flex: 0 0 auto;
  4485. }
  4486. .contentNavigation > nav:not(.pagination) {
  4487. text-align: right;
  4488. }
  4489. .contentNavigation ul {
  4490. display: inline-flex;
  4491. }
  4492. .contentNavigation ul > li {
  4493. flex: 0 0 auto;
  4494. }
  4495. .contentNavigation ul > li:not(:last-child) {
  4496. margin-right: 5px;
  4497. }
  4498. }
  4499. .paginationTop {
  4500. margin-top: 40px;
  4501. }
  4502. .paginationTop + .section {
  4503. margin-top: 20px;
  4504. }
  4505. .paginationBottom {
  4506. margin-top: 20px;
  4507. }
  4508. @media (max-width: 544px) {
  4509. .contentFooter > .contentFooterNavigation {
  4510. margin-top: 20px;
  4511. }
  4512. .contentFooter > .contentFooterNavigation > ul > li:not(:first-child) {
  4513. margin-top: 10px;
  4514. }
  4515. .contentFooter > .contentFooterNavigation .button {
  4516. display: block;
  4517. padding: 7px 10px;
  4518. text-align: center;
  4519. }
  4520. .contentFooter > .contentFooterNavigation .button:not(:first-child) {
  4521. margin-top: 10px;
  4522. }
  4523. }
  4524. @media (min-width: 545px) {
  4525. .contentFooter {
  4526. display: flex;
  4527. }
  4528. .contentFooter > .paginationBottom {
  4529. flex: 0 0 auto;
  4530. }
  4531. .contentFooter > .contentFooterNavigation {
  4532. flex: 1 1 auto;
  4533. margin: 20px 0 0 20px;
  4534. text-align: right;
  4535. }
  4536. .contentFooter > .contentFooterNavigation > ul {
  4537. display: inline-flex;
  4538. flex-wrap: nowrap;
  4539. }
  4540. .contentFooter > .contentFooterNavigation > ul > li {
  4541. flex: 0 1 auto;
  4542. }
  4543. .contentFooter > .contentFooterNavigation > ul > li:not(:last-child) {
  4544. margin-right: 5px;
  4545. }
  4546. .contentFooter > .contentFooterNavigation > ul.commaSeparated > li:not(:last-child)::after {
  4547. content: ",";
  4548. padding-left: 1px;
  4549. }
  4550. .contentFooter > .contentFooterNavigation > ul.dotSeparated > li:not(:last-child)::after {
  4551. content: "·";
  4552. margin-left: 5px;
  4553. }
  4554. }
  4555. @media (max-width: 544px) {
  4556. .contentHeader > .contentHeaderNavigation > ul {
  4557. margin-top: 30px;
  4558. }
  4559. .contentHeader > .contentHeaderNavigation > ul > li:not(:first-child) {
  4560. margin-top: 10px;
  4561. }
  4562. .contentHeader > .contentHeaderNavigation > ul > li > .button {
  4563. display: block;
  4564. padding: 7px 10px;
  4565. text-align: center;
  4566. }
  4567. .contentHeader > .contentHeaderNavigation > ul > li > .button > .invisible {
  4568. display: inline;
  4569. }
  4570. }
  4571. @media (max-width: 768px) {
  4572. .paginationTop {
  4573. display: none;
  4574. }
  4575. .paginationTop + .section {
  4576. margin-top: 30px;
  4577. }
  4578. .contentNavigation > .pagination {
  4579. display: none;
  4580. }
  4581. .section ~ .contentNavigation > .pagination {
  4582. display: block;
  4583. }
  4584. .section ~ .contentNavigation > .pagination + nav {
  4585. margin-top: 10px;
  4586. }
  4587. }
  4588. @media (min-width: 1025px) {
  4589. .sidebar + .content:not(:last-child) .contentHeaderNavigation {
  4590. flex: 1 1 0;
  4591. }
  4592. .sidebar + .content:not(:last-child) .contentHeaderNavigation > ul {
  4593. flex-wrap: wrap !important;
  4594. justify-content: flex-end;
  4595. }
  4596. }
  4597. input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="text"], input[type="url"], select, textarea {
  4598. background-color: rgba(241, 246, 251, 1);
  4599. border: 1px solid rgba(176, 200, 224, 1);
  4600. border-radius: 0;
  4601. color: rgba(44, 62, 80, 1);
  4602. font-family: "Roboto",Arial,Helvetica,sans-serif;
  4603. font-weight: 400;
  4604. line-height: 1.48;
  4605. margin: 0;
  4606. outline: medium none;
  4607. padding: 4px 8px;
  4608. }
  4609. @media (min-width: 769px) {
  4610. input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="text"], input[type="url"], select, textarea {
  4611. font-size: 14px;
  4612. }
  4613. }
  4614. @media (max-width: 768px) {
  4615. input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="text"], input[type="url"], select, textarea {
  4616. font-size: 14px;
  4617. }
  4618. }
  4619. input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="url"]:focus, select:focus, textarea:focus, input[type="date"]:hover, input[type="datetime"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="text"]:hover, input[type="url"]:hover, select:hover, textarea:hover {
  4620. background-color: rgba(241, 246, 251, 1);
  4621. border-color: rgba(41, 128, 185, 1);
  4622. color: rgba(44, 62, 80, 1);
  4623. }
  4624. input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="password"][disabled], input[type="search"][disabled], input[type="text"][disabled], input[type="url"][disabled], select[disabled], textarea[disabled] {
  4625. background-color: rgba(245, 245, 245, 1) !important;
  4626. border-color: rgba(174, 176, 179, 1) !important;
  4627. color: rgba(125, 130, 100, 1) !important;
  4628. }
  4629. input[type="date"][readonly], input[type="datetime"][readonly], input[type="email"][readonly], input[type="number"][readonly], input[type="password"][readonly], input[type="search"][readonly], input[type="text"][readonly], input[type="url"][readonly], select[readonly], textarea[readonly] {
  4630. color: rgba(125, 130, 100, 1) !important;
  4631. }
  4632. input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="text"], input[type="url"] {
  4633. }
  4634. input[type="date"]::-moz-placeholder, input[type="datetime"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="search"]::-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="url"]::-moz-placeholder {
  4635. color: rgba(169, 169, 169, 1);
  4636. }
  4637. input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="date"]:hover, input[type="datetime"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="text"]:hover, input[type="url"]:hover {
  4638. }
  4639. input[type="date"]:focus::-moz-placeholder, input[type="datetime"]:focus::-moz-placeholder, input[type="email"]:focus::-moz-placeholder, input[type="number"]:focus::-moz-placeholder, input[type="password"]:focus::-moz-placeholder, input[type="search"]:focus::-moz-placeholder, input[type="text"]:focus::-moz-placeholder, input[type="url"]:focus::-moz-placeholder, input[type="date"]:hover::-moz-placeholder, input[type="datetime"]:hover::-moz-placeholder, input[type="email"]:hover::-moz-placeholder, input[type="number"]:hover::-moz-placeholder, input[type="password"]:hover::-moz-placeholder, input[type="search"]:hover::-moz-placeholder, input[type="text"]:hover::-moz-placeholder, input[type="url"]:hover::-moz-placeholder {
  4640. color: rgba(204, 204, 204, 1);
  4641. }
  4642. input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="password"][disabled], input[type="search"][disabled], input[type="text"][disabled], input[type="url"][disabled], input[type="date"][readonly], input[type="datetime"][readonly], input[type="email"][readonly], input[type="number"][readonly], input[type="password"][readonly], input[type="search"][readonly], input[type="text"][readonly], input[type="url"][readonly] {
  4643. background-color: rgba(245, 245, 245, 1) !important;
  4644. border-color: rgba(174, 176, 179, 1) !important;
  4645. color: rgba(125, 130, 100, 1) !important;
  4646. }
  4647. input[type="search"], input[type="text"] {
  4648. }
  4649. .iOS input[type="date"], .iOS input[type="datetime"], .iOS input[type="email"], .iOS input[type="number"], .iOS input[type="password"], .iOS input[type="search"], .iOS input[type="text"], .iOS input[type="url"], .iOS select, .iOS textarea {
  4650. font-size: 16px;
  4651. }
  4652. textarea {
  4653. border-width: 1px;
  4654. font-weight: 400;
  4655. vertical-align: top;
  4656. width: 100%;
  4657. }
  4658. @media (min-width: 769px) {
  4659. textarea {
  4660. font-size: 14px;
  4661. }
  4662. }
  4663. @media (max-width: 768px) {
  4664. textarea {
  4665. font-size: 14px;
  4666. }
  4667. }
  4668. textarea[disabled], textarea[readonly] {
  4669. background-color: rgba(245, 245, 245, 1) !important;
  4670. border-color: rgba(174, 176, 179, 1) !important;
  4671. color: rgba(125, 130, 100, 1) !important;
  4672. }
  4673. input[disabled], textarea[disabled] {
  4674. -webkit-text-fill-color: rgba(125, 130, 100, 1);
  4675. }
  4676. select {
  4677. max-width: 100%;
  4678. }
  4679. .formSubmit {
  4680. text-align: center;
  4681. }
  4682. .formSubmit:not(:first-child) {
  4683. margin-top: 30px;
  4684. }
  4685. @media (max-width: 544px) {
  4686. .formSubmit > .button, .formSubmit > button, .formSubmit > input {
  4687. display: block;
  4688. padding: 7px 10px;
  4689. width: 100%;
  4690. }
  4691. .formSubmit > .button:not(:first-child), .formSubmit > button:not(:first-child), .formSubmit > input:not(:first-child) {
  4692. margin-top: 10px;
  4693. }
  4694. }
  4695. @media (min-width: 545px) {
  4696. .formSubmit > *:not(:first-child) {
  4697. margin-left: 10px;
  4698. }
  4699. }
  4700. .inputAddon {
  4701. display: flex;
  4702. }
  4703. .inputAddon:not(:last-child) {
  4704. margin-bottom: 5px;
  4705. }
  4706. .inputAddon > .inputPrefix, .inputAddon > .inputSuffix {
  4707. align-items: center;
  4708. display: flex;
  4709. flex: 0 0 auto;
  4710. }
  4711. .inputAddon > .inputPrefix.button, .inputAddon > .inputSuffix.button {
  4712. border-radius: 0;
  4713. }
  4714. .inputAddon > .inputPrefix:not(.button), .inputAddon > .inputSuffix:not(.button) {
  4715. background-color: rgba(207, 216, 220, 1);
  4716. border: 1px solid rgba(176, 200, 224, 1);
  4717. color: rgba(33, 33, 33, 1);
  4718. cursor: default;
  4719. padding: 3px 5px;
  4720. }
  4721. .inputAddon > .inputPrefix {
  4722. border-right-width: 0 !important;
  4723. }
  4724. .inputAddon > .inputSuffix.button {
  4725. margin-left: 5px;
  4726. }
  4727. .inputAddon > .inputSuffix:not(.button) {
  4728. border-left-width: 0 !important;
  4729. }
  4730. .inputAddon input {
  4731. flex: 1 1 auto;
  4732. }
  4733. .inputAddon input + .inputPrefix {
  4734. margin-left: 5px;
  4735. }
  4736. .inputAddonTextarea {
  4737. flex-wrap: wrap;
  4738. }
  4739. .inputAddonTextarea > .inputPrefix.button {
  4740. border-bottom-width: 0;
  4741. border-radius: 0;
  4742. }
  4743. .inputAddonTextarea > textarea {
  4744. flex: 0 0 100%;
  4745. }
  4746. .inputAddon input.tiny, input.tiny {
  4747. flex-grow: 0;
  4748. width: 80px;
  4749. }
  4750. .inputAddon input.long, input.long {
  4751. width: 100%;
  4752. }
  4753. @media (max-width: 544px) {
  4754. .inputAddon input.short, input.short {
  4755. flex-grow: 0;
  4756. width: 150px;
  4757. }
  4758. .inputAddon input.medium, input.medium {
  4759. width: 100%;
  4760. }
  4761. }
  4762. @media (min-width: 545px) {
  4763. .inputAddon input.short, input.short {
  4764. flex-grow: 0;
  4765. min-width: 80px;
  4766. width: 10%;
  4767. }
  4768. .inputAddon input.medium, input.medium {
  4769. flex-grow: 0;
  4770. min-width: 150px;
  4771. width: 30%;
  4772. }
  4773. }
  4774. .formError dt {
  4775. color: rgba(204, 0, 1, 1) !important;
  4776. }
  4777. .formError input, .formError select, .formError textarea {
  4778. border-color: rgba(204, 0, 1, 1) !important;
  4779. }
  4780. .formGrid dt {
  4781. display: none;
  4782. }
  4783. .formGrid select {
  4784. width: 100%;
  4785. }
  4786. .layoutBoundary {
  4787. margin: 0 auto;
  4788. }
  4789. @media (max-width: 1024px) {
  4790. .layoutBoundary {
  4791. padding: 0 10px;
  4792. width: 100%;
  4793. }
  4794. }
  4795. @media (min-width: 1025px) {
  4796. .layoutBoundary {
  4797. max-width: 90%;
  4798. min-width: 1025px;
  4799. padding: 0 20px;
  4800. }
  4801. }
  4802. .invisible {
  4803. display: none;
  4804. }
  4805. .grayscale, .conversationParticipantList > li.conversationLeft > div > a > img, .conversationParticipantList > li.conversationLeft > div > span > img {
  4806. filter: grayscale(1);
  4807. }
  4808. .monospace {
  4809. font-family: Consolas,"Courier New",monospace !important;
  4810. }
  4811. .box16 {
  4812. display: flex;
  4813. }
  4814. .box16 > *:first-child:not(:last-child) {
  4815. flex: 0 0 auto;
  4816. margin-right: 5px;
  4817. }
  4818. .box16 > *:last-child {
  4819. flex: 1 1 auto;
  4820. overflow: hidden;
  4821. }
  4822. .box24 {
  4823. display: flex;
  4824. }
  4825. .box24 > *:first-child:not(:last-child) {
  4826. flex: 0 0 auto;
  4827. margin-right: 8px;
  4828. }
  4829. .box24 > *:last-child {
  4830. flex: 1 1 auto;
  4831. overflow: hidden;
  4832. }
  4833. .box32 {
  4834. display: flex;
  4835. }
  4836. .box32 > *:first-child:not(:last-child) {
  4837. flex: 0 0 auto;
  4838. margin-right: 10px;
  4839. }
  4840. .box32 > *:last-child {
  4841. flex: 1 1 auto;
  4842. overflow: hidden;
  4843. }
  4844. .box48 {
  4845. display: flex;
  4846. }
  4847. .box48 > *:first-child:not(:last-child) {
  4848. flex: 0 0 auto;
  4849. margin-right: 12px;
  4850. }
  4851. .box48 > *:last-child {
  4852. flex: 1 1 auto;
  4853. overflow: hidden;
  4854. }
  4855. .box64 {
  4856. display: flex;
  4857. }
  4858. .box64 > *:first-child:not(:last-child) {
  4859. flex: 0 0 auto;
  4860. margin-right: 15px;
  4861. }
  4862. .box64 > *:last-child {
  4863. flex: 1 1 auto;
  4864. overflow: hidden;
  4865. }
  4866. .box96 {
  4867. display: flex;
  4868. }
  4869. .box96 > *:first-child:not(:last-child) {
  4870. flex: 0 0 auto;
  4871. margin-right: 15px;
  4872. }
  4873. .box96 > *:last-child {
  4874. flex: 1 1 auto;
  4875. overflow: hidden;
  4876. }
  4877. .box128 {
  4878. display: flex;
  4879. }
  4880. .box128 > *:first-child:not(:last-child) {
  4881. flex: 0 0 auto;
  4882. margin-right: 20px;
  4883. }
  4884. .box128 > *:last-child {
  4885. flex: 1 1 auto;
  4886. overflow: hidden;
  4887. }
  4888. .box256 {
  4889. display: flex;
  4890. }
  4891. .box256 > *:first-child:not(:last-child) {
  4892. flex: 0 0 auto;
  4893. margin-right: 30px;
  4894. }
  4895. .box256 > *:last-child {
  4896. flex: 1 1 auto;
  4897. overflow: hidden;
  4898. }
  4899. small, .small {
  4900. font-weight: 400;
  4901. }
  4902. @media (min-width: 769px) {
  4903. small, .small {
  4904. font-size: 12px;
  4905. }
  4906. }
  4907. @media (max-width: 768px) {
  4908. small, .small {
  4909. font-size: 12px;
  4910. }
  4911. }
  4912. strong {
  4913. font-weight: 600;
  4914. }
  4915. img {
  4916. vertical-align: middle;
  4917. }
  4918. .elementPointer {
  4919. pointer-events: none;
  4920. position: absolute;
  4921. top: 0;
  4922. transform: translateY(-100%);
  4923. }
  4924. .elementPointer.center {
  4925. left: 50%;
  4926. transform: translateX(-50%) translateY(-100%);
  4927. }
  4928. .elementPointer.left {
  4929. left: 4px;
  4930. }
  4931. .elementPointer.right {
  4932. right: 4px;
  4933. }
  4934. .elementPointer.flipVertical {
  4935. bottom: 0;
  4936. top: auto;
  4937. transform: translateY(100%);
  4938. }
  4939. .elementPointer.flipVertical.center {
  4940. transform: translateX(-50%) translateY(100%);
  4941. }
  4942. .nativeList {
  4943. margin: 1em 0 1em 40px;
  4944. }
  4945. .nativeList ul, .nativeList ol {
  4946. margin-bottom: 0;
  4947. margin-top: 0;
  4948. }
  4949. .nativeList li {
  4950. margin: 5px 0;
  4951. }
  4952. ul.nativeList {
  4953. list-style-type: disc;
  4954. }
  4955. ol.nativeList {
  4956. list-style-type: decimal;
  4957. }
  4958. .htmlContent::before, .messageBody > .messageText::before, .messageSignature > div::before, .redactor-layer::before, .htmlContent::after, .messageBody > .messageText::after, .messageSignature > div::after, .redactor-layer::after {
  4959. content: "";
  4960. display: table;
  4961. }
  4962. .htmlContent::after, .messageBody > .messageText::after, .messageSignature > div::after, .redactor-layer::after {
  4963. clear: both;
  4964. }
  4965. .htmlContent img, .messageBody > .messageText img, .messageSignature > div img, .redactor-layer img {
  4966. max-width: 100%;
  4967. }
  4968. .htmlContent > *:first-child, .messageBody > .messageText > *:first-child, .messageSignature > div > *:first-child, .redactor-layer > *:first-child {
  4969. margin-top: 0 !important;
  4970. }
  4971. .htmlContent > *:last-child, .messageBody > .messageText > *:last-child, .messageSignature > div > *:last-child, .redactor-layer > *:last-child {
  4972. margin-bottom: 0 !important;
  4973. }
  4974. .htmlContent p, .messageBody > .messageText p, .messageSignature > div p, .redactor-layer p {
  4975. margin: 0;
  4976. }
  4977. .htmlContent h1, .messageBody > .messageText h1, .messageSignature > div h1, .redactor-layer h1 {
  4978. font-weight: 300;
  4979. line-height: 1.05;
  4980. }
  4981. @media (min-width: 769px) {
  4982. .htmlContent h1, .messageBody > .messageText h1, .messageSignature > div h1, .redactor-layer h1 {
  4983. font-size: 28px;
  4984. }
  4985. }
  4986. @media (max-width: 768px) {
  4987. .htmlContent h1, .messageBody > .messageText h1, .messageSignature > div h1, .redactor-layer h1 {
  4988. font-size: 23px;
  4989. }
  4990. }
  4991. .htmlContent h2, .messageBody > .messageText h2, .messageSignature > div h2, .redactor-layer h2 {
  4992. font-weight: 300;
  4993. line-height: 1.28;
  4994. }
  4995. @media (min-width: 769px) {
  4996. .htmlContent h2, .messageBody > .messageText h2, .messageSignature > div h2, .redactor-layer h2 {
  4997. font-size: 23px;
  4998. }
  4999. }
  5000. @media (max-width: 768px) {
  5001. .htmlContent h2, .messageBody > .messageText h2, .messageSignature > div h2, .redactor-layer h2 {
  5002. font-size: 20px;
  5003. }
  5004. }
  5005. .htmlContent h3, .messageBody > .messageText h3, .messageSignature > div h3, .redactor-layer h3 {
  5006. font-weight: 400;
  5007. line-height: 1.28;
  5008. }
  5009. @media (min-width: 769px) {
  5010. .htmlContent h3, .messageBody > .messageText h3, .messageSignature > div h3, .redactor-layer h3 {
  5011. font-size: 18px;
  5012. }
  5013. }
  5014. @media (max-width: 768px) {
  5015. .htmlContent h3, .messageBody > .messageText h3, .messageSignature > div h3, .redactor-layer h3 {
  5016. font-size: 18px;
  5017. }
  5018. }
  5019. .htmlContent h1, .messageBody > .messageText h1, .messageSignature > div h1, .redactor-layer h1, .htmlContent h2, .messageBody > .messageText h2, .messageSignature > div h2, .redactor-layer h2, .htmlContent h3, .messageBody > .messageText h3, .messageSignature > div h3, .redactor-layer h3, .htmlContent h4, .messageBody > .messageText h4, .messageSignature > div h4, .redactor-layer h4, .htmlContent h5, .messageBody > .messageText h5, .messageSignature > div h5, .redactor-layer h5, .htmlContent h6, .messageBody > .messageText h6, .messageSignature > div h6, .redactor-layer h6 {
  5020. margin: 1.5em 0 1em;
  5021. }
  5022. .htmlContent ul, .messageBody > .messageText ul, .messageSignature > div ul, .redactor-layer ul, .htmlContent ol, .messageBody > .messageText ol, .messageSignature > div ol, .redactor-layer ol {
  5023. margin: 1em 0 1em 40px;
  5024. }
  5025. .htmlContent ul ul, .messageBody > .messageText ul ul, .messageSignature > div ul ul, .redactor-layer ul ul, .htmlContent ol ul, .messageBody > .messageText ol ul, .messageSignature > div ol ul, .redactor-layer ol ul, .htmlContent ul ol, .messageBody > .messageText ul ol, .messageSignature > div ul ol, .redactor-layer ul ol, .htmlContent ol ol, .messageBody > .messageText ol ol, .messageSignature > div ol ol, .redactor-layer ol ol {
  5026. margin-bottom: 0;
  5027. margin-top: 0;
  5028. }
  5029. .htmlContent ul li, .messageBody > .messageText ul li, .messageSignature > div ul li, .redactor-layer ul li, .htmlContent ol li, .messageBody > .messageText ol li, .messageSignature > div ol li, .redactor-layer ol li {
  5030. margin: 5px 0;
  5031. }
  5032. .htmlContent ul, .messageBody > .messageText ul, .messageSignature > div ul, .redactor-layer ul {
  5033. list-style-type: disc;
  5034. }
  5035. .htmlContent ol, .messageBody > .messageText ol, .messageSignature > div ol, .redactor-layer ol {
  5036. list-style-type: decimal;
  5037. }
  5038. .htmlContent em, .messageBody > .messageText em, .messageSignature > div em, .redactor-layer em {
  5039. margin-right: 2px;
  5040. }
  5041. .htmlContent hr, .messageBody > .messageText hr, .messageSignature > div hr, .redactor-layer hr {
  5042. -moz-border-bottom-colors: none;
  5043. -moz-border-left-colors: none;
  5044. -moz-border-right-colors: none;
  5045. -moz-border-top-colors: none;
  5046. border-color: rgba(224, 224, 224, 1) -moz-use-text-color -moz-use-text-color;
  5047. border-image: none;
  5048. border-style: solid none none;
  5049. border-width: 1px 0 0;
  5050. height: 0;
  5051. }
  5052. .separatorLeft::before {
  5053. color: rgba(44, 62, 80, 1);
  5054. content: "·";
  5055. margin-right: 0.25em;
  5056. }
  5057. .separatorRight::after {
  5058. color: rgba(44, 62, 80, 1);
  5059. content: "·";
  5060. margin-left: 0.25em;
  5061. }
  5062. .pointer {
  5063. cursor: pointer;
  5064. }
  5065. a.externalURL::after {
  5066. content: "";
  5067. display: inline-block;
  5068. font-family: FontAwesome !important;
  5069. font-size: 14px !important;
  5070. font-style: normal !important;
  5071. font-weight: normal !important;
  5072. margin-left: 4px;
  5073. vertical-align: -1px;
  5074. }
  5075. .row {
  5076. display: flex;
  5077. flex-wrap: wrap;
  5078. margin-left: -10px;
  5079. margin-right: -10px;
  5080. }
  5081. .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
  5082. min-height: 1px;
  5083. padding-left: 10px;
  5084. padding-right: 10px;
  5085. position: relative;
  5086. }
  5087. .col-xs-1 {
  5088. flex: 0 0 8.33333%;
  5089. max-width: 8.33333%;
  5090. }
  5091. .col-xs-2 {
  5092. flex: 0 0 16.6667%;
  5093. max-width: 16.6667%;
  5094. }
  5095. .col-xs-3 {
  5096. flex: 0 0 25%;
  5097. max-width: 25%;
  5098. }
  5099. .col-xs-4 {
  5100. flex: 0 0 33.3333%;
  5101. max-width: 33.3333%;
  5102. }
  5103. .col-xs-5 {
  5104. flex: 0 0 41.6667%;
  5105. max-width: 41.6667%;
  5106. }
  5107. .col-xs-6 {
  5108. flex: 0 0 50%;
  5109. max-width: 50%;
  5110. }
  5111. .col-xs-7 {
  5112. flex: 0 0 58.3333%;
  5113. max-width: 58.3333%;
  5114. }
  5115. .col-xs-8 {
  5116. flex: 0 0 66.6667%;
  5117. max-width: 66.6667%;
  5118. }
  5119. .col-xs-9 {
  5120. flex: 0 0 75%;
  5121. max-width: 75%;
  5122. }
  5123. .col-xs-10 {
  5124. flex: 0 0 83.3333%;
  5125. max-width: 83.3333%;
  5126. }
  5127. .col-xs-11 {
  5128. flex: 0 0 91.6667%;
  5129. max-width: 91.6667%;
  5130. }
  5131. .col-xs-12 {
  5132. flex: 0 0 100%;
  5133. }
  5134. .col-xs-offset-0 {
  5135. margin-left: 0;
  5136. }
  5137. .col-xs-offset-1 {
  5138. margin-left: 8.33333%;
  5139. }
  5140. .col-xs-offset-2 {
  5141. margin-left: 16.6667%;
  5142. }
  5143. .col-xs-offset-3 {
  5144. margin-left: 25%;
  5145. }
  5146. .col-xs-offset-4 {
  5147. margin-left: 33.3333%;
  5148. }
  5149. .col-xs-offset-5 {
  5150. margin-left: 41.6667%;
  5151. }
  5152. .col-xs-offset-6 {
  5153. margin-left: 50%;
  5154. }
  5155. .col-xs-offset-7 {
  5156. margin-left: 58.3333%;
  5157. }
  5158. .col-xs-offset-8 {
  5159. margin-left: 66.6667%;
  5160. }
  5161. .col-xs-offset-9 {
  5162. margin-left: 75%;
  5163. }
  5164. .col-xs-offset-10 {
  5165. margin-left: 83.3333%;
  5166. }
  5167. .col-xs-offset-11 {
  5168. margin-left: 91.6667%;
  5169. }
  5170. .col-xs-offset-12 {
  5171. margin-left: 100%;
  5172. }
  5173. @media (min-width: 769px) {
  5174. .col-md-1 {
  5175. flex: 0 0 8.33333%;
  5176. max-width: 8.33333%;
  5177. }
  5178. .col-md-2 {
  5179. flex: 0 0 16.6667%;
  5180. max-width: 16.6667%;
  5181. }
  5182. .col-md-3 {
  5183. flex: 0 0 25%;
  5184. max-width: 25%;
  5185. }
  5186. .col-md-4 {
  5187. flex: 0 0 33.3333%;
  5188. max-width: 33.3333%;
  5189. }
  5190. .col-md-5 {
  5191. flex: 0 0 41.6667%;
  5192. max-width: 41.6667%;
  5193. }
  5194. .col-md-6 {
  5195. flex: 0 0 50%;
  5196. max-width: 50%;
  5197. }
  5198. .col-md-7 {
  5199. flex: 0 0 58.3333%;
  5200. max-width: 58.3333%;
  5201. }
  5202. .col-md-8 {
  5203. flex: 0 0 66.6667%;
  5204. max-width: 66.6667%;
  5205. }
  5206. .col-md-9 {
  5207. flex: 0 0 75%;
  5208. max-width: 75%;
  5209. }
  5210. .col-md-10 {
  5211. flex: 0 0 83.3333%;
  5212. max-width: 83.3333%;
  5213. }
  5214. .col-md-11 {
  5215. flex: 0 0 91.6667%;
  5216. max-width: 91.6667%;
  5217. }
  5218. .col-md-12 {
  5219. flex: 0 0 100%;
  5220. max-width: none;
  5221. }
  5222. .col-md-pull-0 {
  5223. right: auto;
  5224. }
  5225. .col-md-pull-1 {
  5226. right: 8.33333%;
  5227. }
  5228. .col-md-pull-2 {
  5229. right: 16.6667%;
  5230. }
  5231. .col-md-pull-3 {
  5232. right: 25%;
  5233. }
  5234. .col-md-pull-4 {
  5235. right: 33.3333%;
  5236. }
  5237. .col-md-pull-5 {
  5238. right: 41.6667%;
  5239. }
  5240. .col-md-pull-6 {
  5241. right: 50%;
  5242. }
  5243. .col-md-pull-7 {
  5244. right: 58.3333%;
  5245. }
  5246. .col-md-pull-8 {
  5247. right: 66.6667%;
  5248. }
  5249. .col-md-pull-9 {
  5250. right: 75%;
  5251. }
  5252. .col-md-pull-10 {
  5253. right: 83.3333%;
  5254. }
  5255. .col-md-pull-11 {
  5256. right: 91.6667%;
  5257. }
  5258. .col-md-pull-12 {
  5259. right: 100%;
  5260. }
  5261. .col-md-push-0 {
  5262. left: auto;
  5263. }
  5264. .col-md-push-1 {
  5265. left: 8.33333%;
  5266. }
  5267. .col-md-push-2 {
  5268. left: 16.6667%;
  5269. }
  5270. .col-md-push-3 {
  5271. left: 25%;
  5272. }
  5273. .col-md-push-4 {
  5274. left: 33.3333%;
  5275. }
  5276. .col-md-push-5 {
  5277. left: 41.6667%;
  5278. }
  5279. .col-md-push-6 {
  5280. left: 50%;
  5281. }
  5282. .col-md-push-7 {
  5283. left: 58.3333%;
  5284. }
  5285. .col-md-push-8 {
  5286. left: 66.6667%;
  5287. }
  5288. .col-md-push-9 {
  5289. left: 75%;
  5290. }
  5291. .col-md-push-10 {
  5292. left: 83.3333%;
  5293. }
  5294. .col-md-push-11 {
  5295. left: 91.6667%;
  5296. }
  5297. .col-md-push-12 {
  5298. left: 100%;
  5299. }
  5300. .col-md-offset-0 {
  5301. margin-left: 0;
  5302. }
  5303. .col-md-offset-1 {
  5304. margin-left: 8.33333%;
  5305. }
  5306. .col-md-offset-2 {
  5307. margin-left: 16.6667%;
  5308. }
  5309. .col-md-offset-3 {
  5310. margin-left: 25%;
  5311. }
  5312. .col-md-offset-4 {
  5313. margin-left: 33.3333%;
  5314. }
  5315. .col-md-offset-5 {
  5316. margin-left: 41.6667%;
  5317. }
  5318. .col-md-offset-6 {
  5319. margin-left: 50%;
  5320. }
  5321. .col-md-offset-7 {
  5322. margin-left: 58.3333%;
  5323. }
  5324. .col-md-offset-8 {
  5325. margin-left: 66.6667%;
  5326. }
  5327. .col-md-offset-9 {
  5328. margin-left: 75%;
  5329. }
  5330. .col-md-offset-10 {
  5331. margin-left: 83.3333%;
  5332. }
  5333. .col-md-offset-11 {
  5334. margin-left: 91.6667%;
  5335. }
  5336. .col-md-offset-12 {
  5337. margin-left: 100%;
  5338. }
  5339. }
  5340. .row-xs-top {
  5341. align-items: flex-start;
  5342. }
  5343. .row-xs-center {
  5344. align-items: center;
  5345. }
  5346. .row-xs-bottom {
  5347. align-items: flex-end;
  5348. }
  5349. @media (min-width: 769px) {
  5350. .row-md-top {
  5351. align-items: flex-start;
  5352. }
  5353. .row-md-center {
  5354. align-items: center;
  5355. }
  5356. .row-md-bottom {
  5357. align-items: flex-end;
  5358. }
  5359. }
  5360. .col-xs-top {
  5361. align-self: flex-start;
  5362. }
  5363. .col-xs-center {
  5364. align-self: center;
  5365. }
  5366. .col-xs-bottom {
  5367. align-self: flex-end;
  5368. }
  5369. @media (min-width: 769px) {
  5370. .col-md-top {
  5371. align-self: flex-start;
  5372. }
  5373. .col-md-center {
  5374. align-self: center;
  5375. }
  5376. .col-md-bottom {
  5377. align-self: flex-end;
  5378. }
  5379. }
  5380. .rowColGap {
  5381. margin-bottom: -20px;
  5382. }
  5383. .rowColGap > .col-xs-1, .rowColGap > .col-xs-2, .rowColGap > .col-xs-3, .rowColGap > .col-xs-4, .rowColGap > .col-xs-5, .rowColGap > .col-xs-6, .rowColGap > .col-xs-7, .rowColGap > .col-xs-8, .rowColGap > .col-xs-9, .rowColGap > .col-xs-10, .rowColGap > .col-xs-11, .rowColGap > .col-xs-12, .rowColGap > .col-md-1, .rowColGap > .col-md-2, .rowColGap > .col-md-3, .rowColGap > .col-md-4, .rowColGap > .col-md-5, .rowColGap > .col-md-6, .rowColGap > .col-md-7, .rowColGap > .col-md-8, .rowColGap > .col-md-9, .rowColGap > .col-md-10, .rowColGap > .col-md-11, .rowColGap > .col-md-12 {
  5384. margin-bottom: 20px !important;
  5385. }
  5386. .rowColGap:not(:first-child) {
  5387. margin-top: 20px;
  5388. }
  5389. html.disableScrolling {
  5390. overflow: hidden !important;
  5391. }
  5392. html.disableScrolling body {
  5393. overflow: hidden !important;
  5394. }
  5395. @media (max-width: 1024px) {
  5396. html.disableScrolling body {
  5397. position: fixed !important;
  5398. }
  5399. }
  5400. html, body {
  5401. font-weight: 400;
  5402. height: 100%;
  5403. line-height: 1.48;
  5404. }
  5405. @media (min-width: 769px) {
  5406. html, body {
  5407. font-size: 14px;
  5408. }
  5409. }
  5410. @media (max-width: 768px) {
  5411. html, body {
  5412. font-size: 14px;
  5413. }
  5414. }
  5415. body {
  5416. background-color: rgba(250, 250, 250, 1);
  5417. color: rgba(44, 62, 80, 1);
  5418. font-family: "Roboto",Arial,Helvetica,sans-serif;
  5419. overflow-wrap: break-word;
  5420. position: relative;
  5421. width: 100%;
  5422. }
  5423. a {
  5424. color: rgba(230, 81, 0, 1);
  5425. cursor: pointer;
  5426. text-decoration: none;
  5427. }
  5428. a:hover {
  5429. color: rgba(191, 54, 12, 1);
  5430. text-decoration: none;
  5431. }
  5432. .pageContainer {
  5433. display: flex;
  5434. flex-direction: column;
  5435. height: 100%;
  5436. }
  5437. .pageHeaderContainer, .boxesHeaderBoxes, .pageNavigation, .pageFooter, .boxesTop, .boxesBottom, .boxesFooterBoxes {
  5438. flex: 0 0 auto;
  5439. }
  5440. .main {
  5441. flex: 1 0 auto;
  5442. }
  5443. @media (max-width: 1024px) {
  5444. .main {
  5445. padding: 40px 0;
  5446. width: 100%;
  5447. }
  5448. }
  5449. @media (min-width: 1025px) {
  5450. .main {
  5451. padding: 60px 0;
  5452. }
  5453. }
  5454. @media (min-width: 1025px) {
  5455. .main > div {
  5456. display: flex;
  5457. }
  5458. .content {
  5459. flex: 1 1 0;
  5460. }
  5461. .content:not(:last-child) {
  5462. flex-basis: calc(100% - 340px);
  5463. max-width: calc(100% - 340px);
  5464. }
  5465. .content + .sidebar {
  5466. margin-left: 30px;
  5467. }
  5468. .sidebar {
  5469. flex: 0 0 310px;
  5470. overflow: hidden;
  5471. }
  5472. .sidebar:first-child {
  5473. margin-right: 30px;
  5474. }
  5475. .sidebar + .content {
  5476. flex-basis: calc(100% - 340px);
  5477. max-width: calc(100% - 340px);
  5478. }
  5479. .sidebar + .content:not(:last-child) {
  5480. flex-basis: calc(100% - 680px);
  5481. max-width: calc(100% - 680px);
  5482. }
  5483. }
  5484. @media (max-width: 1024px) {
  5485. .sidebar {
  5486. margin: 0 -10px;
  5487. }
  5488. .sidebar + .content, .content + .sidebar {
  5489. margin-top: 30px;
  5490. }
  5491. }
  5492. .sideBySide {
  5493. margin-top: 20px;
  5494. }
  5495. @media (min-width: 769px) {
  5496. .sideBySide {
  5497. display: table;
  5498. table-layout: fixed;
  5499. width: 100%;
  5500. }
  5501. .sideBySide > .section {
  5502. display: table-cell;
  5503. width: 49%;
  5504. }
  5505. .sideBySide > .section + .section {
  5506. padding-left: 2%;
  5507. }
  5508. }
  5509. .pageFooterCopyright {
  5510. background-color: rgba(50, 92, 132, 1);
  5511. color: rgba(217, 220, 222, 1);
  5512. text-align: center;
  5513. }
  5514. @media (min-width: 769px) {
  5515. .pageFooterCopyright {
  5516. padding: 20px 0;
  5517. }
  5518. }
  5519. @media (max-width: 768px) {
  5520. .pageFooterCopyright {
  5521. padding: 20px 0;
  5522. }
  5523. }
  5524. .pageFooterCopyright > .layoutBoundary > div:not(:first-child) {
  5525. margin-top: 10px;
  5526. }
  5527. .pageFooterCopyright a {
  5528. color: rgba(217, 220, 222, 1);
  5529. }
  5530. .pageFooterCopyright a:hover {
  5531. color: rgba(255, 255, 255, 1);
  5532. text-decoration: underline;
  5533. }
  5534. .pageHeaderContainer {
  5535. color: rgba(255, 255, 255, 1);
  5536. padding-top: 50px;
  5537. z-index: 100;
  5538. }
  5539. .pageHeaderContainer a {
  5540. color: rgba(255, 255, 255, 1);
  5541. }
  5542. .pageHeaderContainer a:hover {
  5543. color: rgba(255, 255, 255, 1);
  5544. }
  5545. .pageHeaderContainer .icon {
  5546. color: rgba(255, 255, 255, 1);
  5547. }
  5548. @media (min-width: 1025px) {
  5549. .pageHeaderContainer {
  5550. background-color: rgba(58, 109, 156, 1);
  5551. }
  5552. }
  5553. .pageHeaderPanel {
  5554. left: 0;
  5555. position: fixed;
  5556. right: 0;
  5557. top: 0;
  5558. z-index: 300;
  5559. }
  5560. .pageHeaderPanel > .layoutBoundary {
  5561. display: flex;
  5562. }
  5563. @media (max-width: 1024px) {
  5564. .pageHeaderPanel {
  5565. background-color: rgba(58, 109, 156, 1);
  5566. }
  5567. .pageHeaderPanel > .layoutBoundary {
  5568. padding: 9px 10px;
  5569. }
  5570. }
  5571. @media (min-width: 1025px) {
  5572. .pageHeaderPanel {
  5573. background-color: rgba(50, 92, 132, 1);
  5574. }
  5575. }
  5576. .pageHeaderFacade:first-child {
  5577. margin-top: -50px;
  5578. }
  5579. .pageHeaderFacade > .layoutBoundary {
  5580. align-items: center;
  5581. display: flex;
  5582. }
  5583. @media (min-width: 1025px) {
  5584. .pageHeaderFacade > .layoutBoundary {
  5585. align-items: center;
  5586. padding-bottom: 30px;
  5587. padding-top: 30px;
  5588. }
  5589. }
  5590. @media (max-width: 1024px) {
  5591. .pageHeaderFacade > .layoutBoundary {
  5592. height: 50px;
  5593. justify-content: center;
  5594. left: 60px;
  5595. padding: 9px 0;
  5596. position: fixed;
  5597. right: 60px;
  5598. top: 0;
  5599. width: auto;
  5600. z-index: 301;
  5601. }
  5602. }
  5603. .mainMenu {
  5604. flex: 1 1 0;
  5605. margin-right: 20px;
  5606. position: relative;
  5607. }
  5608. .mainMenu .boxMenu {
  5609. display: flex;
  5610. overflow: hidden;
  5611. }
  5612. .mainMenu .boxMenu > li {
  5613. flex: 0 0 auto;
  5614. }
  5615. .mainMenu .boxMenu > li:first-child {
  5616. transition: margin-left 0.24s ease-in-out 0s;
  5617. }
  5618. .mainMenu .boxMenu > li > a {
  5619. align-items: center;
  5620. background: rgba(43, 79, 113, 1) none repeat scroll 0 0;
  5621. color: rgba(255, 255, 255, 1);
  5622. display: flex;
  5623. height: 50px;
  5624. padding: 0 15px;
  5625. }
  5626. .mainMenu .boxMenu > li > a > span {
  5627. flex: 0 0 auto;
  5628. }
  5629. .mainMenu .boxMenu > li > a > .boxMenuLinkOutstandingItems {
  5630. margin-left: 5px;
  5631. }
  5632. .mainMenu .boxMenu > li > span {
  5633. cursor: default;
  5634. }
  5635. .mainMenu .boxMenu > li.active > a, .mainMenu .boxMenu > li:hover > a {
  5636. background: rgba(36, 66, 95, 1) none repeat scroll 0 0;
  5637. color: rgba(255, 255, 255, 1);
  5638. }
  5639. .mainMenu .boxMenu > .boxMenuHasChildren:hover .boxMenuDepth1 {
  5640. visibility: visible;
  5641. }
  5642. .mainMenu .boxMenu > .boxMenuHasChildren > a::after {
  5643. content: "";
  5644. display: block;
  5645. font-family: "FontAwesome";
  5646. font-size: 14px;
  5647. height: 24px;
  5648. line-height: 24px;
  5649. margin-left: 5px;
  5650. width: 10px;
  5651. }
  5652. .mainMenu .boxMenu .boxMenuDepth1 {
  5653. background-color: rgba(36, 66, 95, 1);
  5654. border-radius: 0 0 3px 3px;
  5655. padding: 5px 0;
  5656. position: absolute;
  5657. visibility: hidden;
  5658. }
  5659. @media (min-width: 769px) {
  5660. .mainMenu .boxMenu .boxMenuDepth1 {
  5661. font-size: 14px;
  5662. }
  5663. }
  5664. @media (max-width: 768px) {
  5665. .mainMenu .boxMenu .boxMenuDepth1 {
  5666. font-size: 14px;
  5667. }
  5668. }
  5669. .mainMenu .boxMenu .boxMenuDepth1 > li > a {
  5670. color: rgba(255, 255, 255, 1);
  5671. }
  5672. .mainMenu .boxMenu .boxMenuDepth1 > li > a, .mainMenu .boxMenu .boxMenuDepth1 > li > span {
  5673. display: block;
  5674. padding: 7px 20px;
  5675. white-space: nowrap;
  5676. }
  5677. .mainMenu .boxMenu .boxMenuDepth1 > li.active > a, .mainMenu .boxMenu .boxMenuDepth1 > li > a:hover {
  5678. background-color: rgba(65, 121, 173, 1);
  5679. color: rgba(255, 255, 255, 1);
  5680. text-decoration: none;
  5681. }
  5682. .mainMenu .boxMenu .boxMenuDepth2 li > a {
  5683. color: rgba(255, 255, 255, 1);
  5684. display: block;
  5685. padding: 5px 20px 5px 40px;
  5686. white-space: nowrap;
  5687. }
  5688. .mainMenu .boxMenu .boxMenuDepth2 li.active > a, .mainMenu .boxMenu .boxMenuDepth2 li > a:hover {
  5689. background-color: rgba(65, 121, 173, 1);
  5690. color: rgba(255, 255, 255, 1);
  5691. text-decoration: none;
  5692. }
  5693. .mainMenu .mainMenuShowPrevious, .mainMenu .mainMenuShowNext {
  5694. align-items: center;
  5695. display: flex;
  5696. height: 100%;
  5697. opacity: 0;
  5698. position: absolute;
  5699. top: 0;
  5700. transition: opacity 0.24s linear 0s, visibility 0s linear 0.24s;
  5701. visibility: hidden;
  5702. width: 50px;
  5703. }
  5704. .mainMenu .mainMenuShowPrevious.active, .mainMenu .mainMenuShowNext.active {
  5705. opacity: 1;
  5706. transition-delay: 0s;
  5707. visibility: visible;
  5708. }
  5709. .mainMenu .mainMenuShowPrevious {
  5710. background: rgba(0, 0, 0, 0) linear-gradient(to left, transparent 0%, rgba(50, 92, 132, 1) 75%) repeat scroll 0 0;
  5711. left: 0;
  5712. }
  5713. .mainMenu .mainMenuShowNext {
  5714. background: rgba(0, 0, 0, 0) linear-gradient(to right, transparent 0%, rgba(50, 92, 132, 1) 75%) repeat scroll 0 0;
  5715. justify-content: flex-end;
  5716. right: 0;
  5717. }
  5718. .userPanel {
  5719. flex: 0 0 auto;
  5720. }
  5721. .userPanel > ul {
  5722. display: flex;
  5723. justify-content: flex-end;
  5724. }
  5725. .userPanel > ul > li {
  5726. align-items: center;
  5727. display: flex;
  5728. flex: 0 0 auto;
  5729. }
  5730. .userPanel > ul > li > a {
  5731. align-items: center;
  5732. background: rgba(43, 79, 113, 1) none repeat scroll 0 0;
  5733. color: rgba(255, 255, 255, 1);
  5734. display: flex;
  5735. flex: 0 0 auto;
  5736. height: 50px;
  5737. padding: 0 15px;
  5738. position: relative;
  5739. }
  5740. .userPanel > ul > li > a > span:not(.icon):not(.badge) {
  5741. display: none;
  5742. }
  5743. .userPanel > ul > li > a > .badgeUpdate {
  5744. box-shadow: -1px 2px 3px rgba(0, 0, 0, 0.3), 0 2px 5px rgba(225, 225, 225, 0.3) inset;
  5745. left: 31px;
  5746. padding: 1px 6px;
  5747. position: absolute;
  5748. top: 4px;
  5749. z-index: 101;
  5750. }
  5751. .userPanel > ul > li > a .icon {
  5752. color: rgba(255, 255, 255, 1);
  5753. }
  5754. .userPanel > ul > li.dropdownOpen > a, .userPanel > ul > li.open > a, .userPanel > ul > li:hover > a {
  5755. background: rgba(36, 66, 95, 1) none repeat scroll 0 0;
  5756. color: rgba(255, 255, 255, 1);
  5757. }
  5758. .userPanel > ul > li.dropdownOpen > a .icon, .userPanel > ul > li.open > a .icon, .userPanel > ul > li:hover > a .icon {
  5759. color: rgba(255, 255, 255, 1);
  5760. }
  5761. .userPanel > ul > li#userNotifications:not([data-count="0"]) > a > .icon {
  5762. animation: 5s ease 10s normal none 6 running fa-bell-ring;
  5763. transform-origin: 50% 0 0;
  5764. }
  5765. .userPanel .userPanelAvatar {
  5766. display: none;
  5767. }
  5768. @media (min-width: 1025px) {
  5769. .pageHeaderLogo {
  5770. flex: 1 1 auto;
  5771. }
  5772. .pageHeaderLogo .pageHeaderLogoLarge {
  5773. max-width: 100%;
  5774. }
  5775. .pageHeaderLogo .pageHeaderLogoSmall {
  5776. display: none;
  5777. }
  5778. .pageHeaderLogo > a {
  5779. display: block;
  5780. padding: 10px 0;
  5781. }
  5782. }
  5783. @media (max-width: 1024px) {
  5784. .pageHeaderLogo .pageHeaderLogoLarge {
  5785. display: none;
  5786. }
  5787. .pageHeaderLogo .pageHeaderLogoSmall {
  5788. max-height: 30px;
  5789. }
  5790. }
  5791. .pageHeaderSearch {
  5792. display: none;
  5793. position: fixed;
  5794. }
  5795. .searchBarOpen .pageHeaderSearch {
  5796. display: block;
  5797. z-index: 100;
  5798. }
  5799. .pageHeaderSearchInputContainer {
  5800. display: flex;
  5801. }
  5802. .pageHeaderSearchInputContainer .pageHeaderSearchType {
  5803. display: flex;
  5804. }
  5805. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button {
  5806. align-items: center;
  5807. background-color: rgba(43, 79, 113, 1);
  5808. border-radius: 0 0 0 2px;
  5809. color: rgba(255, 255, 255, 1);
  5810. display: flex;
  5811. max-width: 200px;
  5812. min-width: 140px;
  5813. overflow: hidden;
  5814. padding: 4px 8px;
  5815. position: relative;
  5816. text-align: left;
  5817. text-overflow: ellipsis;
  5818. text-transform: none;
  5819. white-space: nowrap;
  5820. }
  5821. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button::after {
  5822. color: inherit;
  5823. content: "";
  5824. flex: 1 1 0;
  5825. font-family: FontAwesome;
  5826. margin-left: 10px;
  5827. text-align: right;
  5828. }
  5829. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover, .pageHeaderSearchInputContainer .pageHeaderSearchType.dropdownOpen > .button {
  5830. background: rgba(36, 66, 95, 1) none repeat scroll 0 0;
  5831. color: rgba(255, 255, 255, 1);
  5832. }
  5833. .pageHeaderSearchInputContainer .pageHeaderSearchInput {
  5834. background-color: rgba(50, 92, 132, 1);
  5835. border-width: 0;
  5836. color: rgba(255, 255, 255, 1);
  5837. padding-bottom: 8px;
  5838. padding-top: 8px;
  5839. width: 250px;
  5840. }
  5841. .pageHeaderSearchInputContainer .pageHeaderSearchInput:focus, .pageHeaderSearchInputContainer .pageHeaderSearchInput:hover {
  5842. background-color: rgba(50, 92, 132, 1);
  5843. color: rgba(255, 255, 255, 1);
  5844. }
  5845. .pageHeaderSearchInputContainer .pageHeaderSearchInput:focus::-moz-placeholder, .pageHeaderSearchInputContainer .pageHeaderSearchInput:hover::-moz-placeholder {
  5846. color: rgba(207, 207, 207, 1);
  5847. }
  5848. .pageHeaderSearchInputContainer .pageHeaderSearchInput::-moz-placeholder {
  5849. color: rgba(207, 207, 207, 1);
  5850. }
  5851. .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
  5852. background-color: rgba(43, 79, 113, 1);
  5853. border-radius: 0 0 2px;
  5854. color: rgba(255, 255, 255, 1);
  5855. padding: 4px 9px;
  5856. }
  5857. .pageHeaderSearchInputContainer .pageHeaderSearchInputButton:hover {
  5858. background: rgba(36, 66, 95, 1) none repeat scroll 0 0;
  5859. color: rgba(255, 255, 255, 1);
  5860. }
  5861. @media (max-width: 1024px) {
  5862. .pageHeaderPanel > .layoutBoundary {
  5863. justify-content: space-between;
  5864. }
  5865. .userPanel {
  5866. flex: 0 0 auto;
  5867. }
  5868. .userPanel > .userPanelItems {
  5869. display: none;
  5870. }
  5871. .userPanel .userPanelAvatar {
  5872. display: block;
  5873. padding: 0 5px;
  5874. }
  5875. .mainMenu {
  5876. flex: 0 0 auto;
  5877. }
  5878. .mainMenu::before {
  5879. content: "";
  5880. }
  5881. .mainMenu > .boxContent {
  5882. display: none;
  5883. }
  5884. .mainMenu, .userPanel {
  5885. position: relative;
  5886. }
  5887. .mainMenu.pageMenuMobileButtonHasContent::after, .userPanel.pageMenuMobileButtonHasContent::after {
  5888. background-color: #f44336;
  5889. border: 2px solid rgba(58, 109, 156, 1);
  5890. border-radius: 50%;
  5891. content: "";
  5892. height: 14px;
  5893. position: absolute;
  5894. right: -3px;
  5895. top: -3px;
  5896. width: 14px;
  5897. }
  5898. .mainMenu::before, .userPanel:not(.userPanelLoggedIn)::before {
  5899. color: rgba(255, 255, 255, 1);
  5900. font-family: FontAwesome;
  5901. font-size: 28px;
  5902. line-height: 32px;
  5903. padding: 5px;
  5904. }
  5905. .mainMenu:hover::before, .userPanel:hover:not(.userPanelLoggedIn)::before {
  5906. color: rgba(255, 255, 255, 1);
  5907. }
  5908. .userPanel:not(.userPanelLoggedIn)::before {
  5909. content: "";
  5910. }
  5911. .pageHeaderSearch {
  5912. left: 0 !important;
  5913. right: 0 !important;
  5914. }
  5915. .pageHeaderSearch .pageHeaderSearchInputContainer {
  5916. border-radius: 0;
  5917. display: flex;
  5918. flex-wrap: wrap;
  5919. }
  5920. .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType {
  5921. flex: 0 0 100%;
  5922. }
  5923. .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType > .button {
  5924. border-radius: 0;
  5925. max-width: unset;
  5926. min-width: unset;
  5927. padding-bottom: 8px;
  5928. padding-top: 8px;
  5929. width: 100%;
  5930. }
  5931. .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInput {
  5932. flex: 1 1 auto;
  5933. }
  5934. .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
  5935. border-radius: 0;
  5936. }
  5937. .pageHeaderSearch:not(.open) {
  5938. display: none;
  5939. }
  5940. }
  5941. @media (max-width: 544px) {
  5942. .pageHeaderPanel, .pageHeaderFacade > .layoutBoundary {
  5943. transition: transform 0.12s linear 0s;
  5944. }
  5945. .redactorActive .pageHeaderPanel, .redactorActive .pageHeaderFacade > .layoutBoundary {
  5946. transform: translateY(-120%);
  5947. }
  5948. }
  5949. @media (min-width: 1025px) {
  5950. .pageNavigation {
  5951. background-color: rgba(236, 239, 241, 1);
  5952. color: rgba(170, 170, 170, 1);
  5953. flex: 0 0 auto;
  5954. padding: 10px 0;
  5955. }
  5956. .pageNavigation > div {
  5957. align-items: center;
  5958. display: flex;
  5959. justify-content: flex-end;
  5960. min-height: 20px;
  5961. }
  5962. .pageNavigation .icon {
  5963. color: inherit;
  5964. }
  5965. .pageNavigation a {
  5966. color: rgba(44, 62, 80, 1);
  5967. }
  5968. .pageNavigation a:hover {
  5969. color: rgba(44, 62, 80, 1);
  5970. }
  5971. .boxesHeaderBoxes + .pageNavigation {
  5972. margin-top: 1px;
  5973. }
  5974. .pageNavigationIcons {
  5975. display: flex;
  5976. flex: 0 0 auto;
  5977. flex-direction: row-reverse;
  5978. margin-left: 10px;
  5979. }
  5980. .pageNavigationIcons > li {
  5981. flex: 0 0 auto;
  5982. }
  5983. .pageNavigationIcons > li:not(:last-child) {
  5984. margin-left: 10px;
  5985. }
  5986. }
  5987. @media (max-width: 1024px) {
  5988. .pageNavigation {
  5989. display: none;
  5990. }
  5991. }
  5992. @media print {
  5993. *, *::after, *::before {
  5994. background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
  5995. box-shadow: none !important;
  5996. color: #000 !important;
  5997. opacity: 1 !important;
  5998. text-shadow: none !important;
  5999. }
  6000. .pageHeaderContainer, .pageNavigationIcons, .userNotice, .pageAction, .contentHeaderNavigation, .contentFooterNavigation, .paginationTop, .paginationBottom, .buttonList, .collapsibleButton, .columnMark, .statusDisplay, .dialogContainer, .formSubmit, .tabMenu > ul > li:not(.active), .showMore, .boxesSidebarLeft, .boxesSidebarRight, .boxesFooterBoxes, .boxesFooter, .messageFooterButtons, .messageQuickOptions, .messageGroupEditLink, #messageQuickReply, .messageAuthor .badgeOnline, .jsCommentAdd, .userProfileCoverPhoto, .userProfileButtonContainer, .containerListButtonGroup {
  6001. display: none !important;
  6002. }
  6003. .main {
  6004. padding: 30px 0;
  6005. }
  6006. .content {
  6007. flex-basis: auto !important;
  6008. max-width: none !important;
  6009. }
  6010. .pageNavigation {
  6011. display: block;
  6012. padding-top: 10px;
  6013. }
  6014. .pageNavigation .breadcrumbs {
  6015. margin-left: 0;
  6016. }
  6017. .badge {
  6018. padding: 0 !important;
  6019. }
  6020. .badge::before {
  6021. content: "[";
  6022. }
  6023. .badge::after {
  6024. content: "]";
  6025. }
  6026. .userProfileUser {
  6027. position: static !important;
  6028. }
  6029. a.externalURL::after {
  6030. content: " (" attr(href) ")";
  6031. }
  6032. .messageList, .messageList > li:not(:first-child) {
  6033. border-top: 1px solid rgba(65, 121, 173, 1);
  6034. }
  6035. .messageList > li {
  6036. padding-top: 20px;
  6037. }
  6038. .messageSidebar {
  6039. margin: 0 !important;
  6040. padding: 0 !important;
  6041. }
  6042. }
  6043. .sidebar fieldset {
  6044. margin-top: 0;
  6045. }
  6046. .sidebar fieldset > legend {
  6047. float: left;
  6048. width: 100%;
  6049. }
  6050. .sidebar fieldset > legend + * {
  6051. clear: left;
  6052. }
  6053. .sidebar .boxContainer > div:not(.box), .sidebar .boxContainer > fieldset, .sidebar .boxContainer > section:not(.box) {
  6054. background-color: rgba(236, 241, 247, 1);
  6055. }
  6056. @media (min-width: 769px) {
  6057. .sidebar .boxContainer > div:not(.box), .sidebar .boxContainer > fieldset, .sidebar .boxContainer > section:not(.box) {
  6058. padding: 20px;
  6059. }
  6060. }
  6061. @media (max-width: 768px) {
  6062. .sidebar .boxContainer > div:not(.box), .sidebar .boxContainer > fieldset, .sidebar .boxContainer > section:not(.box) {
  6063. padding: 20px 10px;
  6064. }
  6065. }
  6066. .sidebar .boxContainer > div:not(.box):not(:first-child), .sidebar .boxContainer > fieldset:not(:first-child), .sidebar .boxContainer > section:not(.box):not(:first-child) {
  6067. margin-top: 30px;
  6068. }
  6069. .sidebar .boxContainer section:not(.box) > h1, .sidebar .boxContainer fieldset > legend {
  6070. border-bottom-width: 0;
  6071. color: rgba(44, 62, 80, 1);
  6072. font-weight: 400;
  6073. line-height: 1.28;
  6074. margin-bottom: 15px;
  6075. padding: 0;
  6076. }
  6077. @media (min-width: 769px) {
  6078. .sidebar .boxContainer section:not(.box) > h1, .sidebar .boxContainer fieldset > legend {
  6079. font-size: 18px;
  6080. }
  6081. }
  6082. @media (max-width: 768px) {
  6083. .sidebar .boxContainer section:not(.box) > h1, .sidebar .boxContainer fieldset > legend {
  6084. font-size: 18px;
  6085. }
  6086. }
  6087. .sidebar .boxContainer section:not(.box) > h1 > a, .sidebar .boxContainer fieldset > legend > a {
  6088. color: rgba(44, 62, 80, 1);
  6089. }
  6090. .sidebar .boxContainer section:not(.box) > h1 > a > .icon, .sidebar .boxContainer fieldset > legend > a > .icon {
  6091. color: rgba(44, 62, 80, 1);
  6092. }
  6093. .sidebar .boxContainer section:not(.box) > h1 > a:hover, .sidebar .boxContainer fieldset > legend > a:hover {
  6094. color: rgba(44, 62, 80, 1);
  6095. }
  6096. .sidebar .boxContainer section:not(.box) > h1 > a:hover > .icon, .sidebar .boxContainer fieldset > legend > a:hover > .icon {
  6097. color: rgba(44, 62, 80, 1);
  6098. }
  6099. .sidebar .formSubmit:not(:first-child) {
  6100. margin-top: 20px;
  6101. }
  6102. .sidebar .boxContainer > div .boxContent::before, .sidebar .boxContainer > fieldset .boxContent::before, .sidebar .boxContainer > section .boxContent::before, .sidebar .boxContainer > div .boxContent::after, .sidebar .boxContainer > fieldset .boxContent::after, .sidebar .boxContainer > section .boxContent::after {
  6103. content: "";
  6104. display: table;
  6105. }
  6106. .sidebar .boxContainer > div .boxContent::after, .sidebar .boxContainer > fieldset .boxContent::after, .sidebar .boxContainer > section .boxContent::after {
  6107. clear: both;
  6108. }
  6109. .sidebar .boxContainer > div .button.more, .sidebar .boxContainer > fieldset .button.more, .sidebar .boxContainer > section .button.more {
  6110. float: right;
  6111. margin-top: 15px;
  6112. }
  6113. .sidebar .boxTitle .badge {
  6114. float: right;
  6115. top: 2px;
  6116. }
  6117. .sidebar .sidebarItemList > li:not(:last-child), .sidebar .sidebarBoxList > li:not(:last-child) {
  6118. margin-bottom: 10px;
  6119. }
  6120. .aclList {
  6121. }
  6122. .aclList > li {
  6123. align-items: center;
  6124. display: flex;
  6125. padding: 10px 0;
  6126. }
  6127. .aclList > li:not(.active) {
  6128. cursor: pointer;
  6129. }
  6130. .aclList > li.active {
  6131. background-color: rgba(242, 242, 242, 1);
  6132. }
  6133. .aclList > li > .icon {
  6134. flex: 0 0 36px;
  6135. padding: 0 5px;
  6136. }
  6137. .aclList > li > .aclLabel {
  6138. flex: 1 1 auto;
  6139. margin: 0 5px;
  6140. }
  6141. .aclList + .dropdown {
  6142. display: block;
  6143. margin-top: 20px;
  6144. }
  6145. .aclPermissionList {
  6146. margin-top: 40px;
  6147. position: relative;
  6148. }
  6149. .aclPermissionList::after, .aclPermissionList::before {
  6150. font-weight: 400;
  6151. min-width: 60px;
  6152. position: absolute;
  6153. text-align: center;
  6154. top: -5px;
  6155. transform: translateY(-100%);
  6156. }
  6157. @media (min-width: 769px) {
  6158. .aclPermissionList::after, .aclPermissionList::before {
  6159. font-size: 12px;
  6160. }
  6161. }
  6162. @media (max-width: 768px) {
  6163. .aclPermissionList::after, .aclPermissionList::before {
  6164. font-size: 12px;
  6165. }
  6166. }
  6167. .aclPermissionList::after {
  6168. content: attr(data-deny);
  6169. right: 0;
  6170. }
  6171. .aclPermissionList::before {
  6172. content: attr(data-grant);
  6173. right: 80px;
  6174. }
  6175. .aclPermissionList > li.aclCategory {
  6176. font-weight: 400;
  6177. line-height: 1.28;
  6178. padding: 20px 10px 10px 0;
  6179. }
  6180. @media (min-width: 769px) {
  6181. .aclPermissionList > li.aclCategory {
  6182. font-size: 18px;
  6183. }
  6184. }
  6185. @media (max-width: 768px) {
  6186. .aclPermissionList > li.aclCategory {
  6187. font-size: 18px;
  6188. }
  6189. }
  6190. .aclPermissionList > li.aclCategory:hover {
  6191. background-color: transparent;
  6192. }
  6193. .aclPermissionList > li:not(.aclCategory) {
  6194. display: flex;
  6195. padding: 10px 0;
  6196. }
  6197. .aclPermissionList > li > span {
  6198. flex: 1 1 auto;
  6199. padding-left: 10px;
  6200. }
  6201. .aclPermissionList > li > label {
  6202. cursor: pointer;
  6203. flex: 0 0 auto;
  6204. padding: 0 20px;
  6205. }
  6206. .aclPermissionList > li > label + label {
  6207. margin-left: 20px;
  6208. }
  6209. .wcfAdLocation {
  6210. overflow: hidden;
  6211. }
  6212. @media (min-width: 1025px) {
  6213. .wcfAdLocationLogo {
  6214. float: right;
  6215. margin-left: 30px;
  6216. }
  6217. }
  6218. @media (max-width: 1024px) {
  6219. .wcfAdLocationLogo {
  6220. display: none;
  6221. }
  6222. }
  6223. .wcfAdLocationHeaderContent {
  6224. margin-bottom: 20px;
  6225. }
  6226. .wcfAdLocationFooterContent {
  6227. margin-top: 20px;
  6228. }
  6229. .wcfAdLocationHeaderContent, .wcfAdLocationFooterContent, .wcfAdLocationFooterBottom, .wcfAdLocationSidebarTop, .wcfAdLocationSidebarBottom {
  6230. text-align: center;
  6231. }
  6232. .wcfAdLocationHeaderContent > div, .wcfAdLocationFooterContent > div, .wcfAdLocationFooterBottom > div, .wcfAdLocationSidebarTop > div, .wcfAdLocationSidebarBottom > div {
  6233. display: inline-block;
  6234. text-align: left;
  6235. }
  6236. .error, .info, .success, .warning {
  6237. border-left: 5px solid transparent;
  6238. margin-top: 20px;
  6239. }
  6240. @media (min-width: 769px) {
  6241. .error, .info, .success, .warning {
  6242. padding: 10px 20px;
  6243. }
  6244. }
  6245. @media (max-width: 768px) {
  6246. .error, .info, .success, .warning {
  6247. padding: 10px;
  6248. }
  6249. }
  6250. .error a, .info a, .success a, .warning a {
  6251. font-weight: 600;
  6252. }
  6253. .error a:hover, .info a:hover, .success a:hover, .warning a:hover {
  6254. text-decoration: underline;
  6255. }
  6256. .error {
  6257. background-color: rgba(242, 222, 222, 1);
  6258. border-color: rgba(235, 204, 204, 1);
  6259. color: rgba(169, 68, 66, 1);
  6260. }
  6261. .error a {
  6262. color: rgba(169, 68, 66, 1);
  6263. }
  6264. .error a:hover {
  6265. color: rgba(169, 68, 66, 1);
  6266. }
  6267. .info {
  6268. background-color: rgba(217, 237, 247, 1);
  6269. border-color: rgba(188, 223, 241, 1);
  6270. color: rgba(49, 112, 143, 1);
  6271. }
  6272. .info a {
  6273. color: rgba(49, 112, 143, 1);
  6274. }
  6275. .info a:hover {
  6276. color: rgba(49, 112, 143, 1);
  6277. }
  6278. .success {
  6279. background-color: rgba(223, 240, 216, 1);
  6280. border-color: rgba(208, 233, 198, 1);
  6281. color: rgba(60, 118, 61, 1);
  6282. }
  6283. .success a {
  6284. color: rgba(60, 118, 61, 1);
  6285. }
  6286. .success a:hover {
  6287. color: rgba(60, 118, 61, 1);
  6288. }
  6289. .warning {
  6290. background-color: rgba(252, 248, 227, 1);
  6291. border-color: rgba(250, 242, 204, 1);
  6292. color: rgba(138, 109, 59, 1);
  6293. }
  6294. .warning a {
  6295. color: rgba(138, 109, 59, 1);
  6296. }
  6297. .warning a:hover {
  6298. color: rgba(138, 109, 59, 1);
  6299. }
  6300. .innerError, .innerInfo {
  6301. display: table;
  6302. line-height: 1.5;
  6303. margin-top: 8px;
  6304. padding: 5px 10px;
  6305. position: relative;
  6306. }
  6307. .innerError::before, .innerInfo::before {
  6308. -moz-border-bottom-colors: none;
  6309. -moz-border-left-colors: none;
  6310. -moz-border-right-colors: none;
  6311. -moz-border-top-colors: none;
  6312. border-color: transparent;
  6313. border-image: none;
  6314. border-style: solid;
  6315. border-width: 0 6px 6px;
  6316. content: "";
  6317. display: inline-block;
  6318. left: 10px;
  6319. position: absolute;
  6320. top: -6px;
  6321. z-index: 101;
  6322. }
  6323. .innerError {
  6324. background-color: #f2dede;
  6325. color: #a94442;
  6326. }
  6327. .innerError::before {
  6328. border-bottom-color: #f2dede;
  6329. }
  6330. .innerError a {
  6331. color: rgba(169, 68, 66, 1);
  6332. }
  6333. .innerError a:hover {
  6334. color: rgba(169, 68, 66, 1);
  6335. }
  6336. .pageFooterStickyNotice {
  6337. bottom: 0;
  6338. left: 0;
  6339. position: fixed;
  6340. right: 0;
  6341. z-index: 600;
  6342. }
  6343. .pageFooterStickyNotice .error, .pageFooterStickyNotice .info, .pageFooterStickyNotice .success, .pageFooterStickyNotice .warning {
  6344. border-left-width: 0;
  6345. border-top-style: solid;
  6346. border-top-width: 1px;
  6347. margin-top: 0;
  6348. padding: 10px 0;
  6349. }
  6350. @media (max-width: 768px) {
  6351. .pageFooterStickyNotice .error, .pageFooterStickyNotice .info, .pageFooterStickyNotice .success, .pageFooterStickyNotice .warning {
  6352. font-weight: 400;
  6353. }
  6354. }
  6355. @media (max-width: 768px) and (min-width: 769px) {
  6356. .pageFooterStickyNotice .error, .pageFooterStickyNotice .info, .pageFooterStickyNotice .success, .pageFooterStickyNotice .warning {
  6357. font-size: 12px;
  6358. }
  6359. }
  6360. @media (max-width: 768px) and (max-width: 768px) {
  6361. .pageFooterStickyNotice .error, .pageFooterStickyNotice .info, .pageFooterStickyNotice .success, .pageFooterStickyNotice .warning {
  6362. font-size: 12px;
  6363. }
  6364. }
  6365. .pageFooterStickyNotice .cookiePolicyNotice .layoutBoundary {
  6366. align-items: center;
  6367. display: flex;
  6368. }
  6369. @media (max-width: 768px) {
  6370. .pageFooterStickyNotice .cookiePolicyNotice .layoutBoundary {
  6371. flex-wrap: wrap;
  6372. }
  6373. }
  6374. .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeText {
  6375. flex: 1 1 auto;
  6376. }
  6377. @media (max-width: 768px) {
  6378. .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeText {
  6379. flex-basis: 100%;
  6380. margin-bottom: 5px;
  6381. }
  6382. }
  6383. .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeMoreInformation, .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeDismiss {
  6384. flex: 0 0 auto;
  6385. }
  6386. .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeDismiss {
  6387. margin-left: 5px;
  6388. }
  6389. .innerInfo {
  6390. background-color: rgba(217, 237, 247, 1);
  6391. color: rgba(49, 112, 143, 1);
  6392. }
  6393. .innerInfo::before {
  6394. border-bottom-color: rgba(188, 223, 241, 1);
  6395. }
  6396. .innerInfo a {
  6397. color: rgba(49, 112, 143, 1);
  6398. }
  6399. .innerInfo a:hover {
  6400. color: rgba(49, 112, 143, 1);
  6401. }
  6402. .noticeDismissible > .jsDismissNoticeButton {
  6403. float: right;
  6404. }
  6405. @media (max-width: 1024px) {
  6406. .noticeDismissible > .jsDismissNoticeButton {
  6407. font-size: 18px;
  6408. height: 24px;
  6409. line-height: 24px;
  6410. width: 24px;
  6411. }
  6412. }
  6413. .articleImage {
  6414. display: flex;
  6415. flex-wrap: wrap;
  6416. }
  6417. .articleImage .articleImageWrapper {
  6418. align-items: center;
  6419. display: flex;
  6420. max-height: 300px;
  6421. overflow: hidden;
  6422. }
  6423. .articleImage .articleImageWrapper img {
  6424. height: auto !important;
  6425. width: 100% !important;
  6426. }
  6427. .articleImage figcaption {
  6428. color: rgba(125, 130, 135, 1);
  6429. flex: 1 0 auto;
  6430. font-weight: 400;
  6431. margin-top: 5px;
  6432. text-align: center;
  6433. }
  6434. @media (min-width: 769px) {
  6435. .articleImage figcaption {
  6436. font-size: 12px;
  6437. }
  6438. }
  6439. @media (max-width: 768px) {
  6440. .articleImage figcaption {
  6441. font-size: 12px;
  6442. }
  6443. }
  6444. .articleContent .articleTeaser {
  6445. font-weight: 600;
  6446. margin-bottom: 20px;
  6447. }
  6448. .articleContent .articleTagList, .articleContent .articleLikeSection {
  6449. margin-top: 20px;
  6450. }
  6451. .articleContent .articleLikeSection {
  6452. align-items: center;
  6453. }
  6454. .articleContent .articleLikeButtons {
  6455. justify-content: flex-end;
  6456. }
  6457. .articleContent .articleLikeButtons .invisible {
  6458. display: inline;
  6459. }
  6460. .articleAboutAuthor .articleAboutAuthorText {
  6461. font-style: italic;
  6462. }
  6463. .articleAboutAuthor .articleAboutAuthorUsername {
  6464. margin-top: 5px;
  6465. }
  6466. .articleAboutAuthor .articleAboutAuthorUsername .username {
  6467. font-weight: 400;
  6468. line-height: 1.28;
  6469. }
  6470. @media (min-width: 769px) {
  6471. .articleAboutAuthor .articleAboutAuthorUsername .username {
  6472. font-size: 18px;
  6473. }
  6474. }
  6475. @media (max-width: 768px) {
  6476. .articleAboutAuthor .articleAboutAuthorUsername .username {
  6477. font-size: 18px;
  6478. }
  6479. }
  6480. .articleAboutAuthor .articleAboutAuthorUsername .userTitleBadge {
  6481. top: -2px;
  6482. }
  6483. @media (min-width: 769px) {
  6484. .articleNavigation > nav > ul {
  6485. display: flex;
  6486. }
  6487. }
  6488. .articleNavigation .previousArticleButton, .articleNavigation .nextArticleButton {
  6489. display: flex;
  6490. }
  6491. @media (min-width: 769px) {
  6492. .articleNavigation .previousArticleButton, .articleNavigation .nextArticleButton {
  6493. flex: 0 0 50%;
  6494. }
  6495. }
  6496. .articleNavigation .previousArticleButton > a, .articleNavigation .nextArticleButton > a {
  6497. color: rgba(44, 62, 80, 1);
  6498. display: flex;
  6499. }
  6500. .articleNavigation .previousArticleButton > a::before, .articleNavigation .nextArticleButton > a::before {
  6501. align-self: center;
  6502. display: block;
  6503. flex: 0 0 auto;
  6504. font-family: FontAwesome;
  6505. font-size: 36px;
  6506. }
  6507. .articleNavigation .previousArticleButton > a > div, .articleNavigation .nextArticleButton > a > div {
  6508. flex: 1 1 auto;
  6509. }
  6510. .articleNavigation .previousArticleButton > a .articleNavigationEntityName, .articleNavigation .nextArticleButton > a .articleNavigationEntityName, .articleNavigation .previousArticleButton > a .articleNavigationArticleTitle, .articleNavigation .nextArticleButton > a .articleNavigationArticleTitle {
  6511. display: block;
  6512. }
  6513. .articleNavigation .previousArticleButton > a .articleNavigationEntityName, .articleNavigation .nextArticleButton > a .articleNavigationEntityName {
  6514. text-transform: uppercase;
  6515. }
  6516. .articleNavigation .previousArticleButton > a .articleNavigationArticleTitle, .articleNavigation .nextArticleButton > a .articleNavigationArticleTitle {
  6517. font-weight: 400;
  6518. line-height: 1.28;
  6519. margin-top: 3px;
  6520. }
  6521. @media (min-width: 769px) {
  6522. .articleNavigation .previousArticleButton > a .articleNavigationArticleTitle, .articleNavigation .nextArticleButton > a .articleNavigationArticleTitle {
  6523. font-size: 18px;
  6524. }
  6525. }
  6526. @media (max-width: 768px) {
  6527. .articleNavigation .previousArticleButton > a .articleNavigationArticleTitle, .articleNavigation .nextArticleButton > a .articleNavigationArticleTitle {
  6528. font-size: 18px;
  6529. }
  6530. }
  6531. .articleNavigation .previousArticleButton > a .articleNavigationArticleImage > img, .articleNavigation .nextArticleButton > a .articleNavigationArticleImage > img {
  6532. border-radius: 2px;
  6533. opacity: 0.85;
  6534. transition: opacity 0.2s ease 0s;
  6535. }
  6536. .articleNavigation .previousArticleButton > a:hover::before, .articleNavigation .nextArticleButton > a:hover::before {
  6537. color: rgba(191, 54, 12, 1);
  6538. }
  6539. .articleNavigation .previousArticleButton > a:hover .articleNavigationArticleTitle, .articleNavigation .nextArticleButton > a:hover .articleNavigationArticleTitle {
  6540. color: rgba(191, 54, 12, 1);
  6541. }
  6542. .articleNavigation .previousArticleButton > a:hover .articleNavigationArticleImage > img, .articleNavigation .nextArticleButton > a:hover .articleNavigationArticleImage > img {
  6543. opacity: 1;
  6544. }
  6545. @media (min-width: 769px) {
  6546. .articleNavigation .previousArticleButton {
  6547. padding-right: 10px;
  6548. }
  6549. }
  6550. .articleNavigation .previousArticleButton > a::before {
  6551. content: "";
  6552. }
  6553. .articleNavigation .previousArticleButton > a > div {
  6554. margin-left: 10px;
  6555. }
  6556. .articleNavigation .nextArticleButton {
  6557. justify-content: flex-end;
  6558. text-align: right;
  6559. }
  6560. @media (min-width: 769px) {
  6561. .articleNavigation .nextArticleButton {
  6562. margin-left: 50%;
  6563. padding-left: 10px;
  6564. }
  6565. }
  6566. .articleNavigation .nextArticleButton .articleNavigationArticleImage {
  6567. margin-left: 15px;
  6568. margin-right: 0;
  6569. order: 1;
  6570. }
  6571. .articleNavigation .nextArticleButton > a::before {
  6572. content: "";
  6573. order: 1;
  6574. }
  6575. .articleNavigation .nextArticleButton > a > div {
  6576. margin-right: 10px;
  6577. }
  6578. @media (max-width: 768px) {
  6579. .articleNavigation .previousArticleButton + .nextArticleButton {
  6580. margin-top: 20px;
  6581. }
  6582. }
  6583. @media (min-width: 769px) {
  6584. .articleNavigation .previousArticleButton + .nextArticleButton {
  6585. margin-left: 0;
  6586. }
  6587. }
  6588. html[dir="rtl"] .articleNavigation .previousArticleButton > a::before {
  6589. content: "";
  6590. }
  6591. html[dir="rtl"] .articleNavigation .nextArticleButton > a::before {
  6592. content: "";
  6593. }
  6594. .articleList .articleListMetaData {
  6595. color: rgba(125, 130, 135, 1);
  6596. margin-top: 2px;
  6597. }
  6598. .articleList .articleListMetaData .icon {
  6599. color: inherit;
  6600. }
  6601. .articleList a {
  6602. color: inherit;
  6603. }
  6604. .articleList a:hover {
  6605. color: inherit;
  6606. }
  6607. .articleList a:hover .articleListImage > img {
  6608. opacity: 1;
  6609. }
  6610. .articleList a:hover .articleListTitle {
  6611. color: rgba(191, 54, 12, 1);
  6612. }
  6613. .articleList .articleListImage > img {
  6614. border-radius: 2px;
  6615. opacity: 0.85;
  6616. transition: opacity 0.2s ease 0s;
  6617. }
  6618. .articleList > li:not(:first-child) {
  6619. margin-top: 30px;
  6620. }
  6621. @media (max-width: 544px) {
  6622. .articleList .box128 > .articleListImage {
  6623. margin-right: 10px;
  6624. }
  6625. .articleList .articleListImage > img {
  6626. height: 64px !important;
  6627. width: 64px !important;
  6628. }
  6629. }
  6630. .boxesFooterBoxes .articleList {
  6631. display: flex;
  6632. flex-wrap: wrap;
  6633. margin: 0 -5px -20px;
  6634. }
  6635. .boxesFooterBoxes .articleList > li {
  6636. margin: 0 5px 20px;
  6637. }
  6638. .boxesFooterBoxes .articleList .articleListImage > img {
  6639. height: auto !important;
  6640. max-width: 280px;
  6641. width: 100% !important;
  6642. }
  6643. .boxesFooterBoxes .articleList .articleListImage + .articleListTitle {
  6644. margin-top: 5px;
  6645. }
  6646. .boxesFooterBoxes .articleList .articleListMetaData {
  6647. display: none;
  6648. }
  6649. @media (min-width: 1025px) {
  6650. .boxesFooterBoxes .articleList > li {
  6651. flex: 0 0 calc(100% / 3 - 10px);
  6652. max-width: calc(100% / 3 - 10px);
  6653. }
  6654. .boxesFooterBoxes .boxFullWidth .articleList > li {
  6655. flex: 0 0 calc(100% / 6 - 10px);
  6656. max-width: calc(100% / 6 - 10px);
  6657. }
  6658. }
  6659. @media (min-width: 545px) {
  6660. .boxesFooterBoxes .articleList > li {
  6661. flex: 0 0 calc(100% / 3 - 10px);
  6662. max-width: calc(100% / 3 - 10px);
  6663. }
  6664. }
  6665. @media (max-width: 544px) {
  6666. .boxesFooterBoxes .articleList {
  6667. justify-content: center;
  6668. }
  6669. .boxesFooterBoxes .articleList > li {
  6670. width: 280px;
  6671. }
  6672. }
  6673. .attachmentFileList > ul > li:not(:last-child) {
  6674. margin-right: 10px;
  6675. }
  6676. .attachmentThumbnailList > ul {
  6677. margin-bottom: -15px;
  6678. }
  6679. @media (min-width: 545px) {
  6680. .attachmentThumbnailList > ul {
  6681. margin-right: -10px;
  6682. }
  6683. }
  6684. .attachmentThumbnail {
  6685. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  6686. margin-bottom: 15px !important;
  6687. position: relative;
  6688. }
  6689. @media (min-width: 545px) {
  6690. .attachmentThumbnail {
  6691. margin-right: 10px !important;
  6692. }
  6693. }
  6694. @media (max-width: 544px) {
  6695. .attachmentThumbnail {
  6696. margin-right: 0 !important;
  6697. width: 100%;
  6698. }
  6699. }
  6700. .attachmentThumbnail .attachmentThumbnailContainer {
  6701. padding: 2px 2px 0;
  6702. position: relative;
  6703. }
  6704. .attachmentThumbnail .attachmentThumbnailImage {
  6705. align-items: center;
  6706. background-color: #333;
  6707. display: flex;
  6708. justify-content: center;
  6709. overflow: hidden;
  6710. text-align: center;
  6711. }
  6712. @media (min-width: 545px) {
  6713. .attachmentThumbnail .attachmentThumbnailImage {
  6714. height: 210px;
  6715. width: 280px;
  6716. }
  6717. }
  6718. @media (max-width: 544px) {
  6719. .attachmentThumbnail .attachmentThumbnailImage {
  6720. max-height: 210px;
  6721. min-height: 100px;
  6722. }
  6723. }
  6724. .attachmentThumbnail .attachmentThumbnailImage img {
  6725. backface-visibility: hidden;
  6726. max-width: 100%;
  6727. opacity: 0.85;
  6728. transform: translate3d(0px, 0px, 0px);
  6729. transition: opacity 0.2s ease 0s;
  6730. }
  6731. @media (max-width: 544px) {
  6732. .attachmentThumbnail .attachmentThumbnailImage .attachmentThumbnailImageScalable {
  6733. width: 100%;
  6734. }
  6735. }
  6736. .attachmentThumbnail .attachmentThumbnailData {
  6737. backface-visibility: hidden;
  6738. background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(0, 0, 0, 0) 65%, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0 0;
  6739. bottom: 0;
  6740. left: 2px;
  6741. position: absolute;
  6742. right: 2px;
  6743. top: 2px;
  6744. transform: translate3d(0px, 0px, 0px);
  6745. }
  6746. .attachmentThumbnail .attachmentFilename {
  6747. bottom: 0;
  6748. color: #fff;
  6749. font-weight: 400;
  6750. line-height: 1.28;
  6751. overflow: hidden;
  6752. padding: 10px;
  6753. position: absolute;
  6754. text-overflow: ellipsis;
  6755. text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
  6756. transition: opacity 0.2s ease 0s;
  6757. white-space: nowrap;
  6758. width: 100%;
  6759. }
  6760. @media (min-width: 769px) {
  6761. .attachmentThumbnail .attachmentFilename {
  6762. font-size: 18px;
  6763. }
  6764. }
  6765. @media (max-width: 768px) {
  6766. .attachmentThumbnail .attachmentFilename {
  6767. font-size: 18px;
  6768. }
  6769. }
  6770. .attachmentThumbnail .attachmentMetaData {
  6771. color: rgba(125, 130, 135, 1);
  6772. padding: 10px 15px;
  6773. }
  6774. .attachmentThumbnail .attachmentMetaData li:not(:last-child) {
  6775. margin-right: 10px;
  6776. }
  6777. .attachmentThumbnail .attachmentMetaData .icon {
  6778. color: inherit;
  6779. }
  6780. .attachmentThumbnail:hover .attachmentThumbnailImage img {
  6781. opacity: 1;
  6782. }
  6783. .attachmentThumbnail:hover .attachmentFilename {
  6784. opacity: 0;
  6785. }
  6786. .formAttachmentContent > .formAttachmentList {
  6787. display: flex;
  6788. flex-wrap: wrap;
  6789. margin-left: 0 !important;
  6790. }
  6791. .formAttachmentContent > .formAttachmentList > li {
  6792. display: flex;
  6793. flex: 0 0 100%;
  6794. margin-bottom: 20px;
  6795. }
  6796. .formAttachmentContent > .formAttachmentList > li > .attachmentTinyThumbnail {
  6797. border-bottom-width: 0;
  6798. }
  6799. @media (min-width: 769px) {
  6800. .formAttachmentContent > .formAttachmentList {
  6801. margin-right: -20px;
  6802. }
  6803. .formAttachmentContent > .formAttachmentList > li {
  6804. flex: 0 0 calc(50% - 21px);
  6805. margin-right: 20px;
  6806. max-width: calc(50% - 21px);
  6807. }
  6808. }
  6809. .formAttachmentContent > dl {
  6810. margin-top: 0 !important;
  6811. }
  6812. .formAttachmentContent > dl > dd > div {
  6813. align-items: center;
  6814. display: flex;
  6815. }
  6816. .formAttachmentContent > dl > dd > div > .button {
  6817. flex: 0 0 auto;
  6818. }
  6819. .formAttachmentContent > dl > dd > div > .button:not(:first-child) {
  6820. margin-left: 10px;
  6821. }
  6822. .formAttachmentContent > dl > dd > div + small {
  6823. margin-top: 10px !important;
  6824. }
  6825. .attachmentTinyThumbnail {
  6826. max-height: 64px;
  6827. max-width: 64px;
  6828. }
  6829. .embeddedAttachmentLink, .embeddedImageLink {
  6830. border: 1px solid rgba(224, 224, 224, 1);
  6831. display: inline-block;
  6832. max-width: 100%;
  6833. min-height: 48px;
  6834. padding: 2px;
  6835. position: relative;
  6836. }
  6837. .embeddedAttachmentLink::after, .embeddedImageLink::after {
  6838. background-color: rgba(0, 0, 0, 0.8);
  6839. border-radius: 2px;
  6840. bottom: 5px;
  6841. box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
  6842. color: white;
  6843. content: "";
  6844. display: block;
  6845. font-family: FontAwesome;
  6846. font-size: 21px;
  6847. font-style: normal;
  6848. font-weight: normal;
  6849. opacity: 0.5;
  6850. padding: 2px 8px;
  6851. position: absolute;
  6852. right: 5px;
  6853. text-decoration: none;
  6854. transition: opacity 0.2s ease 0s;
  6855. }
  6856. .embeddedAttachmentLink:hover::after, .embeddedImageLink:hover::after {
  6857. opacity: 0.8;
  6858. }
  6859. .avatarEdit .avatarType {
  6860. display: flex;
  6861. }
  6862. .avatarEdit .avatarType > dt {
  6863. flex: 0 0 auto;
  6864. order: 2;
  6865. }
  6866. .avatarEdit .avatarType > dd {
  6867. order: 1;
  6868. }
  6869. .avatarEdit .avatarType .avatarUploadButtonContainer {
  6870. margin-top: 10px;
  6871. }
  6872. @media (min-width: 769px) {
  6873. .avatarEdit .avatarType {
  6874. min-height: 100px;
  6875. }
  6876. .avatarEdit .avatarType > dt:not(:empty) {
  6877. margin: 0 0 0 30px;
  6878. }
  6879. .avatarEdit .avatarType > dd {
  6880. flex: 1 1 auto;
  6881. }
  6882. .avatarEdit .avatarType + .avatarType {
  6883. margin-top: 30px;
  6884. }
  6885. .avatarEdit .avatarType .avatarUploadButtonContainer {
  6886. margin-left: 24px;
  6887. }
  6888. }
  6889. @media (max-width: 768px) {
  6890. .avatarEdit .avatarType {
  6891. flex-wrap: wrap;
  6892. }
  6893. .avatarEdit .avatarType > dt:not(:empty) {
  6894. flex: 0 0 100%;
  6895. margin-top: 20px;
  6896. text-align: center;
  6897. }
  6898. .avatarEdit .avatarType > dd {
  6899. flex: 0 0 100%;
  6900. }
  6901. .avatarEdit .avatarType .avatarUploadButtonContainer {
  6902. text-align: center;
  6903. }
  6904. }
  6905. .badge, a.badge {
  6906. background-color: rgba(44, 62, 80, 1);
  6907. border-radius: 2px;
  6908. color: rgba(250, 250, 250, 1);
  6909. display: inline-block;
  6910. font-weight: 400;
  6911. line-height: 1.28;
  6912. overflow-wrap: normal;
  6913. padding: 2px 6px;
  6914. position: relative;
  6915. vertical-align: middle;
  6916. white-space: nowrap;
  6917. }
  6918. @media (min-width: 769px) {
  6919. .badge, a.badge {
  6920. font-size: 12px;
  6921. }
  6922. }
  6923. @media (max-width: 768px) {
  6924. .badge, a.badge {
  6925. font-size: 12px;
  6926. }
  6927. }
  6928. .badge.badgeUpdate, a.badge.badgeUpdate {
  6929. background-color: rgba(204, 0, 1, 1);
  6930. color: rgba(255, 255, 255, 1);
  6931. font-weight: 600;
  6932. }
  6933. .badge.green, a.badge.green {
  6934. background-color: rgba(0, 153, 0, 1);
  6935. color: rgba(238, 255, 238, 1);
  6936. }
  6937. .badge.red, a.badge.red {
  6938. background-color: rgba(204, 0, 0, 1);
  6939. color: rgba(255, 238, 238, 1);
  6940. }
  6941. .badge.black, a.badge.black {
  6942. background-color: #333;
  6943. color: #fff;
  6944. }
  6945. .badge.brown, a.badge.brown {
  6946. background-color: #c63;
  6947. color: #fff;
  6948. }
  6949. .badge.orange, a.badge.orange {
  6950. background-color: #f90;
  6951. color: #fff;
  6952. }
  6953. .badge.yellow, a.badge.yellow {
  6954. background-color: #ff0;
  6955. color: #333;
  6956. }
  6957. .badge.blue, a.badge.blue {
  6958. background-color: #369;
  6959. color: #fff;
  6960. }
  6961. .badge.purple, a.badge.purple {
  6962. background-color: #c0f;
  6963. color: #fff;
  6964. }
  6965. .badge.pink, a.badge.pink {
  6966. background-color: #f0c;
  6967. color: #fff;
  6968. }
  6969. a.badge:hover {
  6970. color: rgba(250, 250, 250, 1);
  6971. text-decoration: none;
  6972. }
  6973. a.badge.black:hover {
  6974. background-color: #000;
  6975. }
  6976. a.badge.brown:hover {
  6977. background-color: #930;
  6978. }
  6979. a.badge.red:hover {
  6980. background-color: #900;
  6981. }
  6982. a.badge.orange:hover {
  6983. background-color: #f60;
  6984. }
  6985. a.badge.yellow:hover {
  6986. background-color: #cc0;
  6987. }
  6988. a.badge.green:hover {
  6989. background-color: #060;
  6990. }
  6991. a.badge.blue:hover {
  6992. background-color: #036;
  6993. }
  6994. a.badge.purple:hover {
  6995. background-color: #90c;
  6996. }
  6997. a.badge.pink:hover {
  6998. background-color: #c09;
  6999. }
  7000. .breadcrumbs {
  7001. flex: 1 1 0;
  7002. }
  7003. .breadcrumbs > ol {
  7004. display: flex;
  7005. flex-wrap: wrap;
  7006. }
  7007. .breadcrumbs > ol > li {
  7008. flex: 0 0 auto;
  7009. font-weight: 400;
  7010. max-width: 100%;
  7011. }
  7012. @media (min-width: 769px) {
  7013. .breadcrumbs > ol > li {
  7014. font-size: 12px;
  7015. }
  7016. }
  7017. @media (max-width: 768px) {
  7018. .breadcrumbs > ol > li {
  7019. font-size: 12px;
  7020. }
  7021. }
  7022. .breadcrumbs > ol > li:not(:last-child) {
  7023. margin-right: 10px;
  7024. }
  7025. .breadcrumbs > ol > li:not(:last-child)::after {
  7026. color: rgba(170, 170, 170, 1);
  7027. content: "/";
  7028. }
  7029. .breadcrumbs > ol > li:not(:last-child) > a {
  7030. margin-right: 10px;
  7031. }
  7032. .breadcrumbs > ol > li > a {
  7033. color: rgba(44, 62, 80, 1);
  7034. text-decoration: none;
  7035. }
  7036. .breadcrumbs > ol > li > a:hover {
  7037. color: rgba(44, 62, 80, 1);
  7038. text-decoration: underline;
  7039. }
  7040. button, input[type="button"], input[type="reset"], input[type="submit"], .button, a.button {
  7041. -moz-user-select: none;
  7042. background-color: rgba(207, 216, 220, 1);
  7043. border-radius: 2px;
  7044. border-width: 0;
  7045. color: rgba(33, 33, 33, 1);
  7046. cursor: pointer;
  7047. display: inline-block;
  7048. font-family: "Roboto",Arial,Helvetica,sans-serif;
  7049. font-weight: 400;
  7050. line-height: 1.48;
  7051. margin: 0;
  7052. padding: 8px 18px;
  7053. text-decoration: none;
  7054. }
  7055. @media (min-width: 769px) {
  7056. button, input[type="button"], input[type="reset"], input[type="submit"], .button, a.button {
  7057. font-size: 14px;
  7058. }
  7059. }
  7060. @media (max-width: 768px) {
  7061. button, input[type="button"], input[type="reset"], input[type="submit"], .button, a.button {
  7062. font-size: 14px;
  7063. }
  7064. }
  7065. button .icon, input[type="button"] .icon, input[type="reset"] .icon, input[type="submit"] .icon, .button .icon, a.button .icon {
  7066. color: inherit;
  7067. }
  7068. button.active, input.active[type="button"], input.active[type="reset"], input.active[type="submit"], .button.active, a.button.active, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .button:hover, a.button:hover {
  7069. background-color: rgba(120, 144, 156, 1);
  7070. color: rgba(255, 255, 255, 1);
  7071. text-decoration: none;
  7072. }
  7073. button:not(.inputPrefix), input[type="button"]:not(.inputPrefix), input[type="reset"]:not(.inputPrefix), input[type="submit"]:not(.inputPrefix), .button:not(.inputPrefix), a.button:not(.inputPrefix) {
  7074. text-transform: uppercase;
  7075. }
  7076. button.small, input.small[type="button"], input.small[type="reset"], input.small[type="submit"], .button.small, a.button.small {
  7077. font-weight: 400;
  7078. padding: 6px 8px;
  7079. text-transform: none;
  7080. }
  7081. @media (min-width: 769px) {
  7082. button.small, input.small[type="button"], input.small[type="reset"], input.small[type="submit"], .button.small, a.button.small {
  7083. font-size: 12px;
  7084. }
  7085. }
  7086. @media (max-width: 768px) {
  7087. button.small, input.small[type="button"], input.small[type="reset"], input.small[type="submit"], .button.small, a.button.small {
  7088. font-size: 12px;
  7089. }
  7090. }
  7091. button small, input[type="button"] small, input[type="reset"] small, input[type="submit"] small, .button small, a.button small {
  7092. color: inherit;
  7093. }
  7094. button.buttonPrimary, input.buttonPrimary[type="button"], input[type="submit"], .button.buttonPrimary, a.button.buttonPrimary {
  7095. background-color: rgba(33, 150, 243, 1);
  7096. color: rgba(255, 255, 255, 1);
  7097. }
  7098. button.buttonPrimary.active, input.buttonPrimary.active[type="button"], input.active[type="submit"], .button.buttonPrimary.active, a.button.buttonPrimary.active, button.buttonPrimary:hover, input.buttonPrimary[type="button"]:hover, input[type="submit"]:hover, .button.buttonPrimary:hover, a.button.buttonPrimary:hover {
  7099. background-color: rgba(26, 119, 201, 1);
  7100. color: rgba(255, 255, 255, 1);
  7101. }
  7102. button:disabled, input[type="button"]:disabled, input[type="reset"]:disabled, input[type="submit"]:disabled, .button:disabled, a.button:disabled, button.disabled, input.disabled[type="button"], input.disabled[type="reset"], input.disabled[type="submit"], .button.disabled, a.button.disabled {
  7103. background-color: rgba(223, 223, 223, 1) !important;
  7104. color: rgba(165, 165, 165, 1) !important;
  7105. cursor: not-allowed !important;
  7106. }
  7107. .dropdownOpen > button, .dropdownOpen > input[type="button"], .dropdownOpen > input[type="reset"], .dropdownOpen > input[type="submit"], .dropdownOpen > .button, .dropdownOpen > a.button {
  7108. background-color: rgba(120, 144, 156, 1);
  7109. color: rgba(255, 255, 255, 1);
  7110. }
  7111. .dropdownOpen > button.buttonPrimary, .dropdownOpen > input.buttonPrimary[type="button"], .dropdownOpen > input[type="submit"], .dropdownOpen > .button.buttonPrimary, .dropdownOpen > a.button.buttonPrimary {
  7112. background-color: rgba(26, 119, 201, 1);
  7113. color: rgba(255, 255, 255, 1);
  7114. }
  7115. .buttonList {
  7116. display: flex;
  7117. flex-wrap: wrap;
  7118. }
  7119. .buttonList > li {
  7120. flex: 0 1 auto;
  7121. }
  7122. .buttonList > li:not(:last-child) {
  7123. margin-right: 5px;
  7124. }
  7125. .buttonList.commaSeparated > li:not(:last-child)::after {
  7126. content: ",";
  7127. padding-left: 1px;
  7128. }
  7129. .buttonList.dotSeparated > li:not(:last-child)::after {
  7130. content: "·";
  7131. margin-left: 5px;
  7132. }
  7133. .buttonList.smallButtons .button {
  7134. font-weight: 400;
  7135. padding: 6px 8px;
  7136. text-transform: none;
  7137. }
  7138. @media (min-width: 769px) {
  7139. .buttonList.smallButtons .button {
  7140. font-size: 12px;
  7141. }
  7142. }
  7143. @media (max-width: 768px) {
  7144. .buttonList.smallButtons .button {
  7145. font-size: 12px;
  7146. }
  7147. }
  7148. .buttonList.letters {
  7149. margin-bottom: -10px;
  7150. }
  7151. .buttonList.letters > li {
  7152. flex: 0 0 auto;
  7153. margin-bottom: 10px;
  7154. width: 10%;
  7155. }
  7156. .buttonList.letters > li.lettersReset {
  7157. width: auto;
  7158. }
  7159. .buttonList.letters > li > a {
  7160. display: block;
  7161. text-align: center;
  7162. }
  7163. .buttonGroupNavigation > ul {
  7164. display: flex;
  7165. flex-wrap: wrap;
  7166. }
  7167. .buttonGroupNavigation > ul > li {
  7168. flex: 0 1 auto;
  7169. }
  7170. .buttonGroupNavigation > ul > li:not(:last-child) {
  7171. margin-right: 5px;
  7172. }
  7173. .buttonGroupNavigation > ul.commaSeparated > li:not(:last-child)::after {
  7174. content: ",";
  7175. padding-left: 1px;
  7176. }
  7177. .buttonGroupNavigation > ul.dotSeparated > li:not(:last-child)::after {
  7178. content: "·";
  7179. margin-left: 5px;
  7180. }
  7181. .buttonGroup, .messageFooterButtons {
  7182. display: flex;
  7183. flex-wrap: wrap;
  7184. margin-bottom: -1px;
  7185. }
  7186. .buttonGroup > li, .messageFooterButtons > li {
  7187. flex: 0 1 auto;
  7188. }
  7189. .buttonGroup > li:not(:last-child), .messageFooterButtons > li:not(:last-child) {
  7190. margin-right: 5px;
  7191. }
  7192. .buttonGroup.commaSeparated > li:not(:last-child)::after, .messageFooterButtons.commaSeparated > li:not(:last-child)::after {
  7193. content: ",";
  7194. padding-left: 1px;
  7195. }
  7196. .buttonGroup.dotSeparated > li:not(:last-child)::after, .messageFooterButtons.dotSeparated > li:not(:last-child)::after {
  7197. content: "·";
  7198. margin-left: 5px;
  7199. }
  7200. .buttonGroup > li, .messageFooterButtons > li {
  7201. margin-bottom: 1px;
  7202. }
  7203. .buttonGroup > li:not(:last-child), .messageFooterButtons > li:not(:last-child) {
  7204. margin-right: 1px;
  7205. }
  7206. .buttonGroup > li:first-child .button, .messageFooterButtons > li:first-child .button {
  7207. border-bottom-left-radius: 2px;
  7208. border-top-left-radius: 2px;
  7209. }
  7210. .buttonGroup > li:last-child .button, .messageFooterButtons > li:last-child .button {
  7211. border-bottom-right-radius: 2px;
  7212. border-top-right-radius: 2px;
  7213. }
  7214. .buttonGroup > li .button, .messageFooterButtons > li .button {
  7215. border-radius: 0;
  7216. border-width: 0;
  7217. }
  7218. .flexibleButtonGroup {
  7219. display: flex;
  7220. flex-wrap: wrap;
  7221. }
  7222. .flexibleButtonGroup > li {
  7223. display: flex;
  7224. flex: 0 0 auto;
  7225. }
  7226. .flexibleButtonGroup > li:not(:last-child) {
  7227. margin-right: 5px;
  7228. }
  7229. .flexibleButtonGroup > li.spaceAfter:not(:last-child) {
  7230. margin-right: 20px;
  7231. }
  7232. .flexibleButtonGroup > li > input[type="radio"] {
  7233. left: -3000px;
  7234. opacity: 0;
  7235. position: absolute;
  7236. }
  7237. .flexibleButtonGroup > li > input[type="radio"]:checked + label {
  7238. cursor: default;
  7239. }
  7240. .flexibleButtonGroup > li > input[type="radio"]:checked + label > .icon {
  7241. cursor: default !important;
  7242. }
  7243. .flexibleButtonGroup > li > input[type="radio"]:focus + label {
  7244. border-color: rgba(0, 0, 0, 0.3);
  7245. }
  7246. .flexibleButtonGroup > li > a, .flexibleButtonGroup > li > label {
  7247. background-color: #cfd8dc;
  7248. border: 1px solid transparent;
  7249. color: #212121;
  7250. cursor: pointer;
  7251. padding: 5px 10px;
  7252. }
  7253. .flexibleButtonGroup > li > a > .icon, .flexibleButtonGroup > li > label > .icon {
  7254. color: inherit;
  7255. }
  7256. .flexibleButtonGroup > li > a > .icon, .flexibleButtonGroup > li > label > .icon {
  7257. color: inherit !important;
  7258. cursor: pointer !important;
  7259. }
  7260. .flexibleButtonGroup > li > a.active, .flexibleButtonGroup > li > input[type="radio"]:checked + label, .flexibleButtonGroup > li > input[type="radio"] + label:hover {
  7261. color: #fff;
  7262. }
  7263. .flexibleButtonGroup > li > a.active.green, .flexibleButtonGroup > li > input[type="radio"]:checked + label.green, .flexibleButtonGroup > li > input[type="radio"] + label.green:hover {
  7264. background-color: #2e7d32;
  7265. }
  7266. .flexibleButtonGroup > li > a.active.red, .flexibleButtonGroup > li > input[type="radio"]:checked + label.red, .flexibleButtonGroup > li > input[type="radio"] + label.red:hover {
  7267. background-color: #c62828;
  7268. }
  7269. .flexibleButtonGroup > li > a.active.yellow, .flexibleButtonGroup > li > input[type="radio"]:checked + label.yellow, .flexibleButtonGroup > li > input[type="radio"] + label.yellow:hover {
  7270. background-color: #fb8c00;
  7271. color: #000;
  7272. }
  7273. .flexibleButtonGroup > li > input[type="radio"]:disabled + label {
  7274. background-color: #f2f2f2 !important;
  7275. color: #7d8264 !important;
  7276. cursor: default;
  7277. }
  7278. .flexibleButtonGroup > li > input[type="radio"]:disabled + label > .icon {
  7279. color: #7d8264 !important;
  7280. cursor: default !important;
  7281. }
  7282. #colorPickerGradient {
  7283. background-color: #f00;
  7284. background-image: url("../images/colorPickerGradient.png");
  7285. background-repeat: no-repeat;
  7286. border: 1px solid rgba(0, 0, 0, 1);
  7287. cursor: default;
  7288. display: inline-block;
  7289. height: 256px;
  7290. overflow: hidden;
  7291. position: relative;
  7292. width: 256px;
  7293. }
  7294. #colorPickerGradient > span {
  7295. border: 1px solid rgba(0, 0, 0, 1);
  7296. border-radius: 10px;
  7297. display: block;
  7298. height: 10px;
  7299. left: -4px;
  7300. position: absolute;
  7301. top: -4px;
  7302. width: 10px;
  7303. }
  7304. #colorPickerGradient > span > span {
  7305. border: 1px solid rgba(255, 255, 255, 1);
  7306. border-radius: 10px;
  7307. display: block;
  7308. height: 8px;
  7309. width: 8px;
  7310. }
  7311. #colorPickerBar {
  7312. background-image: url("../images/colorPickerBar.png");
  7313. background-repeat: repeat-x;
  7314. border: 1px solid rgba(0, 0, 0, 1);
  7315. cursor: default;
  7316. display: inline-block;
  7317. height: 256px;
  7318. margin-left: 10px;
  7319. position: relative;
  7320. width: 16px;
  7321. }
  7322. #colorPickerBar > span {
  7323. display: inline-block;
  7324. height: 1px;
  7325. left: 0;
  7326. position: absolute;
  7327. top: 27px;
  7328. width: 16px;
  7329. }
  7330. #colorPickerBar > span::after, #colorPickerBar > span::before {
  7331. content: "";
  7332. display: block;
  7333. height: 0;
  7334. position: absolute;
  7335. top: 0;
  7336. width: 0;
  7337. }
  7338. #colorPickerBar > span::after {
  7339. border-bottom: 5px solid transparent;
  7340. border-right: 5px solid rgba(0, 0, 0, 1);
  7341. border-top: 5px solid transparent;
  7342. right: -7px;
  7343. top: -5px;
  7344. }
  7345. #colorPickerBar > span::before {
  7346. border-bottom: 5px solid transparent;
  7347. border-left: 5px solid rgba(0, 0, 0, 1);
  7348. border-top: 5px solid transparent;
  7349. left: -7px;
  7350. top: -5px;
  7351. }
  7352. #colorPickerForm {
  7353. display: inline-block;
  7354. margin-left: 20px;
  7355. position: relative;
  7356. text-align: center;
  7357. width: 100px;
  7358. }
  7359. #colorPickerForm > .colors {
  7360. margin-left: 2px;
  7361. }
  7362. #colorPickerForm > .colors > .new, #colorPickerForm > .colors > .old {
  7363. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC");
  7364. border: 1px solid rgba(0, 0, 0, 1);
  7365. box-sizing: content-box;
  7366. display: block;
  7367. height: 24px;
  7368. }
  7369. #colorPickerForm > .colors > .new > span, #colorPickerForm > .colors > .old > span {
  7370. display: block;
  7371. height: 24px;
  7372. }
  7373. #colorPickerForm > .colors > .old {
  7374. background-position: 8px 0;
  7375. border-top-width: 0;
  7376. }
  7377. #colorPickerForm > .hex {
  7378. margin-top: 20px;
  7379. }
  7380. #colorPickerForm > .rgba {
  7381. margin-top: 20px;
  7382. }
  7383. #colorPickerForm > .rgba > li.a {
  7384. margin-top: 10px;
  7385. }
  7386. #colorPickerForm > .rgba > li.g, #colorPickerForm > .rgba > li.b {
  7387. margin-top: 2px;
  7388. }
  7389. #colorPickerForm > .rgba > li, #colorPickerForm > .hex > li {
  7390. text-align: right;
  7391. }
  7392. #colorPickerForm > .rgba > li input, #colorPickerForm > .hex > li input {
  7393. margin-left: 5px;
  7394. width: 80px;
  7395. }
  7396. .colorPreview {
  7397. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC");
  7398. border: 1px solid rgba(224, 224, 224, 1);
  7399. display: inline-block;
  7400. }
  7401. .colorPreview > div {
  7402. border: 2px solid rgba(250, 250, 250, 1);
  7403. cursor: pointer;
  7404. display: block;
  7405. height: 60px;
  7406. width: 180px;
  7407. }
  7408. .commentList > li:hover {
  7409. background-color: transparent;
  7410. }
  7411. .commentList > li:hover .buttonGroupNavigation {
  7412. opacity: 0;
  7413. }
  7414. .commentList .commentContent:hover .buttonGroupNavigation {
  7415. opacity: 1;
  7416. }
  7417. .commentList .commentContent + .commentOptionContainer .commentResponseAdd {
  7418. border-top: 1px solid rgba(224, 224, 224, 1);
  7419. margin-top: 20px;
  7420. padding-top: 20px;
  7421. }
  7422. .commentList .commentContent .wcfLikeCounter {
  7423. font-weight: 400;
  7424. }
  7425. @media (min-width: 769px) {
  7426. .commentList .commentContent .wcfLikeCounter {
  7427. font-size: 12px;
  7428. }
  7429. }
  7430. @media (max-width: 768px) {
  7431. .commentList .commentContent .wcfLikeCounter {
  7432. font-size: 12px;
  7433. }
  7434. }
  7435. .commentList .commentResponseList:not(:empty) {
  7436. margin-top: 20px;
  7437. }
  7438. .commentList .commentResponseList > li:first-child, .commentList .commentResponseList > li:last-child {
  7439. border-color: rgba(224, 224, 224, 1);
  7440. }
  7441. .commentList .commentOptionContainer {
  7442. margin-top: 10px;
  7443. }
  7444. .commentList .commentResponseAdd {
  7445. padding: 10px 20px 0;
  7446. }
  7447. .commentList textarea + button {
  7448. margin-top: 2px;
  7449. }
  7450. .inputAddon > .inputDatePicker {
  7451. cursor: pointer;
  7452. flex: 0 1 200px;
  7453. min-width: 200px;
  7454. }
  7455. .datePicker {
  7456. background-color: rgba(255, 255, 255, 1);
  7457. border-radius: 2px;
  7458. box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  7459. color: rgba(33, 33, 33, 1);
  7460. display: none;
  7461. position: absolute;
  7462. width: 240px;
  7463. z-index: 450;
  7464. }
  7465. .datePicker.active {
  7466. display: block;
  7467. }
  7468. .datePicker.datePickerTime.datePickerTimeOnly > header, .datePicker.datePickerTime.datePickerTimeOnly > ul {
  7469. display: none;
  7470. }
  7471. .datePicker.datePickerTime.datePickerTimeOnly > footer {
  7472. border-top-width: 0;
  7473. }
  7474. .datePicker.datePickerTime > footer {
  7475. display: block;
  7476. }
  7477. .datePicker > header {
  7478. align-items: center;
  7479. display: flex;
  7480. }
  7481. .datePicker > header > a {
  7482. display: block;
  7483. flex: 0 0 auto;
  7484. padding: 10px;
  7485. }
  7486. .datePicker > header > a:not(.active) {
  7487. visibility: hidden;
  7488. }
  7489. .datePicker > header > span {
  7490. display: block;
  7491. flex: 1 1 auto;
  7492. padding: 10px 0;
  7493. text-align: center;
  7494. }
  7495. .datePicker select.year {
  7496. margin-left: 5px;
  7497. }
  7498. .datePicker > ul > li {
  7499. border-top: 1px solid rgba(238, 238, 238, 1);
  7500. display: flex;
  7501. }
  7502. .datePicker > ul > li.weekdays, .datePicker > ul > li.weekdays + li {
  7503. border-top-color: rgba(238, 238, 238, 1);
  7504. }
  7505. .datePicker > ul > li > a, .datePicker > ul > li > span {
  7506. display: block;
  7507. flex: 1 1 0;
  7508. padding: 5px 0;
  7509. text-align: center;
  7510. }
  7511. .datePicker > ul > li > a:not(:last-child), .datePicker > ul > li > span:not(:last-child) {
  7512. border-right: 1px solid rgba(238, 238, 238, 1);
  7513. }
  7514. .datePicker > ul > li > a {
  7515. color: rgba(33, 33, 33, 1);
  7516. }
  7517. .datePicker > ul > li > a:hover {
  7518. text-decoration: none;
  7519. }
  7520. .datePicker > ul > li > a.active, .datePicker > ul > li > a:hover:not(.otherMonth) {
  7521. background-color: rgba(238, 238, 238, 1);
  7522. color: rgba(33, 33, 33, 1);
  7523. }
  7524. .datePicker > ul > li > a.otherMonth {
  7525. color: rgba(125, 130, 135, 1);
  7526. cursor: default;
  7527. }
  7528. .datePicker > ul > li > span {
  7529. color: rgba(125, 130, 135, 1);
  7530. font-weight: 400;
  7531. text-transform: uppercase;
  7532. }
  7533. @media (min-width: 769px) {
  7534. .datePicker > ul > li > span {
  7535. font-size: 12px;
  7536. }
  7537. }
  7538. @media (max-width: 768px) {
  7539. .datePicker > ul > li > span {
  7540. font-size: 12px;
  7541. }
  7542. }
  7543. .datePicker > footer {
  7544. border-top: 1px solid rgba(238, 238, 238, 1);
  7545. display: none;
  7546. padding: 10px;
  7547. position: relative;
  7548. text-align: center;
  7549. }
  7550. .dialogOverlay {
  7551. background-color: transparent;
  7552. bottom: 0;
  7553. left: 0;
  7554. opacity: 0;
  7555. position: fixed;
  7556. right: 0;
  7557. top: 0;
  7558. transition: opacity 0.12s linear 0s, visibility 0s linear 0.3s;
  7559. visibility: hidden;
  7560. will-change: opacity;
  7561. z-index: 399;
  7562. }
  7563. @media (min-width: 545px) {
  7564. .dialogOverlay {
  7565. padding: 100px 0;
  7566. }
  7567. }
  7568. .dialogOverlay[aria-hidden="false"] {
  7569. opacity: 1;
  7570. transition-delay: 0s;
  7571. visibility: visible;
  7572. }
  7573. .dialogOverlay::before {
  7574. background-color: rgba(0, 0, 0, 0.4);
  7575. bottom: 0;
  7576. content: "";
  7577. display: block;
  7578. left: 0;
  7579. position: fixed;
  7580. right: 0;
  7581. top: 0;
  7582. z-index: 100;
  7583. }
  7584. @keyframes wcfDialog {
  7585. 0% {
  7586. top: 8%;
  7587. visibility: visible;
  7588. }
  7589. 100% {
  7590. top: 10%;
  7591. visibility: visible;
  7592. }
  7593. }
  7594. @keyframes wcfDialogOut {
  7595. 0% {
  7596. top: 10%;
  7597. visibility: visible;
  7598. }
  7599. 100% {
  7600. top: 12%;
  7601. visibility: hidden;
  7602. }
  7603. }
  7604. .dialogContainer {
  7605. z-index: 200;
  7606. }
  7607. @media (max-width: 544px) {
  7608. .dialogContainer {
  7609. left: 0 !important;
  7610. position: fixed;
  7611. right: 0 !important;
  7612. top: 0 !important;
  7613. }
  7614. }
  7615. @media (min-width: 545px) {
  7616. .dialogContainer {
  7617. animation: 0.3s ease 0s normal forwards 1 running wcfDialogOut;
  7618. box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.3);
  7619. left: 50%;
  7620. max-height: 80%;
  7621. max-width: 80%;
  7622. min-width: 500px;
  7623. position: absolute;
  7624. transform: translateX(-50%);
  7625. }
  7626. .dialogContainer[aria-hidden="false"] {
  7627. animation: 0.3s ease 0s normal forwards 1 running wcfDialog;
  7628. }
  7629. }
  7630. .dialogContainer[aria-hidden="true"] {
  7631. visibility: hidden;
  7632. }
  7633. .dialogContainer[aria-hidden="false"] ~ .dialogContainer[aria-hidden="false"] {
  7634. z-index: 50;
  7635. }
  7636. .dialogContainer > header {
  7637. background-color: rgba(58, 109, 156, 1);
  7638. color: rgba(255, 255, 255, 1);
  7639. display: flex;
  7640. }
  7641. @media (max-width: 768px) {
  7642. .dialogContainer > header {
  7643. padding: 10px;
  7644. }
  7645. }
  7646. @media (min-width: 769px) {
  7647. .dialogContainer > header {
  7648. padding: 10px 20px;
  7649. }
  7650. }
  7651. .dialogContainer > header > span {
  7652. flex: 1 1 auto;
  7653. font-weight: 400;
  7654. line-height: 1.28;
  7655. }
  7656. @media (min-width: 769px) {
  7657. .dialogContainer > header > span {
  7658. font-size: 18px;
  7659. }
  7660. }
  7661. @media (max-width: 768px) {
  7662. .dialogContainer > header > span {
  7663. font-size: 18px;
  7664. }
  7665. }
  7666. .dialogContainer > header > .dialogCloseButton {
  7667. align-self: center;
  7668. flex: 0 0 auto;
  7669. }
  7670. .dialogContainer > header > .dialogCloseButton:hover > .icon {
  7671. color: rgba(255, 255, 255, 1);
  7672. }
  7673. .dialogContainer > header > .dialogCloseButton > .icon {
  7674. color: rgba(255, 255, 255, 1);
  7675. }
  7676. .dialogContainer > .dialogContent {
  7677. background-color: rgba(250, 250, 250, 1);
  7678. overflow: auto;
  7679. }
  7680. @media (max-width: 768px) {
  7681. .dialogContainer > .dialogContent:not(.dialogContentNoPadding) {
  7682. padding: 10px;
  7683. }
  7684. }
  7685. @media (min-width: 769px) {
  7686. .dialogContainer > .dialogContent:not(.dialogContentNoPadding) {
  7687. padding: 30px 20px 10px;
  7688. }
  7689. }
  7690. .dialogContainer > .dialogContent:not(.dialogContentNoPadding)::after {
  7691. content: "";
  7692. display: block;
  7693. height: 20px;
  7694. }
  7695. .dialogContainer > .dialogContent.dialogForm:not(.dialogContentNoPadding)::after {
  7696. height: 17px;
  7697. }
  7698. .dialogContainer > .dialogContent:not(.dialogForm) {
  7699. border-bottom-left-radius: 3px;
  7700. border-bottom-right-radius: 3px;
  7701. }
  7702. .dialogContainer > .dialogContent dl:not(.plain) > dt {
  7703. float: none;
  7704. text-align: left;
  7705. width: auto !important;
  7706. }
  7707. .dialogContainer > .dialogContent dl:not(.plain) > dt:empty {
  7708. margin-bottom: 0;
  7709. }
  7710. .dialogContainer > .dialogContent dl:not(.plain) > dd {
  7711. margin-left: 0 !important;
  7712. }
  7713. .dialogContainer > .dialogContent .dialogFormSubmit {
  7714. background-color: rgba(236, 241, 247, 1);
  7715. border-top: 1px solid rgba(224, 224, 224, 1);
  7716. bottom: 0;
  7717. left: 0;
  7718. padding: 10px;
  7719. position: absolute;
  7720. right: 0;
  7721. }
  7722. .dialogContainer > .dialogContent .section {
  7723. margin-top: 30px;
  7724. }
  7725. .dialogContainer > .dialogContent .section .sectionTitle {
  7726. font-weight: 400;
  7727. line-height: 1.28;
  7728. }
  7729. @media (min-width: 769px) {
  7730. .dialogContainer > .dialogContent .section .sectionTitle {
  7731. font-size: 18px;
  7732. }
  7733. }
  7734. @media (max-width: 768px) {
  7735. .dialogContainer > .dialogContent .section .sectionTitle {
  7736. font-size: 18px;
  7737. }
  7738. }
  7739. .dialogContainer > .dialogContent > div > .section:first-child, .dialogContainer > .dialogContent > div > fieldset:first-child {
  7740. margin-top: 0;
  7741. }
  7742. .dialogContainer > .dialogContent > div > div > .section:first-child, .dialogContainer > .dialogContent > div > form > .section:first-child, .dialogContainer > .dialogContent > div > div > fieldset:first-child, .dialogContainer > .dialogContent > div > form > fieldset:first-child {
  7743. margin-top: 0;
  7744. }
  7745. .jsStaticDialogContent {
  7746. display: none;
  7747. }
  7748. .spinner {
  7749. background-color: #fff;
  7750. border: 1px solid #ccc;
  7751. box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.2);
  7752. color: #2c3e50;
  7753. left: 50%;
  7754. opacity: 0;
  7755. padding: 10px;
  7756. position: fixed;
  7757. text-align: center;
  7758. top: 200px;
  7759. transform: translateX(-50%);
  7760. transition: visibility 0s linear 0.12s, opacity 0.12s linear 0s;
  7761. visibility: hidden;
  7762. z-index: 401;
  7763. }
  7764. .spinner.active {
  7765. opacity: 1;
  7766. transition-delay: 0s;
  7767. visibility: visible;
  7768. }
  7769. .spinner > span:not(.icon) {
  7770. display: block;
  7771. margin-top: 5px;
  7772. }
  7773. #systemNotification {
  7774. left: 0;
  7775. opacity: 0;
  7776. pointer-events: none;
  7777. position: fixed;
  7778. top: 0;
  7779. transform: translateY(-100%);
  7780. transition: visibility 0.12s linear 0.12s, transform 0.12s linear 0s, opacity 0.12s linear 0s;
  7781. visibility: hidden;
  7782. width: 100%;
  7783. z-index: 460;
  7784. }
  7785. #systemNotification.active {
  7786. opacity: 1;
  7787. transform: translateY(0%);
  7788. transition-delay: 0s;
  7789. visibility: visible;
  7790. }
  7791. #systemNotification > p {
  7792. border-top-left-radius: 0;
  7793. border-top-right-radius: 0;
  7794. border-top-width: 0;
  7795. cursor: pointer;
  7796. display: table;
  7797. margin: 0 auto;
  7798. max-width: 80%;
  7799. pointer-events: auto;
  7800. }
  7801. .confirmationObject {
  7802. font-weight: 600;
  7803. }
  7804. .dropdownMenuContainer {
  7805. bottom: 0;
  7806. left: 0;
  7807. pointer-events: none;
  7808. position: absolute;
  7809. right: 0;
  7810. top: 0;
  7811. }
  7812. .dropdown .dropdownToggle:active, .dropdown.dropdownOpen .dropdownToggle {
  7813. outline: 0 none;
  7814. }
  7815. .dropdown.inputAddon > .dropdownToggle {
  7816. padding: 4px 7px;
  7817. }
  7818. .dropdown.inputAddon > .dropdownToggle > span.active::after {
  7819. content: "";
  7820. font-family: FontAwesome;
  7821. font-size: 14px;
  7822. margin-left: 7px;
  7823. }
  7824. .dropdown.preInput {
  7825. display: table;
  7826. width: 100%;
  7827. }
  7828. .dropdown.preInput input {
  7829. border-radius: 0 3px 3px 0;
  7830. display: table-cell;
  7831. margin: 0;
  7832. width: 99%;
  7833. }
  7834. .dropdown.preInput textarea {
  7835. border-radius: 0 3px 3px;
  7836. display: block;
  7837. margin-top: 0;
  7838. }
  7839. .dropdown.dropdownOpen .dropdownMenu {
  7840. display: block;
  7841. }
  7842. .dropdown .dropdownToggle {
  7843. cursor: pointer;
  7844. }
  7845. .dropdownMenu {
  7846. background-color: rgba(255, 255, 255, 1);
  7847. border-radius: 2px;
  7848. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  7849. color: rgba(33, 33, 33, 1);
  7850. display: none;
  7851. min-width: 160px;
  7852. padding: 3px 0;
  7853. pointer-events: all;
  7854. position: absolute;
  7855. text-align: left;
  7856. visibility: hidden;
  7857. z-index: 450;
  7858. }
  7859. .dropdownMenu.dropdownMenuPageSearch {
  7860. border-top-left-radius: 0;
  7861. border-top-right-radius: 0;
  7862. }
  7863. .dropdownMenu.dropdownOpen {
  7864. display: block;
  7865. visibility: visible;
  7866. }
  7867. .dropdownMenu li {
  7868. display: block;
  7869. }
  7870. .dropdownMenu li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText), .dropdownMenu li.dropdownList > li:hover:not(.dropdownDivider), .dropdownMenu li.dropdownNavigationItem, .dropdownMenu li.active {
  7871. background-color: rgba(238, 238, 238, 1);
  7872. color: rgba(33, 33, 33, 1);
  7873. }
  7874. .dropdownMenu li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText) > a, .dropdownMenu li.dropdownList > li:hover:not(.dropdownDivider) > a, .dropdownMenu li.dropdownNavigationItem > a, .dropdownMenu li.active > a {
  7875. color: rgba(33, 33, 33, 1);
  7876. }
  7877. .dropdownMenu li.dropdownDivider {
  7878. border-top: 1px solid rgba(238, 238, 238, 1);
  7879. margin: 3px 0;
  7880. }
  7881. .dropdownMenu li.dropdownText {
  7882. font-weight: 400;
  7883. padding: 5px 20px;
  7884. }
  7885. @media (min-width: 769px) {
  7886. .dropdownMenu li.dropdownText {
  7887. font-size: 12px;
  7888. }
  7889. }
  7890. @media (max-width: 768px) {
  7891. .dropdownMenu li.dropdownText {
  7892. font-size: 12px;
  7893. }
  7894. }
  7895. .dropdownMenu li.boxFlag {
  7896. padding-top: 2px;
  7897. }
  7898. .dropdownMenu li.missingValue > span {
  7899. padding-right: 40px;
  7900. position: relative;
  7901. }
  7902. .dropdownMenu li.missingValue > span::after {
  7903. color: rgba(169, 68, 66, 1);
  7904. content: "";
  7905. font-family: FontAwesome;
  7906. position: absolute;
  7907. right: 20px;
  7908. top: 5px;
  7909. }
  7910. .dropdownMenu li > a, .dropdownMenu li > span {
  7911. clear: both;
  7912. cursor: pointer;
  7913. display: block;
  7914. max-width: 350px;
  7915. overflow: hidden;
  7916. overflow-wrap: normal;
  7917. padding: 5px 20px;
  7918. text-decoration: none;
  7919. text-overflow: ellipsis;
  7920. white-space: nowrap;
  7921. }
  7922. .dropdownMenu li > a > div > h3, .dropdownMenu li > span > div > h3 {
  7923. overflow: hidden;
  7924. text-overflow: ellipsis;
  7925. }
  7926. .dropdownMenu li > a {
  7927. color: rgba(33, 33, 33, 1);
  7928. }
  7929. .dropdownMenu li > a > small {
  7930. display: block;
  7931. }
  7932. .dropdownMenu li > a + span.badge {
  7933. display: none;
  7934. }
  7935. .dropdownMenu li > .box16 {
  7936. align-items: center;
  7937. cursor: pointer;
  7938. min-height: 0;
  7939. padding: 5px 10px;
  7940. }
  7941. .dropdownMenu li > label {
  7942. display: block;
  7943. }
  7944. .dropdownMenu li .containerHeadline {
  7945. margin-bottom: 0;
  7946. }
  7947. .dropdownMenu li .containerHeadline > p {
  7948. font-weight: 400;
  7949. }
  7950. @media (min-width: 769px) {
  7951. .dropdownMenu li .containerHeadline > p {
  7952. font-size: 12px;
  7953. }
  7954. }
  7955. @media (max-width: 768px) {
  7956. .dropdownMenu li .containerHeadline > p {
  7957. font-size: 12px;
  7958. }
  7959. }
  7960. .dropdownMenu li .icon {
  7961. color: inherit;
  7962. }
  7963. .dropdownMenu .scrollableDropdownMenu {
  7964. max-height: 300px;
  7965. overflow: auto;
  7966. }
  7967. .dropdownMenu .scrollableDropdownMenu.forceScrollbar {
  7968. overflow-x: hidden;
  7969. overflow-y: scroll;
  7970. }
  7971. @media (max-width: 544px) {
  7972. .dropdownMenu {
  7973. left: 0 !important;
  7974. right: 0 !important;
  7975. }
  7976. }
  7977. @media (max-width: 1024px) {
  7978. .dropdownMenu li {
  7979. overflow: hidden;
  7980. }
  7981. .dropdownMenu li > a, .dropdownMenu li > span {
  7982. max-width: none;
  7983. white-space: normal;
  7984. }
  7985. }
  7986. @media (min-width: 769px) {
  7987. .dropdownMenu .dropdownMenu.pageHeaderSearchDropdown {
  7988. transform: translateY(-10px);
  7989. }
  7990. }
  7991. @media (max-width: 1024px) {
  7992. .dropdownMenu.dropdownMenuPageSearch {
  7993. left: 0 !important;
  7994. right: 0 !important;
  7995. }
  7996. }
  7997. .dropdownIndicator::after {
  7998. content: "";
  7999. font-family: FontAwesome;
  8000. margin-left: 5px;
  8001. }
  8002. .boxFlag > .box24, .boxFlag.box24 {
  8003. align-items: center;
  8004. display: flex !important;
  8005. min-height: 20px;
  8006. }
  8007. .boxFlag > .box24 > img:first-child, .boxFlag.box24 > img:first-child {
  8008. height: auto;
  8009. }
  8010. .boxFlag > .box24 > span, .boxFlag.box24 > span {
  8011. display: inline !important;
  8012. }
  8013. .boxFlag > .box24.dropdownToggle, .boxFlag.box24.dropdownToggle {
  8014. display: inline-flex !important;
  8015. }
  8016. .dropdownMenuContainer > .interactiveDropdown.open {
  8017. visibility: visible;
  8018. }
  8019. .interactiveDropdown {
  8020. background-color: rgba(250, 250, 250, 1);
  8021. border-radius: 2px;
  8022. box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  8023. color: rgba(44, 62, 80, 1);
  8024. left: -200%;
  8025. pointer-events: all;
  8026. position: absolute;
  8027. visibility: hidden;
  8028. z-index: 450;
  8029. }
  8030. .interactiveDropdown > .elementPointer {
  8031. display: none;
  8032. }
  8033. .interactiveDropdown.interactiveDropdownUserMenu > .interactiveDropdownItemsContainer {
  8034. max-height: none;
  8035. overflow: visible;
  8036. }
  8037. @media (min-width: 545px) and (max-width: 1024px) {
  8038. .interactiveDropdown {
  8039. bottom: 0 !important;
  8040. display: flex;
  8041. flex-direction: column;
  8042. left: auto !important;
  8043. position: fixed;
  8044. right: 0 !important;
  8045. top: 0 !important;
  8046. width: 350px;
  8047. }
  8048. .interactiveDropdown > .interactiveDropdownHeader, .interactiveDropdown > .interactiveDropdownShowAll {
  8049. flex: 0 0 auto;
  8050. }
  8051. .interactiveDropdown > .interactiveDropdownItemsContainer {
  8052. flex: 1 1 auto;
  8053. max-height: none;
  8054. overflow: auto;
  8055. }
  8056. }
  8057. @media (min-width: 1025px) {
  8058. .interactiveDropdown {
  8059. position: fixed;
  8060. top: 50px !important;
  8061. }
  8062. }
  8063. .interactiveDropdownHeader {
  8064. align-items: center;
  8065. background-color: rgba(236, 241, 247, 1);
  8066. color: rgba(44, 62, 80, 1);
  8067. display: flex;
  8068. padding: 10px 20px;
  8069. }
  8070. .interactiveDropdownHeader a {
  8071. color: rgba(44, 62, 80, 1);
  8072. }
  8073. .interactiveDropdownHeader a:hover {
  8074. color: rgba(44, 62, 80, 1);
  8075. text-decoration: underline;
  8076. }
  8077. .interactiveDropdownHeader .interactiveDropdownTitle {
  8078. flex: 1 1 auto;
  8079. font-weight: 400;
  8080. line-height: 1.28;
  8081. }
  8082. @media (min-width: 769px) {
  8083. .interactiveDropdownHeader .interactiveDropdownTitle {
  8084. font-size: 18px;
  8085. }
  8086. }
  8087. @media (max-width: 768px) {
  8088. .interactiveDropdownHeader .interactiveDropdownTitle {
  8089. font-size: 18px;
  8090. }
  8091. }
  8092. .interactiveDropdownHeader .interactiveDropdownLinks {
  8093. flex: 0 0 auto;
  8094. margin-left: 5px;
  8095. }
  8096. @media (max-width: 768px) {
  8097. .interactiveDropdownHeader {
  8098. padding: 10px;
  8099. }
  8100. }
  8101. .interactiveDropdownItemsContainer {
  8102. -moz-border-bottom-colors: none;
  8103. -moz-border-left-colors: none;
  8104. -moz-border-right-colors: none;
  8105. -moz-border-top-colors: none;
  8106. border-color: rgba(224, 224, 224, 1);
  8107. border-image: none;
  8108. border-style: solid;
  8109. border-width: 1px 0;
  8110. }
  8111. .interactiveDropdownItemsContainer.ps-container > .interactiveDropdownItems {
  8112. position: relative;
  8113. z-index: 100;
  8114. }
  8115. .interactiveDropdownItemsContainer.ps-container > .ps-scrollbar-y-rail {
  8116. z-index: 200;
  8117. }
  8118. .interactiveDropdownItems > li {
  8119. padding: 15px 20px;
  8120. position: relative;
  8121. }
  8122. .interactiveDropdownItems > li:not(:last-child) {
  8123. border-bottom: 1px solid rgba(224, 224, 224, 1);
  8124. }
  8125. .interactiveDropdownItems > li:hover {
  8126. background-color: rgba(242, 242, 242, 1);
  8127. }
  8128. .interactiveDropdownItems > li a {
  8129. color: rgba(230, 81, 0, 1);
  8130. }
  8131. .interactiveDropdownItems > li a:hover {
  8132. color: rgba(191, 54, 12, 1);
  8133. }
  8134. .interactiveDropdownItems > li .box48 {
  8135. align-items: center;
  8136. overflow: hidden;
  8137. }
  8138. @media (max-width: 768px) {
  8139. .interactiveDropdownItems > li {
  8140. padding: 10px;
  8141. }
  8142. }
  8143. .interactiveDropdownItems .loading, .interactiveDropdownItems .noItems {
  8144. align-items: center;
  8145. display: flex;
  8146. font-weight: 400;
  8147. justify-content: center;
  8148. line-height: 1.28;
  8149. padding: 20px 10px;
  8150. }
  8151. .interactiveDropdownItems .loading > .fa-spinner, .interactiveDropdownItems .loading > .wcfImageViewer > div.loading::before, .wcfImageViewer > .interactiveDropdownItems .loading > div.loading::before, .interactiveDropdownItems .loading > .wcfImageViewer > footer > div > ul > li.loading::before, .wcfImageViewer > footer > div > ul > .interactiveDropdownItems .loading > li.loading::before, .interactiveDropdownItems .noItems > .fa-spinner, .interactiveDropdownItems .noItems > .wcfImageViewer > div.loading::before, .wcfImageViewer > .interactiveDropdownItems .noItems > div.loading::before, .interactiveDropdownItems .noItems > .wcfImageViewer > footer > div > ul > li.loading::before, .wcfImageViewer > footer > div > ul > .interactiveDropdownItems .noItems > li.loading::before {
  8152. margin-right: 5px;
  8153. }
  8154. @media (min-width: 769px) {
  8155. .interactiveDropdownItems .loading, .interactiveDropdownItems .noItems {
  8156. font-size: 18px;
  8157. }
  8158. }
  8159. @media (max-width: 768px) {
  8160. .interactiveDropdownItems .loading, .interactiveDropdownItems .noItems {
  8161. font-size: 18px;
  8162. }
  8163. }
  8164. .interactiveDropdownItemOutstanding {
  8165. display: flex;
  8166. }
  8167. .interactiveDropdownItemOutstanding > .box48 {
  8168. flex: 1 1 auto;
  8169. }
  8170. .interactiveDropdownItemOutstanding h3 {
  8171. font-weight: bold;
  8172. }
  8173. .interactiveDropdownItemMarkAsRead {
  8174. align-self: center;
  8175. flex: 0 0 auto;
  8176. margin-left: 5px;
  8177. }
  8178. .interactiveDropdownItemShadow > .box48 {
  8179. position: relative;
  8180. }
  8181. .interactiveDropdownItemShadow > .box48, .interactiveDropdownItemShadow > .interactiveDropdownItemMarkAsRead {
  8182. pointer-events: none;
  8183. z-index: 20;
  8184. }
  8185. .interactiveDropdownItemShadow > .box48 a, .interactiveDropdownItemShadow > .interactiveDropdownItemMarkAsRead a {
  8186. pointer-events: all;
  8187. }
  8188. .interactiveDropdownItemShadow > .interactiveDropdownItemShadowLink {
  8189. bottom: 0;
  8190. left: 0;
  8191. position: absolute;
  8192. right: 0;
  8193. top: 0;
  8194. z-index: 10;
  8195. }
  8196. .interactiveDropdownShowAll {
  8197. background-color: rgba(236, 241, 247, 1);
  8198. color: rgba(44, 62, 80, 1);
  8199. display: block;
  8200. padding: 10px 20px;
  8201. text-align: center;
  8202. }
  8203. .interactiveDropdownShowAll:hover {
  8204. color: rgba(44, 62, 80, 1);
  8205. text-decoration: underline;
  8206. }
  8207. @media (min-width: 769px) {
  8208. .interactiveDropdown {
  8209. min-width: 350px;
  8210. }
  8211. .interactiveDropdownItemsContainer {
  8212. max-height: 400px;
  8213. overflow: hidden;
  8214. position: relative;
  8215. }
  8216. .interactiveDropdownItems:not(.interactiveDropdownItemsUserMenu) > li {
  8217. max-width: 400px;
  8218. }
  8219. }
  8220. @media (max-width: 768px) {
  8221. .interactiveDropdown {
  8222. bottom: 0;
  8223. display: flex;
  8224. flex-direction: column;
  8225. left: 0;
  8226. position: fixed;
  8227. right: 0;
  8228. }
  8229. .interactiveDropdownHeader {
  8230. flex: 0 0 auto;
  8231. }
  8232. .interactiveDropdownItemsContainer {
  8233. flex: 1 1 auto;
  8234. overflow: auto;
  8235. }
  8236. .interactiveDropdownItemsContainer .interactiveDropdownItemOutstanding {
  8237. padding-right: 41px;
  8238. }
  8239. .interactiveDropdownItemsContainer .interactiveDropdownItemMarkAsRead {
  8240. bottom: 0;
  8241. position: absolute;
  8242. right: 0;
  8243. top: 0;
  8244. width: 36px;
  8245. }
  8246. .interactiveDropdownItemsContainer .interactiveDropdownItemMarkAsRead > a {
  8247. display: block;
  8248. height: 100%;
  8249. text-align: center;
  8250. }
  8251. .interactiveDropdownItemsContainer .interactiveDropdownItemMarkAsRead > a > .icon {
  8252. position: relative;
  8253. top: 50%;
  8254. transform: translateY(-50%);
  8255. }
  8256. .interactiveDropdownShowAll {
  8257. flex: 0 0 auto;
  8258. }
  8259. }
  8260. .googleMap {
  8261. height: 400px;
  8262. }
  8263. .sidebarGoogleMap {
  8264. height: 250px;
  8265. }
  8266. .googleMapsCustomControlContainer {
  8267. cursor: pointer !important;
  8268. margin-top: 5px;
  8269. }
  8270. .googleMapsCustomControlContainer .googleMapsCustomControl {
  8271. background-clip: padding-box;
  8272. background-color: #fff;
  8273. border: 1px solid rgba(0, 0, 0, 0.15);
  8274. border-radius: 3px;
  8275. box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.298);
  8276. color: #565656;
  8277. font-size: 11px !important;
  8278. min-width: 29px;
  8279. padding: 1px 6px;
  8280. position: relative;
  8281. text-align: center;
  8282. }
  8283. .googleMapsCustomControlContainer .googleMapsCustomControl:hover {
  8284. background-color: #ebebeb;
  8285. color: #000;
  8286. }
  8287. .googleMapsCustomControlContainer .googleMapsCustomControl.active {
  8288. color: #000;
  8289. font-weight: 500;
  8290. }
  8291. .googleMapsUseLocationSuggestionLink {
  8292. font-size: 12px;
  8293. }
  8294. .wcfImageViewer {
  8295. background-color: rgba(0, 0, 0, 1);
  8296. bottom: 0;
  8297. display: none;
  8298. left: 0;
  8299. opacity: 0;
  8300. position: fixed;
  8301. right: 0;
  8302. top: 0;
  8303. z-index: 399;
  8304. }
  8305. .wcfImageViewer .icon {
  8306. color: #9e9e9e;
  8307. }
  8308. .wcfImageViewer.open {
  8309. display: block;
  8310. opacity: 1;
  8311. }
  8312. .wcfImageViewer.maximized:not(.wcfImageViewerMobile) > header {
  8313. top: -100px;
  8314. }
  8315. .wcfImageViewer.maximized:not(.wcfImageViewerMobile) > div {
  8316. bottom: 0;
  8317. top: 0;
  8318. }
  8319. .wcfImageViewer.maximized:not(.wcfImageViewerMobile) > footer {
  8320. bottom: -100px;
  8321. }
  8322. .wcfImageViewer.wcfImageViewerMobile > header, .wcfImageViewer.wcfImageViewerMobile > footer {
  8323. background-color: rgba(0, 0, 0, 1);
  8324. opacity: 1;
  8325. position: absolute;
  8326. visibility: visible;
  8327. z-index: 402;
  8328. }
  8329. .wcfImageViewer.wcfImageViewerMobile.maximized > header, .wcfImageViewer.wcfImageViewerMobile.maximized > footer {
  8330. opacity: 0;
  8331. transition: visibility 0s linear 0.24s, opacity 0.24s linear 0s;
  8332. visibility: hidden;
  8333. }
  8334. .wcfImageViewer.wcfImageViewerMobile.maximized > div > ul > li.pointer {
  8335. opacity: 0;
  8336. }
  8337. .wcfImageViewer.wcfImageViewerMobile > div {
  8338. bottom: 0;
  8339. top: 0;
  8340. }
  8341. .wcfImageViewer.wcfImageViewerMobile > div > ul > li {
  8342. background-color: rgba(224, 224, 224, 1);
  8343. border-radius: 30px;
  8344. margin-top: -24px;
  8345. opacity: 0;
  8346. position: absolute;
  8347. top: 50%;
  8348. transition: opacity 0.24s ease 0s;
  8349. }
  8350. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.pointer {
  8351. opacity: 1;
  8352. }
  8353. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonFull, .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonNext, .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonPrevious {
  8354. z-index: 30;
  8355. }
  8356. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonPrevious {
  8357. left: 10px;
  8358. }
  8359. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonPrevious > span {
  8360. left: -3px;
  8361. position: relative;
  8362. top: 2px;
  8363. }
  8364. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonNext {
  8365. right: 10px;
  8366. }
  8367. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonNext > span {
  8368. position: relative;
  8369. right: -1px;
  8370. top: 2px;
  8371. }
  8372. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonFull {
  8373. bottom: 80px;
  8374. left: 50%;
  8375. top: auto;
  8376. transform: translateX(-50%);
  8377. }
  8378. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonFull > span {
  8379. font-size: 32px;
  8380. left: 2px;
  8381. position: relative;
  8382. top: 3px;
  8383. }
  8384. .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonToggle, .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonEnlarge {
  8385. display: none;
  8386. }
  8387. .wcfImageViewer.wcfImageViewerMobile > footer > .wcfImageViewerButtonPrevious, .wcfImageViewer.wcfImageViewerMobile > footer > .wcfImageViewerButtonNext {
  8388. display: none;
  8389. }
  8390. .wcfImageViewer.wcfImageViewerMobile > footer > div {
  8391. margin: 0;
  8392. }
  8393. .wcfImageViewer > header, .wcfImageViewer > div, .wcfImageViewer > footer {
  8394. box-sizing: border-box;
  8395. left: 0;
  8396. position: fixed;
  8397. right: 0;
  8398. z-index: 400;
  8399. }
  8400. .wcfImageViewer > header {
  8401. height: 100px;
  8402. overflow: hidden;
  8403. padding: 1rem;
  8404. top: 0;
  8405. }
  8406. .wcfImageViewer > header > div > a > img {
  8407. height: 64px;
  8408. width: 64px;
  8409. }
  8410. .wcfImageViewer > header h1, .wcfImageViewer > header h2, .wcfImageViewer > header h3 {
  8411. color: rgba(211, 211, 211, 1);
  8412. }
  8413. .wcfImageViewer > header h1 > a, .wcfImageViewer > header h2 > a, .wcfImageViewer > header h3 > a {
  8414. color: rgba(211, 211, 211, 1);
  8415. }
  8416. .wcfImageViewer > header h1 {
  8417. font-size: 1.75rem;
  8418. }
  8419. .wcfImageViewer > header h2 {
  8420. font-size: 1.25rem;
  8421. }
  8422. .wcfImageViewer > header h3 {
  8423. color: rgba(211, 211, 211, 1);
  8424. font-size: 0.85rem;
  8425. margin-top: 0.25rem;
  8426. }
  8427. .wcfImageViewer > header > .wcfImageViewerButtonClose {
  8428. position: absolute;
  8429. right: 26px;
  8430. top: 26px;
  8431. }
  8432. .wcfImageViewer > div {
  8433. background-color: rgba(0, 0, 0, 1);
  8434. border-bottom: 1px solid rgba(51, 51, 51, 1);
  8435. border-top: 1px solid rgba(51, 51, 51, 1);
  8436. bottom: 100px;
  8437. top: 100px;
  8438. transition-duration: 0.24s;
  8439. transition-property: top, bottom, border-color;
  8440. transition-timing-function: linear;
  8441. z-index: 401;
  8442. }
  8443. .wcfImageViewer > div > img {
  8444. opacity: 0;
  8445. position: absolute;
  8446. top: 50%;
  8447. transition: opacity 0.24s linear 0s;
  8448. z-index: 10;
  8449. }
  8450. .wcfImageViewer > div > img.animateTransformation {
  8451. transition: left 0.24s ease 0s, margin-top 0.24s ease 0s, height 0.24s ease 0s, width 0.24s ease 0s, opacity 0.24s ease 0s;
  8452. }
  8453. .wcfImageViewer > div > img.active {
  8454. opacity: 1;
  8455. z-index: 20;
  8456. }
  8457. .wcfImageViewer:not(.wcfImageViewerMobile) .icon:hover {
  8458. color: #fff;
  8459. }
  8460. .wcfImageViewer:not(.wcfImageViewerMobile) > header {
  8461. transition: top 0.24s linear 0s;
  8462. }
  8463. .wcfImageViewer:not(.wcfImageViewerMobile) > footer {
  8464. transition: bottom 0.24s linear 0s;
  8465. }
  8466. .wcfImageViewer:not(.wcfImageViewerMobile) > div {
  8467. cursor: pointer;
  8468. }
  8469. .wcfImageViewer:not(.wcfImageViewerMobile) > div > img, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul {
  8470. cursor: default;
  8471. }
  8472. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul {
  8473. -moz-border-bottom-colors: none;
  8474. -moz-border-left-colors: none;
  8475. -moz-border-right-colors: none;
  8476. -moz-border-top-colors: none;
  8477. background-color: rgba(0, 0, 0, 0.9);
  8478. border-color: rgba(51, 51, 51, 1);
  8479. border-image: none;
  8480. border-radius: 2px 2px 0 0;
  8481. border-style: solid;
  8482. border-width: 1px 1px 0;
  8483. bottom: 0;
  8484. display: flex;
  8485. left: 50%;
  8486. position: absolute;
  8487. transform: translateX(-50%);
  8488. z-index: 30;
  8489. }
  8490. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li {
  8491. flex: 0 0 auto;
  8492. }
  8493. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li:not(.pointer) > .icon {
  8494. color: #424242 !important;
  8495. }
  8496. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.pointer > span.icon {
  8497. cursor: pointer;
  8498. }
  8499. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonToggle > span, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonEnlarge > span, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonFull > span {
  8500. font-size: 28px;
  8501. }
  8502. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonEnlarge, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonFull {
  8503. border-left: 1px solid rgba(51, 51, 51, 1);
  8504. box-sizing: border-box;
  8505. }
  8506. .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li > span {
  8507. vertical-align: middle;
  8508. }
  8509. .wcfImageViewer > footer {
  8510. bottom: 0;
  8511. height: 100px;
  8512. padding: 10px;
  8513. }
  8514. .wcfImageViewer > footer:hover > div > ul > li > img {
  8515. filter: none;
  8516. }
  8517. .wcfImageViewer > footer > span {
  8518. bottom: 0;
  8519. font-size: 48px;
  8520. opacity: 0;
  8521. padding-top: 26px;
  8522. position: absolute;
  8523. top: 0;
  8524. transition: opacity 0.24s ease 0s;
  8525. width: 30px;
  8526. z-index: 2;
  8527. }
  8528. .wcfImageViewer > footer > span.pointer {
  8529. opacity: 0.6;
  8530. }
  8531. .wcfImageViewer > footer > span.pointer:hover {
  8532. opacity: 1;
  8533. }
  8534. .wcfImageViewer > footer > span.wcfImageViewerButtonPrevious {
  8535. left: 5px;
  8536. }
  8537. .wcfImageViewer > footer > span.wcfImageViewerButtonNext {
  8538. right: 5px;
  8539. }
  8540. .wcfImageViewer > footer > div {
  8541. height: 80px;
  8542. margin: 0 35px;
  8543. overflow: hidden;
  8544. white-space: nowrap;
  8545. }
  8546. .wcfImageViewer > footer > div > ul {
  8547. display: flex;
  8548. font-size: 0;
  8549. height: 80px;
  8550. transition: margin-left 0.24s cubic-bezier(0.5, 1.595, 0.56, 0.98) 0s;
  8551. z-index: 1;
  8552. }
  8553. .wcfImageViewer > footer > div > ul > li {
  8554. align-items: center;
  8555. display: flex;
  8556. flex: 0 0 80px;
  8557. opacity: 0.6;
  8558. position: relative;
  8559. transition: opacity 0.24s ease 0s;
  8560. }
  8561. .wcfImageViewer > footer > div > ul > li.active, .wcfImageViewer > footer > div > ul > li:hover {
  8562. opacity: 1;
  8563. }
  8564. .wcfImageViewer > footer > div > ul > li:not(:last-child) {
  8565. margin-right: 10px;
  8566. }
  8567. .wcfImageViewer > footer > div > ul > li.active > img {
  8568. filter: none;
  8569. }
  8570. .wcfImageViewer > footer > div > ul > li.loading > img {
  8571. opacity: 0;
  8572. }
  8573. .wcfImageViewer > footer > div > ul > li > img {
  8574. max-height: 80px;
  8575. max-width: 80px;
  8576. }
  8577. @media only screen and (max-width: 800px) {
  8578. .wcfImageViewer > header {
  8579. height: 80px;
  8580. }
  8581. .wcfImageViewer > header > .wcfImageViewerButtonClose {
  8582. right: 16px;
  8583. top: 16px;
  8584. }
  8585. .wcfImageViewer > footer {
  8586. height: 80px;
  8587. }
  8588. .wcfImageViewer > footer > div {
  8589. height: 60px;
  8590. }
  8591. .wcfImageViewer > footer > div > ul {
  8592. height: 60px;
  8593. }
  8594. .wcfImageViewer > footer > div > ul > li {
  8595. height: 60px;
  8596. }
  8597. }
  8598. .inputItemList {
  8599. background-color: rgba(241, 246, 251, 1);
  8600. border: 1px solid rgba(176, 200, 224, 1);
  8601. border-radius: 0;
  8602. color: rgba(44, 62, 80, 1);
  8603. display: flex;
  8604. flex-wrap: wrap;
  8605. font-family: "Roboto",Arial,Helvetica,sans-serif;
  8606. font-weight: 400;
  8607. line-height: 1.48;
  8608. outline: medium none;
  8609. padding: 5px 8px 0;
  8610. }
  8611. @media (min-width: 769px) {
  8612. .inputItemList {
  8613. font-size: 14px;
  8614. }
  8615. }
  8616. @media (max-width: 768px) {
  8617. .inputItemList {
  8618. font-size: 14px;
  8619. }
  8620. }
  8621. .inputItemList:focus, .inputItemList:hover {
  8622. background-color: rgba(241, 246, 251, 1);
  8623. border-color: rgba(41, 128, 185, 1);
  8624. color: rgba(44, 62, 80, 1);
  8625. }
  8626. .inputItemList[disabled] {
  8627. background-color: rgba(245, 245, 245, 1) !important;
  8628. border-color: rgba(174, 176, 179, 1) !important;
  8629. color: rgba(125, 130, 100, 1) !important;
  8630. }
  8631. .inputItemList[readonly] {
  8632. color: rgba(125, 130, 100, 1) !important;
  8633. }
  8634. .inputItemList > .item, .inputItemList > .input {
  8635. flex: 0 0 auto;
  8636. margin-bottom: 5px;
  8637. }
  8638. .inputItemList > .item:not(:last-child), .inputItemList > .input:not(:last-child) {
  8639. margin-right: 5px;
  8640. }
  8641. .inputItemList > .item {
  8642. background-color: rgba(207, 216, 220, 1);
  8643. border-radius: 2px;
  8644. color: rgba(33, 33, 33, 1);
  8645. cursor: default;
  8646. padding: 1px 5px;
  8647. }
  8648. .inputItemList > .item .icon {
  8649. color: inherit;
  8650. }
  8651. .inputItemList > .item.active, .inputItemList > .item:hover {
  8652. background-color: rgba(120, 144, 156, 1);
  8653. color: rgba(255, 255, 255, 1);
  8654. }
  8655. .inputItemList > .input > input {
  8656. background-color: transparent !important;
  8657. border-width: 0 !important;
  8658. padding: 0 !important;
  8659. }
  8660. .labelList {
  8661. display: inline-flex;
  8662. flex-wrap: wrap;
  8663. }
  8664. .labelList > li {
  8665. flex: 0 1 auto;
  8666. }
  8667. .labelList > li:not(:last-child) {
  8668. margin-right: 5px;
  8669. }
  8670. .labelList.commaSeparated > li:not(:last-child)::after {
  8671. content: ",";
  8672. padding-left: 1px;
  8673. }
  8674. .labelList.dotSeparated > li:not(:last-child)::after {
  8675. content: "·";
  8676. margin-left: 5px;
  8677. }
  8678. .labelList > li:not(:first-child) .label {
  8679. border-bottom-left-radius: 0;
  8680. border-top-left-radius: 0;
  8681. }
  8682. .labelList > li:not(:last-child) {
  8683. margin-right: 1px;
  8684. }
  8685. .labelList > li:not(:last-child) .label {
  8686. border-bottom-right-radius: 0;
  8687. border-top-right-radius: 0;
  8688. }
  8689. .labelList > li .label {
  8690. top: -1px;
  8691. }
  8692. #labelList > li {
  8693. flex-basis: 30%;
  8694. margin-bottom: 10px;
  8695. }
  8696. #labelList > li.labelCustomClass {
  8697. display: flex;
  8698. }
  8699. #labelList > li.labelCustomClass > input[type="radio"] {
  8700. flex: 0 0 auto;
  8701. margin-right: 7px;
  8702. }
  8703. #labelList > li.labelCustomClass > span {
  8704. flex: 1 1 auto;
  8705. }
  8706. .labelChooser > .dropdownToggle > span {
  8707. cursor: pointer;
  8708. }
  8709. .likesSummary {
  8710. color: rgba(125, 130, 135, 1);
  8711. cursor: pointer;
  8712. flex: 0 0 auto;
  8713. }
  8714. .likesSummary > .icon {
  8715. color: rgba(125, 130, 135, 1);
  8716. margin-right: 5px;
  8717. }
  8718. .wcfLikeCounter {
  8719. color: rgba(125, 130, 135, 1);
  8720. }
  8721. .wcfLikeCounter .icon {
  8722. color: inherit !important;
  8723. }
  8724. .wcfLikeCounter.likeCounterLiked {
  8725. color: #060 !important;
  8726. }
  8727. .wcfLikeCounter.likeCounterDisliked {
  8728. color: #900 !important;
  8729. }
  8730. html.touch .wcfLikeButton > .button:hover:not(.active), html.touch .wcfDislikeButton > .button:hover:not(.active) {
  8731. background-color: rgba(207, 216, 220, 1) !important;
  8732. color: rgba(33, 33, 33, 1) !important;
  8733. }
  8734. .sortableList:not(.tabularList) {
  8735. list-style: outside none decimal;
  8736. margin-left: 20px;
  8737. }
  8738. .sortableNode {
  8739. cursor: move;
  8740. }
  8741. .sortableNode:not(:last-child) {
  8742. border-bottom: 1px solid rgba(224, 224, 224, 1);
  8743. }
  8744. .sortableNode > .sortableList:not(:empty) {
  8745. border-top: 1px solid rgba(224, 224, 224, 1);
  8746. }
  8747. .sortableNodeLabel {
  8748. align-items: center;
  8749. cursor: move;
  8750. display: inline-flex;
  8751. padding: 10px;
  8752. width: 100%;
  8753. }
  8754. .sortableNodeLabel:hover {
  8755. background-color: rgba(242, 242, 242, 1);
  8756. }
  8757. .sortableNodeLabel > .icon, .sortableNodeLabel > a {
  8758. margin-right: 5px;
  8759. }
  8760. .sortableNodeLabel > .icon {
  8761. flex: 0 0 auto;
  8762. }
  8763. .sortableNodeLabel > a {
  8764. flex: 0 1 auto;
  8765. overflow: hidden;
  8766. text-overflow: ellipsis;
  8767. white-space: nowrap;
  8768. }
  8769. .sortableNodeLabel > .statusDisplay {
  8770. align-items: center;
  8771. display: flex;
  8772. flex: 1 0 auto;
  8773. justify-content: flex-end;
  8774. }
  8775. .sortableNodeLabel > .statusDisplay > a, .sortableNodeLabel > .statusDisplay > span {
  8776. cursor: pointer;
  8777. flex: 0 0 auto;
  8778. margin-left: 5px;
  8779. }
  8780. .sortablePlaceholder {
  8781. background-color: rgba(252, 248, 227, 1);
  8782. border: 1px solid rgba(250, 242, 204, 1);
  8783. color: rgba(138, 109, 59, 1);
  8784. padding: 10px;
  8785. }
  8786. .sortablePlaceholder.sortableInvalidTarget {
  8787. background-color: rgba(242, 222, 222, 1);
  8788. border-color: rgba(235, 204, 204, 1);
  8789. color: rgba(169, 68, 66, 1);
  8790. }
  8791. @media (max-width: 544px) {
  8792. .sortableNodeHandle {
  8793. display: none;
  8794. }
  8795. }
  8796. @media (min-width: 1025px) {
  8797. .sortableNodeHandle {
  8798. display: none;
  8799. }
  8800. }
  8801. .structuredList {
  8802. -moz-border-bottom-colors: none;
  8803. -moz-border-left-colors: none;
  8804. -moz-border-right-colors: none;
  8805. -moz-border-top-colors: none;
  8806. border-color: #4f81bd;
  8807. border-image: none;
  8808. border-style: solid;
  8809. border-width: 1px 0;
  8810. }
  8811. .structuredList li {
  8812. display: flex;
  8813. padding: 10px 0;
  8814. }
  8815. .structuredList li:not(:first-child) {
  8816. border-top: 1px solid #eee;
  8817. }
  8818. .structuredList li:hover {
  8819. background-color: rgba(242, 242, 242, 1);
  8820. }
  8821. .structuredList li > span {
  8822. flex: 1 1 auto;
  8823. }
  8824. .structuredList li > label {
  8825. cursor: pointer;
  8826. flex: 0 0 auto;
  8827. }
  8828. .structuredList li > span, .structuredList li > label {
  8829. padding: 0 10px;
  8830. }
  8831. .mediaManagerMediaUploadButton > .button {
  8832. margin: 0;
  8833. text-align: center;
  8834. width: 100%;
  8835. }
  8836. .mediaManagerMediaUploadButton > .button > input {
  8837. width: 100%;
  8838. }
  8839. .mediaManagerMediaList {
  8840. font-size: 0;
  8841. margin-top: 5px;
  8842. }
  8843. .mediaManagerMediaList::before, .mediaManagerMediaList::after {
  8844. content: "";
  8845. display: table;
  8846. }
  8847. .mediaManagerMediaList::after {
  8848. clear: both;
  8849. }
  8850. .mediaManagerMediaList > li {
  8851. border: 1px solid #eee;
  8852. float: left;
  8853. font-size: 1rem;
  8854. margin: 0 10px 10px 0;
  8855. overflow: hidden;
  8856. position: relative;
  8857. }
  8858. .mediaManagerMediaList > li.jsMarked > .mediaInformation, .mediaManagerMediaList > li.jsMarked > .buttonGroupNavigation {
  8859. background-color: rgba(33, 150, 243, 0.8);
  8860. color: rgba(255, 255, 255, 1);
  8861. }
  8862. .mediaManagerMediaList > li.jsMarked > .mediaInformation a, .mediaManagerMediaList > li.jsMarked > .buttonGroupNavigation a {
  8863. color: rgba(255, 255, 255, 1);
  8864. }
  8865. .mediaManagerMediaList > li.jsMarked > .mediaInformation .icon, .mediaManagerMediaList > li.jsMarked > .buttonGroupNavigation .icon {
  8866. color: rgba(255, 255, 255, 1);
  8867. text-shadow: none;
  8868. }
  8869. .mediaManagerMediaList > li.jsSelected > .mediaInformation, .mediaManagerMediaList > li.jsSelected > .buttonGroupNavigation {
  8870. background-color: rgba(0, 128, 0, 0.8);
  8871. color: white;
  8872. }
  8873. .mediaManagerMediaList > li.jsSelected > .mediaInformation a, .mediaManagerMediaList > li.jsSelected > .buttonGroupNavigation a {
  8874. color: white;
  8875. }
  8876. .mediaManagerMediaList > li.jsSelected > .mediaInformation .icon, .mediaManagerMediaList > li.jsSelected > .buttonGroupNavigation .icon {
  8877. color: white;
  8878. text-shadow: none;
  8879. }
  8880. .mediaManagerMediaList > li.uploadFailed {
  8881. cursor: pointer;
  8882. }
  8883. .mediaManagerMediaList > li.uploadFailed > .mediaInformation {
  8884. background-color: rgba(242, 222, 222, 1);
  8885. color: rgba(169, 68, 66, 1);
  8886. }
  8887. .mediaManagerMediaList > li > .mediaThumbnail {
  8888. height: 144px;
  8889. width: 144px;
  8890. }
  8891. .mediaManagerMediaList > li > .mediaInformation {
  8892. background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  8893. bottom: 0;
  8894. box-sizing: border-box;
  8895. color: #fff;
  8896. font-weight: 400;
  8897. padding: 5px 10px;
  8898. position: absolute;
  8899. width: 100%;
  8900. }
  8901. @media (min-width: 769px) {
  8902. .mediaManagerMediaList > li > .mediaInformation {
  8903. font-size: 12px;
  8904. }
  8905. }
  8906. @media (max-width: 768px) {
  8907. .mediaManagerMediaList > li > .mediaInformation {
  8908. font-size: 12px;
  8909. }
  8910. }
  8911. .mediaManagerMediaList > li > .mediaInformation .mediaTitle {
  8912. overflow: hidden;
  8913. text-overflow: ellipsis;
  8914. white-space: nowrap;
  8915. }
  8916. .mediaManagerMediaList > li > .buttonGroupNavigation {
  8917. background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  8918. overflow: hidden;
  8919. position: absolute;
  8920. right: 0;
  8921. top: 0;
  8922. }
  8923. .mediaManagerMediaList > li > .buttonGroupNavigation .icon {
  8924. color: #fff;
  8925. text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.8);
  8926. }
  8927. @media (max-width: 1024px) {
  8928. .mediaManagerMediaList > li .buttonGroupNavigation.open {
  8929. left: 0;
  8930. z-index: 10;
  8931. }
  8932. .mediaManagerMediaList > li .buttonGroupNavigation.open > .buttonList {
  8933. display: block;
  8934. visibility: visible;
  8935. }
  8936. .mediaManagerMediaList > li .buttonGroupNavigation > .dropdownLabel {
  8937. left: calc(100% - 24px);
  8938. position: relative;
  8939. }
  8940. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList {
  8941. background-color: rgba(255, 255, 255, 1);
  8942. border-radius: 2px;
  8943. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  8944. color: rgba(33, 33, 33, 1);
  8945. display: none;
  8946. min-width: 160px;
  8947. padding: 3px 0;
  8948. pointer-events: all;
  8949. position: static !important;
  8950. text-align: left;
  8951. top: 0;
  8952. visibility: hidden;
  8953. z-index: 450;
  8954. }
  8955. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList.dropdownMenuPageSearch {
  8956. border-top-left-radius: 0;
  8957. border-top-right-radius: 0;
  8958. }
  8959. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList.dropdownOpen {
  8960. display: block;
  8961. visibility: visible;
  8962. }
  8963. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li {
  8964. display: block;
  8965. }
  8966. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText), .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownList > li:hover:not(.dropdownDivider), .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownNavigationItem, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.active {
  8967. background-color: rgba(238, 238, 238, 1);
  8968. color: rgba(33, 33, 33, 1);
  8969. }
  8970. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText) > a, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownList > li:hover:not(.dropdownDivider) > a, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownNavigationItem > a, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.active > a {
  8971. color: rgba(33, 33, 33, 1);
  8972. }
  8973. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownDivider {
  8974. border-top: 1px solid rgba(238, 238, 238, 1);
  8975. margin: 3px 0;
  8976. }
  8977. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  8978. font-weight: 400;
  8979. padding: 5px 20px;
  8980. }
  8981. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.boxFlag {
  8982. padding-top: 2px;
  8983. }
  8984. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.missingValue > span {
  8985. padding-right: 40px;
  8986. position: relative;
  8987. }
  8988. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.missingValue > span::after {
  8989. color: rgba(169, 68, 66, 1);
  8990. content: "";
  8991. font-family: FontAwesome;
  8992. position: absolute;
  8993. right: 20px;
  8994. top: 5px;
  8995. }
  8996. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > span {
  8997. clear: both;
  8998. cursor: pointer;
  8999. display: block;
  9000. max-width: 350px;
  9001. overflow: hidden;
  9002. overflow-wrap: normal;
  9003. padding: 5px 20px;
  9004. text-decoration: none;
  9005. text-overflow: ellipsis;
  9006. white-space: nowrap;
  9007. }
  9008. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a > div > h3, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > span > div > h3 {
  9009. overflow: hidden;
  9010. text-overflow: ellipsis;
  9011. }
  9012. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a {
  9013. color: rgba(33, 33, 33, 1);
  9014. }
  9015. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a > small {
  9016. display: block;
  9017. }
  9018. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a + span.badge {
  9019. display: none;
  9020. }
  9021. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > .box16 {
  9022. align-items: center;
  9023. cursor: pointer;
  9024. min-height: 0;
  9025. padding: 5px 10px;
  9026. }
  9027. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > label {
  9028. display: block;
  9029. }
  9030. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li .containerHeadline {
  9031. margin-bottom: 0;
  9032. }
  9033. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  9034. font-weight: 400;
  9035. }
  9036. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li .icon {
  9037. color: inherit;
  9038. }
  9039. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList .scrollableDropdownMenu {
  9040. max-height: 300px;
  9041. overflow: auto;
  9042. }
  9043. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList .scrollableDropdownMenu.forceScrollbar {
  9044. overflow-x: hidden;
  9045. overflow-y: scroll;
  9046. }
  9047. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList > li .invisible {
  9048. display: inline;
  9049. padding-left: 5px;
  9050. }
  9051. }
  9052. @media (max-width: 1024px) and (min-width: 769px) {
  9053. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  9054. font-size: 12px;
  9055. }
  9056. }
  9057. @media (max-width: 1024px) and (max-width: 768px) {
  9058. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li.dropdownText {
  9059. font-size: 12px;
  9060. }
  9061. }
  9062. @media (max-width: 1024px) and (min-width: 769px) {
  9063. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  9064. font-size: 12px;
  9065. }
  9066. }
  9067. @media (max-width: 1024px) and (max-width: 768px) {
  9068. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li .containerHeadline > p {
  9069. font-size: 12px;
  9070. }
  9071. }
  9072. @media (max-width: 1024px) and (max-width: 544px) {
  9073. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList {
  9074. left: 0 !important;
  9075. right: 0 !important;
  9076. }
  9077. }
  9078. @media (max-width: 1024px) and (max-width: 1024px) {
  9079. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li {
  9080. overflow: hidden;
  9081. }
  9082. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > a, .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList li > span {
  9083. max-width: none;
  9084. white-space: normal;
  9085. }
  9086. }
  9087. @media (max-width: 1024px) and (min-width: 769px) {
  9088. .mediaManagerMediaList > li .buttonGroupNavigation > .buttonList .dropdownMenu.pageHeaderSearchDropdown {
  9089. transform: translateY(-10px);
  9090. }
  9091. }
  9092. @media (min-width: 1025px) {
  9093. .mediaManagerMediaList > li .buttonGroupNavigation {
  9094. transition: opacity 0.12s ease 0s;
  9095. }
  9096. .mediaManagerMediaList > li .buttonGroupNavigation > .dropdownLabel {
  9097. display: none;
  9098. }
  9099. }
  9100. @media (min-width: 769px) {
  9101. .mediaManagerMediaList > li > .buttonGroupNavigation {
  9102. height: 0;
  9103. }
  9104. .mediaManagerMediaList > li:hover > .buttonGroupNavigation {
  9105. height: auto;
  9106. padding: 10px;
  9107. }
  9108. }
  9109. @media (max-width: 1024px) {
  9110. .mediaManagerMediaList > li > .buttonGroupNavigation .mediaCheckbox {
  9111. display: none !important;
  9112. }
  9113. }
  9114. [id^="mediaEditor"] .mediaThumbnail {
  9115. margin-bottom: 20px;
  9116. text-align: center;
  9117. }
  9118. [id^="mediaEditor"] .mediaThumbnail + .box48 > dl {
  9119. font-size: 12px;
  9120. }
  9121. .menuOverlayMobile {
  9122. background-color: rgba(50, 92, 132, 1);
  9123. bottom: 0;
  9124. display: none;
  9125. overflow: hidden;
  9126. position: absolute;
  9127. top: 0;
  9128. z-index: 320;
  9129. }
  9130. .menuOverlayMobile.open {
  9131. display: block;
  9132. }
  9133. @media (min-width: 545px) {
  9134. .menuOverlayMobile.open + .menuOverlayMobileBackdrop {
  9135. display: block;
  9136. }
  9137. }
  9138. .menuOverlayMobile.androidMenuTouchEnd {
  9139. display: block;
  9140. position: fixed;
  9141. transition: transform 0.24s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  9142. }
  9143. .menuOverlayMobile.androidMenuTouchEnd.pageMainMenuMobile:not(.open) {
  9144. transform: translateX(-100vw);
  9145. }
  9146. .menuOverlayMobile.androidMenuTouchEnd.pageUserMenuMobile:not(.open) {
  9147. transform: translateX(100vw);
  9148. }
  9149. @media (min-width: 545px) {
  9150. .menuOverlayMobile.androidMenuTouchEnd.pageMainMenuMobile:not(.open) {
  9151. transform: translateX(-350px);
  9152. }
  9153. .menuOverlayMobile.androidMenuTouchEnd.pageUserMenuMobile:not(.open) {
  9154. transform: translateX(350px);
  9155. }
  9156. .menuOverlayMobile.androidMenuTouchEnd + .menuOverlayMobileBackdrop {
  9157. transition: left 0.24s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, right 0.24s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  9158. }
  9159. }
  9160. .menuOverlayMobile > .menuOverlayItemList {
  9161. transition: transform 0.24s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  9162. visibility: visible;
  9163. }
  9164. .menuOverlayMobile.allowScroll .menuOverlayItemList:not(.hidden) {
  9165. overflow: auto;
  9166. }
  9167. .menuOverlayMobile:not(.allowScroll)::before {
  9168. bottom: 0;
  9169. content: "";
  9170. left: 0;
  9171. position: absolute;
  9172. right: 0;
  9173. top: 0;
  9174. z-index: 500;
  9175. }
  9176. @media (max-width: 544px) {
  9177. .menuOverlayMobile {
  9178. left: 0;
  9179. max-width: 100vw;
  9180. right: 0;
  9181. }
  9182. .menuOverlayMobile .menuOverlayItemList {
  9183. right: 0;
  9184. }
  9185. }
  9186. @media (min-width: 545px) {
  9187. .menuOverlayMobile {
  9188. width: 350px;
  9189. }
  9190. .menuOverlayMobile.pageMainMenuMobile {
  9191. left: 0;
  9192. }
  9193. .menuOverlayMobile.pageMainMenuMobile + .menuOverlayMobileBackdrop {
  9194. box-shadow: 5px 0 10px -5px rgba(0, 0, 0, 0.6) inset;
  9195. left: 350px;
  9196. }
  9197. .menuOverlayMobile.pageMainMenuMobile .menuOverlayItemList {
  9198. left: 0;
  9199. }
  9200. .menuOverlayMobile.pageUserMenuMobile {
  9201. right: 0;
  9202. }
  9203. .menuOverlayMobile.pageUserMenuMobile + .menuOverlayMobileBackdrop {
  9204. box-shadow: -5px 0 10px -5px rgba(0, 0, 0, 0.6) inset;
  9205. right: 350px;
  9206. }
  9207. .menuOverlayMobile.pageUserMenuMobile .menuOverlayItemList {
  9208. right: 0;
  9209. }
  9210. }
  9211. .menuOverlayMobileBackdrop {
  9212. background-color: rgba(0, 0, 0, 0.4);
  9213. bottom: 0;
  9214. display: none;
  9215. left: 0;
  9216. position: fixed;
  9217. right: 0;
  9218. top: 0;
  9219. z-index: 395;
  9220. }
  9221. .menuOverlayItemWrapper {
  9222. display: flex;
  9223. justify-content: flex-end;
  9224. }
  9225. .menuOverlayItemWrapper > .menuOverlayItemLink {
  9226. flex: 1 1 auto;
  9227. }
  9228. .menuOverlayItemList {
  9229. background-color: rgba(50, 92, 132, 1);
  9230. bottom: 0;
  9231. height: 100%;
  9232. left: -1px;
  9233. list-style-type: none;
  9234. margin: 0;
  9235. padding: 5px 0;
  9236. position: absolute;
  9237. top: 0;
  9238. width: calc(100% + 1px);
  9239. z-index: 450;
  9240. }
  9241. @media (min-width: 545px) {
  9242. .menuOverlayItemList {
  9243. width: 350px;
  9244. }
  9245. }
  9246. .menuOverlayItemList:not(.activeList) {
  9247. display: none;
  9248. }
  9249. .menuOverlayItemSpacer {
  9250. margin-top: 25px;
  9251. }
  9252. .menuOverlayItemSpacer + .menuOverlayItemSpacer {
  9253. display: none;
  9254. }
  9255. .menuOverlayItem {
  9256. }
  9257. .menuOverlayItem:not(:last-child) {
  9258. margin-bottom: 1px;
  9259. }
  9260. .menuOverlayItem > .menuOverlayItemList {
  9261. margin-left: 100%;
  9262. z-index: 500;
  9263. }
  9264. .menuOverlayItemLink, .menuOverlayTitle, .menuOverlayBackLink {
  9265. color: rgba(255, 255, 255, 1);
  9266. display: block;
  9267. font-size: 14px;
  9268. padding: 10px 30px;
  9269. position: relative;
  9270. }
  9271. .menuOverlayItemLink {
  9272. align-items: center;
  9273. background-color: rgba(43, 79, 113, 1);
  9274. display: flex;
  9275. overflow: hidden;
  9276. text-overflow: ellipsis;
  9277. white-space: nowrap;
  9278. }
  9279. .menuOverlayItemLink .icon::before {
  9280. color: #fff;
  9281. }
  9282. .menuOverlayItemLink:hover {
  9283. color: rgba(255, 255, 255, 1);
  9284. }
  9285. .menuOverlayItemLink.menuOverlayItemBadge {
  9286. align-items: center;
  9287. display: flex;
  9288. padding-right: 10px;
  9289. }
  9290. .menuOverlayItemLink.menuOverlayItemBadge:last-child {
  9291. padding-right: 55px;
  9292. }
  9293. .menuOverlayItemLink.menuOverlayItemBadge > .menuOverlayItemTitle {
  9294. flex: 1 1 auto;
  9295. overflow: hidden;
  9296. text-overflow: ellipsis;
  9297. }
  9298. .menuOverlayItemLink.menuOverlayItemBadge > .badge {
  9299. flex: 0 0 auto;
  9300. }
  9301. .menuOverlayItemLink.menuOverlayItemLinkMore::after {
  9302. color: #fff;
  9303. content: "";
  9304. display: block;
  9305. font-family: FontAwesome;
  9306. font-size: 18px;
  9307. position: absolute;
  9308. right: 18px;
  9309. top: 50%;
  9310. transform: translateY(-50%);
  9311. }
  9312. html[dir="rtl"] .menuOverlayItemLink.menuOverlayItemLinkMore::after {
  9313. content: "";
  9314. }
  9315. .pageUserMenuMobile .menuOverlayItemBadge:last-child {
  9316. padding-right: 10px !important;
  9317. }
  9318. .menuOverlayItemLink.active, .menuOverlayItemLinkIcon.active {
  9319. background-color: rgba(36, 66, 95, 1);
  9320. }
  9321. .menuOverlayTitle {
  9322. color: rgba(255, 255, 255, 0.7);
  9323. overflow: hidden;
  9324. text-overflow: ellipsis;
  9325. white-space: nowrap;
  9326. }
  9327. .menuOverlayTitle:not(:first-child) {
  9328. margin-top: 10px;
  9329. }
  9330. .menuOverlayItemLinkIcon {
  9331. background-color: rgba(43, 79, 113, 1);
  9332. flex: 0 0 auto;
  9333. height: 44px;
  9334. margin-left: 1px;
  9335. padding: 10px;
  9336. width: 44px;
  9337. }
  9338. .menuOverlayItemLinkIcon > .icon::before {
  9339. color: #fff;
  9340. }
  9341. .menuOverlayBackLink::before {
  9342. color: rgba(255, 255, 255, 0.7);
  9343. content: "";
  9344. display: block;
  9345. font-family: FontAwesome;
  9346. font-size: 18px;
  9347. left: 12px;
  9348. position: absolute;
  9349. top: 50%;
  9350. transform: translateY(-50%);
  9351. }
  9352. .menuOverlayLogoWrapper {
  9353. display: flex;
  9354. flex: 1 1 auto;
  9355. padding: 5px;
  9356. }
  9357. .menuOverlayLogoWrapper .menuOverlayLogo {
  9358. background-position: center center;
  9359. background-repeat: no-repeat;
  9360. background-size: contain;
  9361. flex: 1 1 auto;
  9362. }
  9363. @media (min-width: 769px) {
  9364. .messageList:not(.messageReducedList) {
  9365. border-top: 1px solid rgba(65, 121, 173, 1);
  9366. }
  9367. .messageList:not(.messageReducedList) > li {
  9368. border-bottom: 1px solid rgba(65, 121, 173, 1);
  9369. padding: 30px 0;
  9370. }
  9371. .messageList:not(.messageReducedList) > li.messageListPagination:last-child {
  9372. border-bottom-width: 0;
  9373. }
  9374. }
  9375. @media (max-width: 768px) {
  9376. .messageList:not(.messageReducedList) .messageSidebar {
  9377. border-top: 1px solid rgba(65, 121, 173, 1);
  9378. }
  9379. .messageList:not(.messageReducedList) > .messageListPagination {
  9380. border-top: 1px solid rgba(65, 121, 173, 1);
  9381. margin: 0 -10px;
  9382. padding: 20px 10px;
  9383. }
  9384. }
  9385. @media (min-width: 769px) {
  9386. .messageList.messageReducedList > li:not(:last-child) {
  9387. padding-bottom: 30px;
  9388. }
  9389. }
  9390. .messageList > .anchorFixedHeader:target {
  9391. margin-top: -49px;
  9392. pointer-events: none;
  9393. position: relative;
  9394. z-index: 10;
  9395. }
  9396. .messageList > .anchorFixedHeader:target::after {
  9397. content: "";
  9398. display: block;
  9399. height: 50px;
  9400. }
  9401. .messageList > .anchorFixedHeader:target > .message {
  9402. pointer-events: all;
  9403. transform: translateY(49px);
  9404. }
  9405. @media (max-width: 768px) {
  9406. .messageList > li:not(:last-child) {
  9407. padding-bottom: 30px;
  9408. }
  9409. }
  9410. .messageCheckboxLabel, .message .messageClipboardCheckbox, .messageGroupList .columnMark > label {
  9411. cursor: pointer;
  9412. display: block;
  9413. position: relative;
  9414. }
  9415. .messageCheckboxLabel::before, .message .messageClipboardCheckbox::before, .messageGroupList .columnMark > label::before {
  9416. content: "";
  9417. display: block;
  9418. font-family: FontAwesome;
  9419. position: absolute;
  9420. }
  9421. .messageCheckboxLabel::after, .message .messageClipboardCheckbox::after, .messageGroupList .columnMark > label::after {
  9422. color: #009600;
  9423. content: "";
  9424. display: none;
  9425. font-family: FontAwesome;
  9426. position: absolute;
  9427. }
  9428. .messageCheckboxLabel > input[type="checkbox"], .message .messageClipboardCheckbox > input[type="checkbox"], .messageGroupList .columnMark > label > input[type="checkbox"] {
  9429. display: none;
  9430. }
  9431. @media (min-width: 769px) {
  9432. .message {
  9433. display: flex;
  9434. }
  9435. }
  9436. .message .messageClipboardCheckbox {
  9437. height: 24px;
  9438. width: 24px;
  9439. }
  9440. .message .messageClipboardCheckbox::before {
  9441. font-size: 25px;
  9442. left: 2px;
  9443. top: -6px;
  9444. }
  9445. .message.jsMarked .messageClipboardCheckbox::after {
  9446. display: block;
  9447. font-size: 14px;
  9448. left: 5px;
  9449. top: 1px;
  9450. }
  9451. .messageSidebar {
  9452. background-color: rgba(236, 241, 247, 1);
  9453. color: rgba(44, 62, 80, 1);
  9454. position: relative;
  9455. }
  9456. @media (min-width: 769px) {
  9457. .messageSidebar {
  9458. align-self: flex-start;
  9459. border-radius: 3px;
  9460. flex: 0 0 240px;
  9461. padding: 20px;
  9462. text-align: center;
  9463. }
  9464. .messageSidebar + .messageContent {
  9465. flex-basis: calc(100% - 270px);
  9466. margin-left: 30px;
  9467. max-width: calc(100% - 270px);
  9468. }
  9469. }
  9470. @media (max-width: 768px) {
  9471. .messageSidebar {
  9472. margin: 0 -10px;
  9473. padding: 10px;
  9474. }
  9475. .messageSidebar .messageAuthor {
  9476. flex: 0 0 auto;
  9477. position: relative;
  9478. }
  9479. .messageSidebar .messageAuthor .userAvatar {
  9480. display: block;
  9481. margin: 0;
  9482. position: absolute;
  9483. top: 50%;
  9484. transform: translateY(-50%);
  9485. }
  9486. .messageSidebar .messageAuthor .userAvatar .userAvatarImage {
  9487. max-height: 48px;
  9488. max-width: 48px;
  9489. }
  9490. .messageSidebar .messageAuthor .messageAuthorContainer, .messageSidebar .messageAuthor .userTitle, .messageSidebar .messageAuthor .userRank {
  9491. margin-left: 58px;
  9492. }
  9493. .messageSidebar .userCredits {
  9494. display: none;
  9495. }
  9496. .messageSidebar + .messageContent {
  9497. margin-top: 20px;
  9498. }
  9499. }
  9500. .messageSidebar a {
  9501. color: rgba(230, 81, 0, 1);
  9502. }
  9503. .messageSidebar a:hover {
  9504. color: rgba(191, 54, 12, 1);
  9505. }
  9506. .messageSidebar .dataList {
  9507. font-weight: 400;
  9508. }
  9509. @media (min-width: 769px) {
  9510. .messageSidebar .dataList {
  9511. font-size: 12px;
  9512. }
  9513. }
  9514. @media (max-width: 768px) {
  9515. .messageSidebar .dataList {
  9516. font-size: 12px;
  9517. }
  9518. }
  9519. .messageSidebar .userAvatar {
  9520. display: inline-block;
  9521. margin-bottom: 10px;
  9522. position: relative;
  9523. }
  9524. .messageSidebar .userAvatar > a {
  9525. display: inline-block;
  9526. }
  9527. .messageSidebar .username {
  9528. display: inline-block;
  9529. font-weight: 400;
  9530. line-height: 1.28;
  9531. }
  9532. @media (min-width: 769px) {
  9533. .messageSidebar .username {
  9534. font-size: 18px;
  9535. }
  9536. }
  9537. @media (max-width: 768px) {
  9538. .messageSidebar .username {
  9539. font-size: 18px;
  9540. }
  9541. }
  9542. .messageSidebar .badgeOnline {
  9543. left: 0;
  9544. pointer-events: none;
  9545. position: absolute;
  9546. }
  9547. @media (min-width: 769px) {
  9548. .messageSidebar .badgeOnline {
  9549. bottom: 0;
  9550. }
  9551. }
  9552. @media (max-width: 768px) {
  9553. .messageSidebar .badgeOnline {
  9554. color: transparent;
  9555. padding: 0;
  9556. top: 0;
  9557. width: 0;
  9558. }
  9559. .messageSidebar .badgeOnline::before {
  9560. background-color: inherit;
  9561. border: 1px solid rgba(255, 255, 255, 1);
  9562. border-radius: 50%;
  9563. content: "";
  9564. height: 16px;
  9565. left: 34px;
  9566. position: absolute;
  9567. width: 16px;
  9568. }
  9569. }
  9570. .messageSidebar .userTitle + .userRank {
  9571. margin-top: 3px;
  9572. }
  9573. .messageAuthor + * {
  9574. margin-top: 20px;
  9575. }
  9576. .messageAuthor + *::before {
  9577. content: "";
  9578. left: 0;
  9579. margin-top: -10px;
  9580. position: absolute;
  9581. right: 0;
  9582. }
  9583. @media (min-width: 769px) {
  9584. .messageAuthorContainer:not(:last-child) {
  9585. margin-bottom: 5px;
  9586. }
  9587. }
  9588. .messageSidebarOrientationRight .messageContent {
  9589. order: 1;
  9590. }
  9591. .messageSidebarOrientationRight .messageSidebar {
  9592. order: 2;
  9593. }
  9594. .messageSidebarOrientationRight .messageSidebar + .messageContent {
  9595. margin-left: 20px;
  9596. margin-right: 30px;
  9597. }
  9598. @media (max-width: 768px) {
  9599. .messageContent {
  9600. position: relative;
  9601. }
  9602. }
  9603. @media (min-width: 769px) {
  9604. .messageContent {
  9605. display: flex;
  9606. flex: 1 1 0;
  9607. flex-direction: column;
  9608. }
  9609. }
  9610. .messageContent.loading {
  9611. position: relative;
  9612. }
  9613. .messageContent.loading > .messageContentLoadingOverlay {
  9614. align-items: center;
  9615. background-color: rgba(250, 250, 250, 1);
  9616. bottom: 0;
  9617. display: flex;
  9618. justify-content: center;
  9619. left: 0;
  9620. position: absolute;
  9621. right: 0;
  9622. top: 0;
  9623. }
  9624. .messageContent.loading > .messageContentLoadingOverlay > .icon {
  9625. flex: 0 0 auto;
  9626. }
  9627. .messageHeader {
  9628. display: flex;
  9629. justify-content: flex-end;
  9630. }
  9631. @media (min-width: 769px) {
  9632. .messageHeader {
  9633. flex: 0 0 auto;
  9634. }
  9635. }
  9636. .messageHeader + .messageBody {
  9637. margin-top: 20px;
  9638. }
  9639. .messageHeader > .messageQuickOptions {
  9640. flex: 0 0 auto;
  9641. }
  9642. .messageHeader > .messageHeaderWrapper {
  9643. align-items: center;
  9644. flex: 1 1 auto;
  9645. }
  9646. .messageHeaderBox {
  9647. align-items: center;
  9648. display: flex;
  9649. flex: 1 1 auto;
  9650. flex-wrap: wrap;
  9651. }
  9652. .messageHeaderBox > .messageTitle {
  9653. flex: 0 0 100%;
  9654. }
  9655. .messageHeaderBox > .messageHeaderMetaData, .messageHeaderBox > .messageStatus {
  9656. flex: 0 0 auto;
  9657. }
  9658. .messageTitle {
  9659. color: rgba(44, 62, 80, 1);
  9660. }
  9661. @media (min-width: 545px) {
  9662. .messageTitle {
  9663. font-weight: 400;
  9664. line-height: 1.28;
  9665. }
  9666. }
  9667. @media (min-width: 545px) and (min-width: 769px) {
  9668. .messageTitle {
  9669. font-size: 18px;
  9670. }
  9671. }
  9672. @media (min-width: 545px) and (max-width: 768px) {
  9673. .messageTitle {
  9674. font-size: 18px;
  9675. }
  9676. }
  9677. @media (max-width: 544px) {
  9678. }
  9679. @media (max-width: 544px) and (min-width: 769px) {
  9680. .messageTitle {
  9681. font-size: 14px;
  9682. }
  9683. }
  9684. @media (max-width: 544px) and (max-width: 768px) {
  9685. .messageTitle {
  9686. font-size: 14px;
  9687. }
  9688. }
  9689. .messageTitle a {
  9690. color: rgba(44, 62, 80, 1);
  9691. }
  9692. .messageTitle a:hover {
  9693. color: rgba(44, 62, 80, 1);
  9694. }
  9695. .messageHeaderMetaData {
  9696. align-items: center;
  9697. display: flex;
  9698. flex-wrap: wrap;
  9699. font-weight: 400;
  9700. }
  9701. .messageHeaderMetaData > li {
  9702. flex: 0 1 auto;
  9703. }
  9704. .messageHeaderMetaData > li:not(:last-child) {
  9705. margin-right: 5px;
  9706. }
  9707. .messageHeaderMetaData.commaSeparated > li:not(:last-child)::after {
  9708. content: ",";
  9709. padding-left: 1px;
  9710. }
  9711. .messageHeaderMetaData.dotSeparated > li:not(:last-child)::after {
  9712. content: "·";
  9713. margin-left: 5px;
  9714. }
  9715. .messageHeaderMetaData > li:not(:last-child)::after {
  9716. content: "·";
  9717. margin-left: 5px;
  9718. }
  9719. @media (min-width: 769px) {
  9720. .messageHeaderMetaData {
  9721. font-size: 12px;
  9722. }
  9723. }
  9724. @media (max-width: 768px) {
  9725. .messageHeaderMetaData {
  9726. font-size: 12px;
  9727. }
  9728. }
  9729. .messageHeaderMetaData .messagePublicationTime {
  9730. color: rgba(125, 130, 135, 1);
  9731. }
  9732. .messageHeaderMetaData + .messageStatus {
  9733. margin-left: 5px;
  9734. }
  9735. .messageStatus {
  9736. align-items: center;
  9737. display: flex;
  9738. flex-wrap: wrap;
  9739. font-weight: 400;
  9740. }
  9741. .messageStatus > li {
  9742. flex: 0 1 auto;
  9743. }
  9744. .messageStatus > li:not(:last-child) {
  9745. margin-right: 5px;
  9746. }
  9747. .messageStatus.commaSeparated > li:not(:last-child)::after {
  9748. content: ",";
  9749. padding-left: 1px;
  9750. }
  9751. .messageStatus.dotSeparated > li:not(:last-child)::after {
  9752. content: "·";
  9753. margin-left: 5px;
  9754. }
  9755. @media (min-width: 769px) {
  9756. .messageStatus {
  9757. font-size: 12px;
  9758. }
  9759. }
  9760. @media (max-width: 768px) {
  9761. .messageStatus {
  9762. font-size: 12px;
  9763. }
  9764. }
  9765. @media (min-width: 769px) {
  9766. .messageQuickOptions {
  9767. display: flex;
  9768. flex-wrap: wrap;
  9769. }
  9770. .messageQuickOptions > li {
  9771. flex: 0 1 auto;
  9772. }
  9773. .messageQuickOptions > li:not(:last-child) {
  9774. margin-right: 5px;
  9775. }
  9776. .messageQuickOptions.commaSeparated > li:not(:last-child)::after {
  9777. content: ",";
  9778. padding-left: 1px;
  9779. }
  9780. .messageQuickOptions.dotSeparated > li:not(:last-child)::after {
  9781. content: "·";
  9782. margin-left: 5px;
  9783. }
  9784. }
  9785. @media (max-width: 768px) {
  9786. .messageQuickOptions {
  9787. flex: 0 0 24px !important;
  9788. height: 1.5em;
  9789. opacity: 0;
  9790. position: relative;
  9791. transition: opacity 0.12s linear 0s, visibility 0s linear 0.12s;
  9792. visibility: hidden;
  9793. }
  9794. .messageQuickOptions::before {
  9795. content: "";
  9796. font-family: FontAwesome;
  9797. font-size: 18px;
  9798. height: 24px;
  9799. position: absolute;
  9800. right: 0;
  9801. text-align: center;
  9802. top: -2px;
  9803. width: 24px;
  9804. }
  9805. .messageQuickOptions.active {
  9806. opacity: 1;
  9807. transition-delay: 0s;
  9808. visibility: visible;
  9809. }
  9810. .messageQuickOptions > li {
  9811. display: none;
  9812. }
  9813. }
  9814. @media (min-width: 769px) {
  9815. .messageBody {
  9816. flex: 1 1 auto;
  9817. }
  9818. }
  9819. .messageBody.editor {
  9820. align-items: center;
  9821. display: flex;
  9822. justify-content: center;
  9823. }
  9824. .messageBody.editor > .icon {
  9825. flex: 0 0 auto;
  9826. }
  9827. .messageBody.editor > .editorContainer {
  9828. flex: 1 1 auto;
  9829. }
  9830. .messageBody > .messageText img {
  9831. height: auto !important;
  9832. max-width: 100%;
  9833. }
  9834. .messageBody > *:first-child {
  9835. margin-top: 0;
  9836. }
  9837. @media (min-width: 769px) {
  9838. .messageFooter {
  9839. flex: 0 0 auto;
  9840. }
  9841. }
  9842. .messageFooter .formSubmit {
  9843. margin-top: 20px;
  9844. }
  9845. .messageFooterNote {
  9846. border-left: 5px solid rgba(224, 224, 224, 1);
  9847. color: rgba(125, 130, 135, 1);
  9848. font-weight: 400;
  9849. margin-top: 20px;
  9850. padding: 5px 10px;
  9851. }
  9852. @media (min-width: 769px) {
  9853. .messageFooterNote {
  9854. font-size: 12px;
  9855. }
  9856. }
  9857. @media (max-width: 768px) {
  9858. .messageFooterNote {
  9859. font-size: 12px;
  9860. }
  9861. }
  9862. .messageFooterNote a {
  9863. color: rgba(52, 73, 94, 1);
  9864. }
  9865. .messageFooterNote a:hover {
  9866. color: rgba(52, 73, 94, 1);
  9867. text-decoration: underline;
  9868. }
  9869. .messageFooterGroup {
  9870. align-items: center;
  9871. display: flex;
  9872. flex-wrap: wrap;
  9873. }
  9874. .messageFooterGroup:not(:first-child) > .likesSummary, .messageFooterGroup:not(:first-child) > .messageFooterButtons {
  9875. margin-top: 20px;
  9876. }
  9877. .messageFooterGroup > .likesSummary {
  9878. flex: 0 1 auto;
  9879. font-weight: 400;
  9880. }
  9881. @media (min-width: 769px) {
  9882. .messageFooterGroup > .likesSummary {
  9883. font-size: 12px;
  9884. }
  9885. }
  9886. @media (max-width: 768px) {
  9887. .messageFooterGroup > .likesSummary {
  9888. font-size: 12px;
  9889. }
  9890. }
  9891. @media (min-width: 769px) {
  9892. .messageFooterGroup > .messageFooterButtons {
  9893. flex: 1 1 auto;
  9894. }
  9895. }
  9896. @media (max-width: 768px) {
  9897. .messageFooterGroup > .messageFooterButtons:not(.open) {
  9898. display: none;
  9899. }
  9900. .messageFooterGroup > .messageFooterButtons.buttonList.open {
  9901. background-color: rgba(255, 255, 255, 1);
  9902. border-radius: 2px;
  9903. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  9904. color: rgba(33, 33, 33, 1);
  9905. display: block;
  9906. min-width: 160px;
  9907. padding: 3px 0;
  9908. pointer-events: all;
  9909. position: absolute;
  9910. right: 10px;
  9911. text-align: left;
  9912. top: 10px;
  9913. visibility: visible;
  9914. z-index: 450;
  9915. }
  9916. .messageFooterGroup > .messageFooterButtons.buttonList.open.dropdownMenuPageSearch {
  9917. border-top-left-radius: 0;
  9918. border-top-right-radius: 0;
  9919. }
  9920. .messageFooterGroup > .messageFooterButtons.buttonList.open.dropdownOpen {
  9921. display: block;
  9922. visibility: visible;
  9923. }
  9924. .messageFooterGroup > .messageFooterButtons.buttonList.open li {
  9925. display: block;
  9926. }
  9927. .messageFooterGroup > .messageFooterButtons.buttonList.open li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText), .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownList > li:hover:not(.dropdownDivider), .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownNavigationItem, .messageFooterGroup > .messageFooterButtons.buttonList.open li.active {
  9928. background-color: rgba(238, 238, 238, 1);
  9929. color: rgba(33, 33, 33, 1);
  9930. }
  9931. .messageFooterGroup > .messageFooterButtons.buttonList.open li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText) > a, .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownList > li:hover:not(.dropdownDivider) > a, .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownNavigationItem > a, .messageFooterGroup > .messageFooterButtons.buttonList.open li.active > a {
  9932. color: rgba(33, 33, 33, 1);
  9933. }
  9934. .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownDivider {
  9935. border-top: 1px solid rgba(238, 238, 238, 1);
  9936. margin: 3px 0;
  9937. }
  9938. .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownText {
  9939. font-weight: 400;
  9940. padding: 5px 20px;
  9941. }
  9942. .messageFooterGroup > .messageFooterButtons.buttonList.open li.boxFlag {
  9943. padding-top: 2px;
  9944. }
  9945. .messageFooterGroup > .messageFooterButtons.buttonList.open li.missingValue > span {
  9946. padding-right: 40px;
  9947. position: relative;
  9948. }
  9949. .messageFooterGroup > .messageFooterButtons.buttonList.open li.missingValue > span::after {
  9950. color: rgba(169, 68, 66, 1);
  9951. content: "";
  9952. font-family: FontAwesome;
  9953. position: absolute;
  9954. right: 20px;
  9955. top: 5px;
  9956. }
  9957. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a, .messageFooterGroup > .messageFooterButtons.buttonList.open li > span {
  9958. clear: both;
  9959. cursor: pointer;
  9960. display: block;
  9961. max-width: 350px;
  9962. overflow: hidden;
  9963. overflow-wrap: normal;
  9964. padding: 5px 20px;
  9965. text-decoration: none;
  9966. text-overflow: ellipsis;
  9967. white-space: nowrap;
  9968. }
  9969. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a > div > h3, .messageFooterGroup > .messageFooterButtons.buttonList.open li > span > div > h3 {
  9970. overflow: hidden;
  9971. text-overflow: ellipsis;
  9972. }
  9973. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a {
  9974. color: rgba(33, 33, 33, 1);
  9975. }
  9976. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a > small {
  9977. display: block;
  9978. }
  9979. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a + span.badge {
  9980. display: none;
  9981. }
  9982. .messageFooterGroup > .messageFooterButtons.buttonList.open li > .box16 {
  9983. align-items: center;
  9984. cursor: pointer;
  9985. min-height: 0;
  9986. padding: 5px 10px;
  9987. }
  9988. .messageFooterGroup > .messageFooterButtons.buttonList.open li > label {
  9989. display: block;
  9990. }
  9991. .messageFooterGroup > .messageFooterButtons.buttonList.open li .containerHeadline {
  9992. margin-bottom: 0;
  9993. }
  9994. .messageFooterGroup > .messageFooterButtons.buttonList.open li .containerHeadline > p {
  9995. font-weight: 400;
  9996. }
  9997. .messageFooterGroup > .messageFooterButtons.buttonList.open li .icon {
  9998. color: inherit;
  9999. }
  10000. .messageFooterGroup > .messageFooterButtons.buttonList.open .scrollableDropdownMenu {
  10001. max-height: 300px;
  10002. overflow: auto;
  10003. }
  10004. .messageFooterGroup > .messageFooterButtons.buttonList.open .scrollableDropdownMenu.forceScrollbar {
  10005. overflow-x: hidden;
  10006. overflow-y: scroll;
  10007. }
  10008. .messageFooterGroup > .messageFooterButtons.buttonList.open .button {
  10009. background-color: transparent;
  10010. color: rgba(33, 33, 33, 1);
  10011. }
  10012. .messageFooterGroup > .messageFooterButtons.buttonList.open .button.active {
  10013. background-color: rgba(238, 238, 238, 1);
  10014. color: rgba(33, 33, 33, 1);
  10015. }
  10016. .messageFooterGroup > .messageFooterButtons.buttonList.open .button.active > a {
  10017. color: rgba(33, 33, 33, 1);
  10018. }
  10019. .messageFooterGroup > .messageFooterButtons.buttonList.open .button > .invisible {
  10020. display: inline;
  10021. margin-left: 5px;
  10022. }
  10023. }
  10024. @media (max-width: 768px) and (min-width: 769px) {
  10025. .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownText {
  10026. font-size: 12px;
  10027. }
  10028. }
  10029. @media (max-width: 768px) and (max-width: 768px) {
  10030. .messageFooterGroup > .messageFooterButtons.buttonList.open li.dropdownText {
  10031. font-size: 12px;
  10032. }
  10033. }
  10034. @media (max-width: 768px) and (min-width: 769px) {
  10035. .messageFooterGroup > .messageFooterButtons.buttonList.open li .containerHeadline > p {
  10036. font-size: 12px;
  10037. }
  10038. }
  10039. @media (max-width: 768px) and (max-width: 768px) {
  10040. .messageFooterGroup > .messageFooterButtons.buttonList.open li .containerHeadline > p {
  10041. font-size: 12px;
  10042. }
  10043. }
  10044. @media (max-width: 768px) and (max-width: 544px) {
  10045. .messageFooterGroup > .messageFooterButtons.buttonList.open {
  10046. left: 0 !important;
  10047. right: 0 !important;
  10048. }
  10049. }
  10050. @media (max-width: 768px) and (max-width: 1024px) {
  10051. .messageFooterGroup > .messageFooterButtons.buttonList.open li {
  10052. overflow: hidden;
  10053. }
  10054. .messageFooterGroup > .messageFooterButtons.buttonList.open li > a, .messageFooterGroup > .messageFooterButtons.buttonList.open li > span {
  10055. max-width: none;
  10056. white-space: normal;
  10057. }
  10058. }
  10059. @media (max-width: 768px) and (min-width: 769px) {
  10060. .messageFooterGroup > .messageFooterButtons.buttonList.open .dropdownMenu.pageHeaderSearchDropdown {
  10061. transform: translateY(-10px);
  10062. }
  10063. }
  10064. @media (max-width: 768px) and (min-width: 769px) {
  10065. .messageFooterGroup > .messageFooterButtons.buttonList.open .button {
  10066. font-size: 14px;
  10067. }
  10068. }
  10069. @media (max-width: 768px) and (max-width: 768px) {
  10070. .messageFooterGroup > .messageFooterButtons.buttonList.open .button {
  10071. font-size: 14px;
  10072. }
  10073. }
  10074. .messageSignature img {
  10075. max-height: 150px;
  10076. }
  10077. @media (max-width: 768px) {
  10078. .messageSignature {
  10079. display: none;
  10080. }
  10081. }
  10082. @media (min-width: 769px) {
  10083. .messageSignature {
  10084. border-top: 1px solid rgba(224, 224, 224, 1);
  10085. margin-top: 20px;
  10086. opacity: 0.6;
  10087. padding-top: 10px;
  10088. transform: translateZ(0px);
  10089. transition: opacity 0.12s linear 0s;
  10090. }
  10091. .message:hover .messageSignature {
  10092. opacity: 1;
  10093. }
  10094. }
  10095. .messageFooterButtons {
  10096. justify-content: flex-end;
  10097. }
  10098. .messageFooterButtons > li {
  10099. display: flex;
  10100. }
  10101. .messageFooterButtons > li > a {
  10102. align-items: center;
  10103. }
  10104. .messageFooterButtons .icon + span:not(.invisible) {
  10105. margin-left: 5px;
  10106. }
  10107. @media (max-width: 768px) {
  10108. .messageCollapsed {
  10109. border-top: 1px solid rgba(224, 224, 224, 1);
  10110. margin: 0 -10px;
  10111. padding: 30px 10px 0;
  10112. }
  10113. }
  10114. .messageReduced .messageHeader {
  10115. background-color: rgba(236, 241, 247, 1);
  10116. color: rgba(44, 62, 80, 1);
  10117. }
  10118. @media (max-width: 768px) {
  10119. .messageReduced .messageHeader {
  10120. margin: 0 -10px;
  10121. padding: 10px;
  10122. }
  10123. }
  10124. @media (min-width: 769px) {
  10125. .messageReduced .messageHeader {
  10126. padding: 10px 20px;
  10127. }
  10128. }
  10129. @media (min-width: 769px) {
  10130. .messageReduced .messageBody, .messageReduced .messageFooter {
  10131. padding: 0 20px;
  10132. }
  10133. }
  10134. .messageQuoteItemList {
  10135. list-style-type: none !important;
  10136. margin-left: 0 !important;
  10137. }
  10138. .messageQuoteItemList > li {
  10139. display: flex;
  10140. }
  10141. .messageQuoteItemList > li > span {
  10142. flex: 0 0 auto;
  10143. margin-right: 10px;
  10144. }
  10145. .messageQuoteItemList > li > .jsQuote {
  10146. flex: 1 1 auto;
  10147. }
  10148. .messageQuoteItemList > li > .jsFullQuote {
  10149. display: none;
  10150. }
  10151. .messageTableOverflow {
  10152. overflow: auto;
  10153. }
  10154. .editHistoryDiff > .sideBySide:first-child {
  10155. margin-bottom: 20px;
  10156. text-align: center;
  10157. }
  10158. .editHistoryDiff .sideBySide {
  10159. display: flex;
  10160. }
  10161. .editHistoryDiff .sideBySide > div {
  10162. flex: 0 0 50%;
  10163. max-width: 50%;
  10164. }
  10165. .editHistoryDiff .sideBySide > div:first-child {
  10166. padding-right: 10px;
  10167. }
  10168. .editHistoryDiff .sideBySide > div:last-child {
  10169. padding-left: 10px;
  10170. }
  10171. @media (max-width: 768px) {
  10172. .editHistoryVersionList .columnUser, .editHistoryVersionList .columnEditReason {
  10173. display: none;
  10174. }
  10175. }
  10176. .messageGroupList .tabularList .columnSubject {
  10177. flex: 1 1 auto;
  10178. }
  10179. .messageGroupList .tabularList .columnStats {
  10180. flex: 0 0 140px;
  10181. text-align: center;
  10182. }
  10183. .messageGroupList .tabularList .columnLastPost {
  10184. flex: 0 0 200px;
  10185. }
  10186. .messageGroupList .tabularList .tabularListRow:not(.tabularListRowHead) .columnStats {
  10187. position: relative;
  10188. }
  10189. .messageGroupList .tabularList .tabularListRow:not(.tabularListRowHead) .columnStats > dl {
  10190. visibility: hidden;
  10191. }
  10192. @media (min-width: 1025px) {
  10193. .messageGroupList .tabularList .tabularListRow:hover:not(.tabularListRowHead) .columnStats > dl {
  10194. visibility: visible;
  10195. }
  10196. .messageGroupList .tabularList .tabularListRow:hover:not(.tabularListRowHead) .columnStats .messageGroupListStatsSimple {
  10197. display: none;
  10198. }
  10199. }
  10200. .messageGroupList .columnMark > label {
  10201. cursor: pointer;
  10202. display: block;
  10203. height: 24px;
  10204. width: 24px;
  10205. }
  10206. .messageGroupList .columnMark > label::before {
  10207. font-size: 24px;
  10208. top: -6px;
  10209. }
  10210. .messageGroupList .jsMarked .columnMark > label::after {
  10211. display: block;
  10212. font-size: 13px;
  10213. left: 3px;
  10214. top: 1px;
  10215. }
  10216. .messageGroupList .tabularListRowHead .columnMark > label::before {
  10217. top: -3px;
  10218. }
  10219. .messageGroupList .tabularListRowHead .jsMarked .columnMark > label::after {
  10220. top: 4px;
  10221. }
  10222. .messageGroupList .messageDeleted .columnAvatar, .messageGroupList .messageDisabled .columnAvatar {
  10223. position: relative;
  10224. }
  10225. .messageGroupList .messageDeleted .columnAvatar::before, .messageGroupList .messageDisabled .columnAvatar::before {
  10226. display: block;
  10227. font-family: FontAwesome;
  10228. position: absolute;
  10229. }
  10230. @media (min-width: 769px) {
  10231. .messageGroupList .messageDeleted .columnAvatar::before, .messageGroupList .messageDisabled .columnAvatar::before {
  10232. font-size: 42px;
  10233. }
  10234. }
  10235. @media (max-width: 768px) {
  10236. .messageGroupList .messageDeleted .columnAvatar::before, .messageGroupList .messageDisabled .columnAvatar::before {
  10237. font-size: 28px;
  10238. }
  10239. }
  10240. .messageGroupList .messageDeleted .columnAvatar > div, .messageGroupList .messageDisabled .columnAvatar > div {
  10241. visibility: hidden;
  10242. }
  10243. .messageGroupList .messageDeleted .columnAvatar::before {
  10244. color: #b40000;
  10245. content: "";
  10246. left: 17px;
  10247. top: -2px;
  10248. }
  10249. @media (min-width: 769px) {
  10250. .messageGroupList .messageDeleted .columnAvatar::before {
  10251. left: 17px;
  10252. top: -2px;
  10253. }
  10254. }
  10255. @media (max-width: 768px) {
  10256. .messageGroupList .messageDeleted .columnAvatar::before {
  10257. left: 7px;
  10258. top: -4px;
  10259. }
  10260. }
  10261. .messageGroupList .messageDisabled .columnAvatar::before {
  10262. color: #008c00;
  10263. content: "";
  10264. }
  10265. @media (min-width: 769px) {
  10266. .messageGroupList .messageDisabled .columnAvatar::before {
  10267. left: 13px;
  10268. top: -2px;
  10269. }
  10270. }
  10271. @media (max-width: 768px) {
  10272. .messageGroupList .messageDisabled .columnAvatar::before {
  10273. left: 3px;
  10274. top: -4px;
  10275. }
  10276. }
  10277. .messageGroupList .columnAvatar div {
  10278. height: 48px;
  10279. position: relative;
  10280. width: 48px;
  10281. }
  10282. .messageGroupList .columnAvatar .myAvatar {
  10283. bottom: -2px;
  10284. height: 24px;
  10285. position: absolute;
  10286. right: -6px;
  10287. width: 24px;
  10288. }
  10289. .messageGroupList .columnAvatar .myAvatar > img {
  10290. border: 1px solid rgba(250, 250, 250, 1);
  10291. box-sizing: content-box;
  10292. }
  10293. .messageGroupList .columnSubject {
  10294. overflow: hidden;
  10295. }
  10296. .messageGroupList .columnSubject > h3 > .messageGroupLink {
  10297. font-weight: 400;
  10298. line-height: 1.28;
  10299. }
  10300. @media (min-width: 769px) {
  10301. .messageGroupList .columnSubject > h3 > .messageGroupLink {
  10302. font-size: 18px;
  10303. }
  10304. }
  10305. @media (max-width: 768px) {
  10306. .messageGroupList .columnSubject > h3 > .messageGroupLink {
  10307. font-size: 18px;
  10308. }
  10309. }
  10310. .messageGroupList .columnSubject > h3 > .badge.label {
  10311. top: -2px;
  10312. }
  10313. .messageGroupList .columnSubject > small {
  10314. display: block;
  10315. }
  10316. .messageGroupList .columnSubject > .statusDisplay {
  10317. display: flex;
  10318. float: right;
  10319. opacity: 0.75;
  10320. transition: opacity 0.12s ease 0s;
  10321. }
  10322. .messageGroupList .columnSubject > .statusDisplay > .statusIcons {
  10323. align-items: center;
  10324. flex: 0 0 auto;
  10325. }
  10326. .messageGroupList .columnSubject > .statusDisplay > .statusIcons > li {
  10327. align-items: center;
  10328. display: flex;
  10329. }
  10330. .messageGroupList .columnSubject > .labelList {
  10331. float: right;
  10332. padding-left: 7px;
  10333. }
  10334. .messageGroupList .columnLastPost > .box32 {
  10335. align-items: center;
  10336. }
  10337. .messageGroupList .columnLastPost time {
  10338. color: rgba(125, 130, 135, 1);
  10339. }
  10340. .messageGroupList .columnLastPost a {
  10341. display: block;
  10342. overflow: hidden;
  10343. text-overflow: ellipsis;
  10344. white-space: nowrap;
  10345. }
  10346. .messageGroupList .tabularListRow:hover .columnSubject > .statusDisplay, .messageGroupList tr:hover .columnSubject > .statusDisplay {
  10347. opacity: 1;
  10348. }
  10349. .messageGroupList .tabularListRow:hover .columnSubject > .statusDisplay > .pagination, .messageGroupList tr:hover .columnSubject > .statusDisplay > .pagination {
  10350. opacity: 1;
  10351. }
  10352. .messageGroupList .tabularListColumns.new .columnSubject > h3 > .messageGroupLink, .messageGroupList tr.new .columnSubject > h3 > .messageGroupLink {
  10353. font-weight: bold;
  10354. }
  10355. .messageGroupList .pagination {
  10356. flex: 0 0 auto;
  10357. font-weight: 400;
  10358. opacity: 0;
  10359. transition: opacity 0.12s ease 0s;
  10360. }
  10361. @media (min-width: 769px) {
  10362. .messageGroupList .pagination {
  10363. font-size: 12px;
  10364. }
  10365. }
  10366. @media (max-width: 768px) {
  10367. .messageGroupList .pagination {
  10368. font-size: 12px;
  10369. }
  10370. }
  10371. .messageGroupList .pagination:not(:last-child) {
  10372. margin-right: 5px;
  10373. }
  10374. @media (min-width: 769px) {
  10375. .messageGroupList .messageGroupCounterMobile, .messageGroupList .messageGroupInfoMobile {
  10376. display: none;
  10377. }
  10378. }
  10379. @media (max-width: 768px) {
  10380. .messageGroupList .tabularListColumns > .columnMark {
  10381. display: none;
  10382. }
  10383. .messageGroupList .tabularListRowHead .columnMark, .messageGroupList .tabularListRowHead .columnStats {
  10384. display: none;
  10385. }
  10386. .messageGroupList .tabularListRowHead .columnSubject {
  10387. padding: 0;
  10388. }
  10389. .messageGroupList .tabularListRowHead .columnLastPost {
  10390. flex-basis: auto;
  10391. padding: 0;
  10392. }
  10393. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns {
  10394. flex-wrap: wrap;
  10395. justify-content: flex-end;
  10396. padding: 5px 0;
  10397. }
  10398. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns > li {
  10399. padding: 0;
  10400. }
  10401. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnAvatar {
  10402. margin-right: 10px;
  10403. padding: 0;
  10404. }
  10405. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnAvatar div {
  10406. height: 32px;
  10407. width: 32px;
  10408. }
  10409. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnAvatar img {
  10410. max-height: 32px;
  10411. max-width: 32px;
  10412. }
  10413. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnAvatar .myAvatar {
  10414. display: none;
  10415. }
  10416. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject {
  10417. flex-basis: calc(100% - 42px);
  10418. max-width: calc(100% - 42px);
  10419. }
  10420. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject > h3 {
  10421. align-items: flex-start;
  10422. display: flex;
  10423. }
  10424. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject > h3 > .messageGroupLink {
  10425. flex: 1 1 auto;
  10426. line-height: 1.48;
  10427. overflow: hidden;
  10428. text-overflow: ellipsis;
  10429. }
  10430. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject > h3 > .messageGroupCounterMobile {
  10431. flex: 0 0 auto;
  10432. margin-left: 10px;
  10433. }
  10434. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfoMobile {
  10435. color: rgba(125, 130, 135, 1);
  10436. display: flex;
  10437. font-weight: 400;
  10438. }
  10439. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfoMobile > .messageGroupAuthorMobile {
  10440. flex: 1 1 auto;
  10441. }
  10442. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfoMobile > .messageGroupLastPostTimeMobile {
  10443. flex: 0 0 auto;
  10444. margin-left: 10px;
  10445. }
  10446. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .statusDisplay, .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfo, .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupTime, .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupEditLink {
  10447. display: none;
  10448. }
  10449. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .labelList {
  10450. float: none;
  10451. padding-bottom: 2px;
  10452. padding-left: 0;
  10453. }
  10454. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnStats, .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnLastPost {
  10455. display: none;
  10456. }
  10457. }
  10458. @media (max-width: 768px) and (min-width: 769px) {
  10459. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject > h3 > .messageGroupLink {
  10460. font-size: 14px;
  10461. }
  10462. }
  10463. @media (max-width: 768px) and (max-width: 768px) {
  10464. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject > h3 > .messageGroupLink {
  10465. font-size: 14px;
  10466. }
  10467. }
  10468. @media (max-width: 768px) and (min-width: 769px) {
  10469. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfoMobile {
  10470. font-size: 12px;
  10471. }
  10472. }
  10473. @media (max-width: 768px) and (max-width: 768px) {
  10474. .messageGroupList .tabularListRow:not(.tabularListRowHead) > .tabularListColumns .columnSubject .messageGroupInfoMobile {
  10475. font-size: 12px;
  10476. }
  10477. }
  10478. .messageGroupListStatsSimple {
  10479. color: rgba(125, 130, 135, 1);
  10480. font-size: 1rem;
  10481. left: 50%;
  10482. position: absolute;
  10483. top: 50%;
  10484. transform: translateX(-50%) translateY(-50%);
  10485. }
  10486. @media (max-width: 1024px) {
  10487. .mobileLinkShadowContainer {
  10488. position: relative;
  10489. }
  10490. .mobileLinkShadowContainer > .mobileLinkShadow {
  10491. bottom: 0;
  10492. left: 0;
  10493. position: absolute;
  10494. right: 0;
  10495. top: 0;
  10496. }
  10497. }
  10498. @media (min-width: 1025px) {
  10499. .contentHeader.messageGroupContentHeader > .contentHeaderIcon {
  10500. position: relative;
  10501. }
  10502. }
  10503. .contentHeader.messageGroupContentHeader.messageDeleted > .contentHeaderIcon::before, .contentHeader.messageGroupContentHeader.messageDisabled > .contentHeaderIcon::before {
  10504. display: block;
  10505. font-family: FontAwesome;
  10506. font-size: 56px;
  10507. position: absolute;
  10508. }
  10509. .contentHeader.messageGroupContentHeader.messageDeleted > .contentHeaderIcon > img, .contentHeader.messageGroupContentHeader.messageDisabled > .contentHeaderIcon > img {
  10510. visibility: hidden;
  10511. }
  10512. .contentHeader.messageGroupContentHeader.messageDeleted > .contentHeaderIcon::before {
  10513. color: #b40000;
  10514. content: "";
  10515. left: 11px;
  10516. top: -12px;
  10517. }
  10518. .contentHeader.messageGroupContentHeader.messageDisabled > .contentHeaderIcon::before {
  10519. color: #008c00;
  10520. content: "";
  10521. left: 4px;
  10522. top: -12px;
  10523. }
  10524. @keyframes wcfPageAction {
  10525. 0% {
  10526. opacity: 0;
  10527. transform: translateY(-10px);
  10528. visibility: visible;
  10529. }
  10530. 100% {
  10531. opacity: 1;
  10532. transform: translateY(0px);
  10533. visibility: visible;
  10534. }
  10535. }
  10536. @keyframes wcfPageActionOut {
  10537. 0% {
  10538. opacity: 1;
  10539. transform: translateY(0px);
  10540. visibility: visible;
  10541. }
  10542. 100% {
  10543. opacity: 0;
  10544. transform: translateY(-10px);
  10545. visibility: hidden;
  10546. }
  10547. }
  10548. @keyframes wcfPageActionRemove {
  10549. 0% {
  10550. opacity: 1;
  10551. transform: translateY(0px);
  10552. visibility: visible;
  10553. }
  10554. 60% {
  10555. opacity: 0;
  10556. transform: translateY(-10px);
  10557. visibility: hidden;
  10558. }
  10559. 100% {
  10560. max-width: 0;
  10561. opacity: 0;
  10562. transform: translateY(-10px);
  10563. visibility: hidden;
  10564. }
  10565. }
  10566. .pageAction {
  10567. bottom: 10px;
  10568. display: flex;
  10569. flex-wrap: wrap;
  10570. position: fixed;
  10571. right: 10px;
  10572. z-index: 400;
  10573. }
  10574. .pageAction > li {
  10575. flex: 0 1 auto;
  10576. }
  10577. .pageAction > li:not(:last-child) {
  10578. margin-right: 5px;
  10579. }
  10580. .pageAction.commaSeparated > li:not(:last-child)::after {
  10581. content: ",";
  10582. padding-left: 1px;
  10583. }
  10584. .pageAction.dotSeparated > li:not(:last-child)::after {
  10585. content: "·";
  10586. margin-left: 5px;
  10587. }
  10588. .pageAction > li {
  10589. animation: 0.3s ease 0s normal forwards 1 running wcfPageActionOut;
  10590. display: flex;
  10591. max-width: 400px;
  10592. white-space: nowrap;
  10593. }
  10594. .pageAction > li[aria-hidden="false"] {
  10595. animation: 0.3s ease 0s normal forwards 1 running wcfPageAction;
  10596. }
  10597. .pageAction > li.remove {
  10598. animation: 0.5s ease 0s normal forwards 1 running wcfPageActionRemove;
  10599. }
  10600. .pageAction > li.initiallyHidden {
  10601. animation: 0s ease 0s normal none 0 running none;
  10602. visibility: hidden;
  10603. }
  10604. .pageAction > li.toTop > a {
  10605. padding: 2px;
  10606. }
  10607. @media (max-width: 544px) {
  10608. .pageAction {
  10609. flex-wrap: nowrap;
  10610. left: 10px;
  10611. }
  10612. .pageAction > li {
  10613. flex: 1 1 auto;
  10614. overflow: hidden;
  10615. }
  10616. .pageAction > li > a {
  10617. overflow: hidden;
  10618. text-align: center;
  10619. text-overflow: ellipsis;
  10620. width: 100%;
  10621. }
  10622. }
  10623. .pageOverlayActive .pageAction {
  10624. display: none;
  10625. }
  10626. @media (max-width: 544px) {
  10627. .redactorActive .pageAction {
  10628. display: none !important;
  10629. }
  10630. }
  10631. @media (max-width: 544px) {
  10632. .pagination {
  10633. text-align: center;
  10634. }
  10635. }
  10636. .pagination > ul {
  10637. display: inline-flex;
  10638. flex-wrap: wrap;
  10639. }
  10640. .pagination > ul > li {
  10641. display: flex;
  10642. flex: 0 0 auto;
  10643. }
  10644. .pagination > ul > li > .invisible {
  10645. display: none;
  10646. }
  10647. .pagination > ul > li > a, .pagination > ul > li > span {
  10648. color: rgba(44, 62, 80, 1);
  10649. padding: 2px 8px 0;
  10650. }
  10651. .pagination > ul > li.disabled > span {
  10652. color: rgba(125, 130, 135, 1);
  10653. }
  10654. .pagination > ul > li.active > a, .pagination > ul > li.active > span, .pagination > ul > li > a:hover {
  10655. background-color: rgba(120, 144, 156, 1);
  10656. color: rgba(255, 255, 255, 1);
  10657. }
  10658. .pagination > ul > li > .icon {
  10659. height: auto;
  10660. line-height: inherit;
  10661. width: auto;
  10662. }
  10663. .pagination > ul > li:not(:last-child) {
  10664. margin-right: 1px;
  10665. }
  10666. .pagination > ul > li:not(.skip) > a, .pagination > ul > li:not(.skip) > span {
  10667. padding: 4px 8px;
  10668. }
  10669. .pagination > ul > li:first-child > a::before, .pagination > ul > li:first-child > span::before {
  10670. left: -1px;
  10671. position: relative;
  10672. }
  10673. .ps-container:hover > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  10674. background-color: rgba(102, 102, 102, 0.6);
  10675. }
  10676. .ps-container.ps-active-y > .ps-scrollbar-y-rail {
  10677. display: block;
  10678. }
  10679. .ps-container > .ps-scrollbar-y-rail {
  10680. background-color: rgba(102, 102, 102, 0);
  10681. border-radius: 2px;
  10682. bottom: 0;
  10683. display: none;
  10684. position: absolute;
  10685. right: 2px;
  10686. transition: background-color 0.24s linear 0s;
  10687. width: 6px;
  10688. }
  10689. .ps-container > .ps-scrollbar-y-rail:hover {
  10690. background-color: rgba(102, 102, 102, 0.3);
  10691. }
  10692. .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  10693. background-color: rgba(102, 102, 102, 0);
  10694. border-radius: 2px;
  10695. position: relative;
  10696. transition: background-color 0.24s linear 0s;
  10697. }
  10698. .pollOptionContainer .pollOptionInput {
  10699. align-items: center;
  10700. display: inline-flex;
  10701. margin: 5px 0;
  10702. width: 100%;
  10703. }
  10704. .pollOptionContainer .pollOptionInput > .icon {
  10705. flex: 0 0 auto;
  10706. margin: 0 5px;
  10707. }
  10708. .pollOptionContainer .pollOptionInput > input {
  10709. flex: 1 1 auto;
  10710. margin-left: 5px;
  10711. }
  10712. .pollContainer {
  10713. -moz-border-bottom-colors: none;
  10714. -moz-border-left-colors: none;
  10715. -moz-border-right-colors: none;
  10716. -moz-border-top-colors: none;
  10717. border-color: rgba(65, 121, 173, 1);
  10718. border-image: none;
  10719. border-style: solid;
  10720. border-width: 1px 0;
  10721. margin-bottom: 10px;
  10722. min-width: 300px;
  10723. padding: 10px 0;
  10724. }
  10725. @media (min-width: 545px) {
  10726. .pollContainer {
  10727. float: left;
  10728. margin-right: 20px;
  10729. max-width: 50%;
  10730. }
  10731. }
  10732. .pollContainer h2 {
  10733. font-weight: 400;
  10734. line-height: 1.28;
  10735. }
  10736. @media (min-width: 769px) {
  10737. .pollContainer h2 {
  10738. font-size: 18px;
  10739. }
  10740. }
  10741. @media (max-width: 768px) {
  10742. .pollContainer h2 {
  10743. font-size: 18px;
  10744. }
  10745. }
  10746. .pollContainer .pollInnerContainer {
  10747. margin-top: 30px;
  10748. }
  10749. .pollContainer .pollInnerContainer dd:not(:last-child) {
  10750. margin-bottom: 5px;
  10751. }
  10752. .pollContainer .formSubmit {
  10753. border-top: 1px solid rgba(224, 224, 224, 1);
  10754. padding-top: 10px;
  10755. }
  10756. .pollContainer .pollResultItem {
  10757. }
  10758. .pollContainer .pollResultItem + .pollResultItem {
  10759. margin-top: 20px;
  10760. }
  10761. .pollContainer .pollResultItem .pollResultItemCaption {
  10762. align-items: flex-end;
  10763. display: flex;
  10764. }
  10765. .pollContainer .pollResultItem .pollResultItemCaption > .pollOptionName {
  10766. flex: 1 1 auto;
  10767. }
  10768. .pollContainer .pollResultItem .pollResultItemCaption > .pollOptionRelativeValue {
  10769. color: #7d8287;
  10770. flex: 0 0 50px;
  10771. text-align: right;
  10772. }
  10773. .pollContainer .pollResultItem .pollMeter {
  10774. background-color: rgba(224, 224, 224, 1);
  10775. height: 5px;
  10776. margin-top: 5px;
  10777. }
  10778. .pollContainer .pollResultItem .pollMeter > .pollMeterValue {
  10779. background-color: rgba(65, 121, 173, 1);
  10780. height: 100%;
  10781. }
  10782. @keyframes wcfPopover {
  10783. 0% {
  10784. opacity: 0;
  10785. transform: translateY(-20px);
  10786. visibility: visible;
  10787. }
  10788. 100% {
  10789. opacity: 1;
  10790. transform: translateY(0px);
  10791. visibility: visible;
  10792. }
  10793. }
  10794. @keyframes wcfPopoverOut {
  10795. 0% {
  10796. opacity: 1;
  10797. transform: translateY(0px);
  10798. visibility: visible;
  10799. }
  10800. 100% {
  10801. opacity: 0;
  10802. transform: translateY(-20px);
  10803. visibility: hidden;
  10804. }
  10805. }
  10806. .popover {
  10807. animation: 0.3s ease 0s normal forwards 1 running wcfPopoverOut;
  10808. background-color: rgba(250, 250, 250, 1);
  10809. border-radius: 2px;
  10810. box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  10811. position: absolute;
  10812. top: 0;
  10813. vertical-align: middle;
  10814. visibility: hidden;
  10815. width: 500px !important;
  10816. z-index: 500;
  10817. }
  10818. .popover.active {
  10819. animation: 0.3s ease 0s normal forwards 1 running wcfPopover;
  10820. }
  10821. .popover.forceHide {
  10822. animation: 0s ease 0s normal none 0 running none;
  10823. visibility: hidden;
  10824. }
  10825. .popover > .elementPointer {
  10826. display: none;
  10827. }
  10828. @media (max-width: 768px) {
  10829. .popover {
  10830. display: none;
  10831. }
  10832. }
  10833. .popoverContent {
  10834. background-color: rgba(250, 250, 250, 1);
  10835. border-radius: 3px;
  10836. color: rgba(44, 62, 80, 1);
  10837. padding: 15px;
  10838. }
  10839. .popoverContent > div {
  10840. max-height: 290px;
  10841. min-height: 36px;
  10842. overflow: hidden;
  10843. }
  10844. .popoverContent a {
  10845. color: rgba(230, 81, 0, 1);
  10846. }
  10847. .popoverContent a:hover {
  10848. color: rgba(191, 54, 12, 1);
  10849. }
  10850. #recaptcha_response_field {
  10851. margin-top: 20px;
  10852. }
  10853. .redactor-box {
  10854. background-color: rgba(250, 250, 250, 1);
  10855. position: relative;
  10856. }
  10857. .redactor-box:not(:first-child) {
  10858. margin-top: 20px;
  10859. }
  10860. .redactor-box + .messageTabMenu {
  10861. padding: 0;
  10862. }
  10863. .redactor-box + .innerError, .redactor-box > .innerError {
  10864. border-radius: 0;
  10865. box-shadow: none;
  10866. display: block;
  10867. margin-top: -1px;
  10868. }
  10869. .redactor-box > .innerError {
  10870. margin: -1px;
  10871. }
  10872. .redactor-layer {
  10873. -moz-border-bottom-colors: none;
  10874. -moz-border-left-colors: none;
  10875. -moz-border-right-colors: none;
  10876. -moz-border-top-colors: none;
  10877. border-color: rgba(224, 224, 224, 1);
  10878. border-image: none;
  10879. border-style: solid;
  10880. border-width: 0 1px 1px;
  10881. max-height: 500px;
  10882. outline: medium none;
  10883. overflow: auto;
  10884. padding: 10px;
  10885. position: relative;
  10886. }
  10887. .redactor-layer * {
  10888. min-width: auto;
  10889. }
  10890. .redactor-layer.redactor-placeholder::after {
  10891. color: rgba(125, 130, 135, 1);
  10892. content: attr(placeholder);
  10893. display: block;
  10894. pointer-events: none;
  10895. position: absolute;
  10896. }
  10897. .redactor-layer + textarea {
  10898. border-width: 0;
  10899. box-shadow: none;
  10900. outline: medium none;
  10901. padding: 10px;
  10902. resize: vertical;
  10903. }
  10904. .redactor-layer + textarea:focus {
  10905. box-shadow: none;
  10906. }
  10907. .redactor-layer > *:first-child:not(p) {
  10908. margin-top: 10px !important;
  10909. }
  10910. .redactor-layer > *:last-child:not(p) {
  10911. margin-bottom: 20px !important;
  10912. }
  10913. .redactor-layer > p:first-child {
  10914. margin-top: 0;
  10915. }
  10916. .redactor-layer img {
  10917. max-width: 100%;
  10918. }
  10919. .redactor-layer img:not(.smiley) {
  10920. cursor: pointer;
  10921. }
  10922. .redactor-layer img[src^="data:image"] {
  10923. display: none !important;
  10924. }
  10925. .redactor-layer table {
  10926. border-collapse: collapse;
  10927. line-height: 1.6em;
  10928. }
  10929. .redactor-layer table th {
  10930. -moz-border-bottom-colors: none;
  10931. -moz-border-left-colors: none;
  10932. -moz-border-right-colors: none;
  10933. -moz-border-top-colors: none;
  10934. border-color: #ddd #ddd currentcolor;
  10935. border-image: none;
  10936. border-style: solid;
  10937. border-width: 1px 1px 2px;
  10938. }
  10939. .redactor-layer table td {
  10940. border: 1px solid #ddd;
  10941. padding: 5px;
  10942. vertical-align: top;
  10943. }
  10944. .redactor-layer table td::before {
  10945. content: "";
  10946. display: inline-block;
  10947. }
  10948. .redactor-dropdown > .dropdownMenu {
  10949. display: block;
  10950. position: relative;
  10951. visibility: visible;
  10952. }
  10953. @media (min-width: 1025px) {
  10954. .redactor-dropdown > .dropdownMenu {
  10955. top: 1px;
  10956. }
  10957. }
  10958. .redactor-dropdown > .dropdownMenu > li:hover {
  10959. background-color: transparent !important;
  10960. }
  10961. .redactor-dropdown > .dropdownMenu a:hover {
  10962. background-color: rgba(238, 238, 238, 1);
  10963. }
  10964. .redactor-dropdown .redactor-dropdown-link-inactive {
  10965. cursor: default;
  10966. opacity: 0.6;
  10967. }
  10968. .redactor-dropdown .redactor-dropdown-link-inactive > a:hover {
  10969. background-color: rgba(255, 255, 255, 1) !important;
  10970. color: rgba(33, 33, 33, 1) !important;
  10971. cursor: default !important;
  10972. }
  10973. @media (max-width: 1024px) {
  10974. .redactor-layer {
  10975. font-size: 16px;
  10976. max-height: 500px;
  10977. }
  10978. }
  10979. .redactor-toolbar {
  10980. background-color: rgba(58, 109, 156, 1);
  10981. display: flex;
  10982. flex-wrap: wrap;
  10983. }
  10984. .redactor-toolbar > li {
  10985. flex: 0 0 auto;
  10986. }
  10987. .redactor-toolbar > li > a {
  10988. color: rgba(255, 255, 255, 1);
  10989. display: block;
  10990. font-weight: 400;
  10991. outline: medium none;
  10992. padding: 10px;
  10993. text-align: center;
  10994. }
  10995. @media (min-width: 769px) {
  10996. .redactor-toolbar > li > a {
  10997. font-size: 12px;
  10998. }
  10999. }
  11000. @media (max-width: 768px) {
  11001. .redactor-toolbar > li > a {
  11002. font-size: 12px;
  11003. }
  11004. }
  11005. .redactor-toolbar > li > a.redactor-button-disabled {
  11006. background-color: transparent !important;
  11007. color: rgba(165, 165, 165, 1) !important;
  11008. cursor: default;
  11009. pointer-events: none;
  11010. }
  11011. .redactor-toolbar > li > a.redactor-act, .redactor-toolbar > li > a.dropact {
  11012. background-color: rgba(36, 66, 95, 1);
  11013. color: rgba(255, 255, 255, 1);
  11014. }
  11015. .redactor-toolbar > li > a .icon {
  11016. color: inherit;
  11017. cursor: inherit !important;
  11018. }
  11019. .redactor-toolbar > li > a .icon.redactorButtonImage {
  11020. background: rgba(0, 0, 0, 0) none no-repeat scroll center center / contain ;
  11021. }
  11022. @media (min-width: 1025px) {
  11023. .redactor-toolbar > li > a:hover {
  11024. background-color: rgba(36, 66, 95, 1);
  11025. color: rgba(255, 255, 255, 1);
  11026. }
  11027. }
  11028. @media (min-width: 545px) {
  11029. .redactor-toolbar > li.redactor-toolbar-separator {
  11030. margin-left: 11px;
  11031. position: relative;
  11032. }
  11033. .redactor-toolbar > li.redactor-toolbar-separator::before {
  11034. border-left: 1px solid rgba(255, 255, 255, 1);
  11035. bottom: 7px;
  11036. content: "";
  11037. left: -6px;
  11038. opacity: 0.6;
  11039. position: absolute;
  11040. top: 7px;
  11041. }
  11042. }
  11043. @media (max-width: 544px) {
  11044. .redactor-toolbar:not(.redactorToolbarOverride) > li[data-show-on-mobile="false"] {
  11045. display: none;
  11046. }
  11047. .redactor-toolbar.redactorToolbarOverride > .redactor-toolbar-separator {
  11048. position: relative;
  11049. }
  11050. .redactor-toolbar.redactorToolbarOverride > .redactor-toolbar-separator::before {
  11051. border-left: 1px solid rgba(255, 255, 255, 1);
  11052. bottom: 7px;
  11053. content: "";
  11054. left: 0;
  11055. opacity: 0.6;
  11056. position: absolute;
  11057. top: 7px;
  11058. }
  11059. .redactor-toolbar .redactorToolbarToggle {
  11060. position: relative;
  11061. }
  11062. .redactor-toolbar .redactorToolbarToggle::before {
  11063. border-left: 1px solid rgba(255, 255, 255, 1);
  11064. bottom: 7px;
  11065. content: "";
  11066. left: 0;
  11067. opacity: 0.6;
  11068. position: absolute;
  11069. top: 7px;
  11070. }
  11071. }
  11072. .redactor-toolbar-tooltip {
  11073. opacity: 1;
  11074. visibility: visible;
  11075. }
  11076. .redactorAttachmentContainer {
  11077. -moz-border-bottom-colors: none;
  11078. -moz-border-left-colors: none;
  11079. -moz-border-right-colors: none;
  11080. -moz-border-top-colors: none;
  11081. background-color: rgba(255, 255, 255, 1);
  11082. border-color: rgba(238, 238, 238, 1);
  11083. border-image: none;
  11084. border-style: solid;
  11085. border-width: 0 1px 1px;
  11086. padding: 7px 14px;
  11087. }
  11088. .redactor-dropdown-box-fontcolor {
  11089. width: 200px;
  11090. }
  11091. .redactor-dropdown-box-fontcolor > li.redactorColorPallet {
  11092. padding: 0 4px;
  11093. }
  11094. .redactor-dropdown-box-fontcolor > li.redactorColorPallet:hover {
  11095. background-color: rgba(255, 255, 255, 1) !important;
  11096. }
  11097. .redactor-dropdown-box-fontcolor > li.redactorColorPallet > a {
  11098. -moz-border-bottom-colors: none;
  11099. -moz-border-left-colors: none;
  11100. -moz-border-right-colors: none;
  11101. -moz-border-top-colors: none;
  11102. border-color: rgba(255, 255, 255, 1);
  11103. border-image: none;
  11104. border-style: solid;
  11105. border-width: 2px 2px 0;
  11106. display: inline-block;
  11107. font-size: 0;
  11108. height: 20px;
  11109. margin: 0;
  11110. padding: 0;
  11111. width: 20px;
  11112. }
  11113. .redactorDropArea {
  11114. align-items: center;
  11115. background-color: rgba(217, 237, 247, 1);
  11116. border: 5px dashed currentcolor;
  11117. bottom: 0;
  11118. color: rgba(49, 112, 143, 1);
  11119. display: flex;
  11120. font-weight: 300;
  11121. justify-content: center;
  11122. left: 0;
  11123. line-height: 1.28;
  11124. position: absolute;
  11125. right: 0;
  11126. z-index: 10;
  11127. }
  11128. @media (min-width: 769px) {
  11129. .redactorDropArea {
  11130. font-size: 23px;
  11131. }
  11132. }
  11133. @media (max-width: 768px) {
  11134. .redactorDropArea {
  11135. font-size: 20px;
  11136. }
  11137. }
  11138. .redactorDropArea::before {
  11139. content: attr(data-drop-here);
  11140. }
  11141. .redactorDropArea.active {
  11142. background-color: rgba(223, 240, 216, 1);
  11143. color: rgba(60, 118, 61, 1);
  11144. }
  11145. .redactorDropArea.active::before {
  11146. content: attr(data-drop-now);
  11147. }
  11148. .redactor-link-tooltip {
  11149. background-color: rgba(0, 0, 0, 0.8);
  11150. border-radius: 2px;
  11151. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  11152. color: rgba(255, 255, 255, 1);
  11153. padding: 5px 10px 7px;
  11154. position: absolute;
  11155. z-index: 800;
  11156. }
  11157. .redactor-link-tooltip > a {
  11158. color: rgba(255, 255, 255, 1);
  11159. }
  11160. .redactor-voice-label {
  11161. display: none;
  11162. }
  11163. .redactor-dropdown-h2 {
  11164. font-weight: 300;
  11165. line-height: 1.28;
  11166. }
  11167. @media (min-width: 769px) {
  11168. .redactor-dropdown-h2 {
  11169. font-size: 23px;
  11170. }
  11171. }
  11172. @media (max-width: 768px) {
  11173. .redactor-dropdown-h2 {
  11174. font-size: 20px;
  11175. }
  11176. }
  11177. .redactor-dropdown-h3 {
  11178. font-weight: 400;
  11179. line-height: 1.28;
  11180. }
  11181. @media (min-width: 769px) {
  11182. .redactor-dropdown-h3 {
  11183. font-size: 18px;
  11184. }
  11185. }
  11186. @media (max-width: 768px) {
  11187. .redactor-dropdown-h3 {
  11188. font-size: 18px;
  11189. }
  11190. }
  11191. .text-center {
  11192. text-align: center !important;
  11193. }
  11194. .text-right {
  11195. text-align: right !important;
  11196. }
  11197. .text-justify {
  11198. hyphens: auto;
  11199. text-align: justify !important;
  11200. }
  11201. .redactor-dropdown-box-woltlabColor > ul {
  11202. display: flex !important;
  11203. flex-wrap: wrap;
  11204. width: 272px;
  11205. }
  11206. .redactor-dropdown-box-woltlabColor > ul > .dropdownDivider, .redactor-dropdown-box-woltlabColor > ul > .dropdownDivider + li {
  11207. flex: 0 0 100%;
  11208. }
  11209. .redactor-dropdown-box-woltlabColor .woltlab-color-selection {
  11210. flex: 0 0 30px;
  11211. margin: 2px;
  11212. overflow: hidden;
  11213. }
  11214. .redactor-dropdown-box-woltlabColor .woltlab-color-selection > a {
  11215. background-color: currentcolor !important;
  11216. display: block;
  11217. height: 30px;
  11218. width: 30px;
  11219. }
  11220. .woltlab-size-8 {
  11221. font-size: 8pt;
  11222. }
  11223. .woltlab-size-10 {
  11224. font-size: 10pt;
  11225. }
  11226. .woltlab-size-12 {
  11227. font-size: 12pt;
  11228. }
  11229. .woltlab-size-14 {
  11230. font-size: 14pt;
  11231. }
  11232. .woltlab-size-18 {
  11233. font-size: 18pt;
  11234. }
  11235. .woltlab-size-24 {
  11236. font-size: 24pt;
  11237. }
  11238. .woltlab-size-36 {
  11239. font-size: 36pt;
  11240. }
  11241. .messageFloatObjectLeft {
  11242. float: left;
  11243. margin: 0 20px 20px 0;
  11244. }
  11245. .messageFloatObjectRight {
  11246. float: right;
  11247. margin: 0 0 20px 20px;
  11248. }
  11249. .smiley[src$="_emojione.png"], .jsSmiley > img[src$="_emojione.png"] {
  11250. max-height: 20px;
  11251. }
  11252. .smiley {
  11253. margin: 0 1px;
  11254. }
  11255. @media (max-width: 1024px) {
  11256. .jsSmiley {
  11257. display: inline-block;
  11258. padding: 10px;
  11259. }
  11260. }
  11261. .wysiwygTextarea {
  11262. background-color: transparent !important;
  11263. border: 1px solid rgba(224, 224, 224, 1) !important;
  11264. color: transparent !important;
  11265. display: block;
  11266. height: 238px;
  11267. width: 100%;
  11268. }
  11269. .messageQuickReplyCollapsed {
  11270. border-bottom-width: 0 !important;
  11271. }
  11272. @media (max-width: 768px) {
  11273. .messageQuickReplyCollapsed {
  11274. margin-left: -10px;
  11275. margin-right: -10px;
  11276. }
  11277. }
  11278. .messageQuickReplyCollapsed .messageSidebar {
  11279. display: none;
  11280. }
  11281. .messageQuickReplyCollapsed .messageQuickReplyContent {
  11282. background-color: rgba(236, 241, 247, 1);
  11283. cursor: pointer;
  11284. display: inline-block !important;
  11285. margin: 0 !important;
  11286. max-width: 100% !important;
  11287. overflow: hidden;
  11288. padding: 10px 20px;
  11289. position: relative;
  11290. width: 100% !important;
  11291. }
  11292. @media (min-width: 769px) {
  11293. .messageQuickReplyCollapsed .messageQuickReplyContent {
  11294. border-radius: 2px;
  11295. }
  11296. }
  11297. .messageQuickReplyCollapsed .messageQuickReplyContent::before {
  11298. color: rgba(44, 62, 80, 1);
  11299. content: "";
  11300. font-family: FontAwesome;
  11301. font-size: 28px;
  11302. height: 32px;
  11303. line-height: 32px;
  11304. margin-right: 10px;
  11305. vertical-align: -5px;
  11306. width: 32px;
  11307. }
  11308. .messageQuickReplyCollapsed .messageQuickReplyContent::after {
  11309. color: rgba(44, 62, 80, 1);
  11310. content: attr(data-placeholder);
  11311. }
  11312. @media (min-width: 545px) {
  11313. .messageQuickReplyCollapsed .messageQuickReplyContent::after {
  11314. font-weight: 300;
  11315. line-height: 1.28;
  11316. }
  11317. }
  11318. @media (min-width: 545px) and (min-width: 769px) {
  11319. .messageQuickReplyCollapsed .messageQuickReplyContent::after {
  11320. font-size: 23px;
  11321. }
  11322. }
  11323. @media (min-width: 545px) and (max-width: 768px) {
  11324. .messageQuickReplyCollapsed .messageQuickReplyContent::after {
  11325. font-size: 20px;
  11326. }
  11327. }
  11328. .messageQuickReplyCollapsed .messageQuickReplyContent > .messageBody {
  11329. left: 200%;
  11330. position: absolute;
  11331. top: -100%;
  11332. }
  11333. .messageQuickReplyCollapsed .messageQuickReplyContent > .messageFooter {
  11334. display: none;
  11335. }
  11336. .redactorAutosaveRestored {
  11337. background-color: rgba(250, 250, 250, 1);
  11338. border-top: 1px solid rgba(224, 224, 224, 1);
  11339. bottom: 1px;
  11340. display: flex;
  11341. opacity: 0;
  11342. position: absolute;
  11343. right: 1px;
  11344. transition: opacity 0.12s linear 0s, visibility 0s linear 0.12s;
  11345. visibility: hidden;
  11346. }
  11347. .redactorAutosaveRestored.active {
  11348. opacity: 1;
  11349. transition-delay: 0s;
  11350. visibility: visible;
  11351. }
  11352. .redactorAutosaveRestored > a {
  11353. border-left: 1px solid rgba(224, 224, 224, 1);
  11354. flex: 0 0 auto;
  11355. padding: 10px;
  11356. }
  11357. .redactorAutosaveRestored > span {
  11358. color: rgba(125, 130, 135, 1);
  11359. flex: 1 1 auto;
  11360. padding: 10px;
  11361. }
  11362. @media (min-width: 545px) {
  11363. .redactorAutosaveRestored {
  11364. border-left: 1px solid rgba(224, 224, 224, 1);
  11365. border-top-left-radius: 2px;
  11366. }
  11367. .redactorAutosaveRestored > span {
  11368. padding: 10px 20px;
  11369. }
  11370. }
  11371. @media (max-width: 544px) {
  11372. .redactorAutosaveRestored {
  11373. left: 1px;
  11374. }
  11375. .redactorAutosaveRestored > span {
  11376. text-align: center;
  11377. }
  11378. }
  11379. .redactorBoxFullscreen {
  11380. bottom: 0;
  11381. left: 0;
  11382. position: fixed;
  11383. right: 0;
  11384. top: 0;
  11385. z-index: 310;
  11386. }
  11387. .redactorBoxFullscreen .redactor-layer {
  11388. max-height: none !important;
  11389. min-height: 0 !important;
  11390. }
  11391. .scrollableCheckboxList {
  11392. background-color: rgba(241, 246, 251, 1);
  11393. border: 1px solid rgba(176, 200, 224, 1);
  11394. color: rgba(44, 62, 80, 1);
  11395. max-height: 500px;
  11396. max-width: 500px;
  11397. overflow: auto;
  11398. padding: 5px;
  11399. }
  11400. .scrollableCheckboxList li {
  11401. overflow: hidden;
  11402. text-overflow: ellipsis;
  11403. white-space: nowrap;
  11404. }
  11405. .itemListFilter {
  11406. max-width: 500px;
  11407. }
  11408. .itemListFilter > .inputAddon {
  11409. margin-top: 5px;
  11410. }
  11411. .highlight {
  11412. background-color: rgba(255, 214, 30, 1);
  11413. color: rgba(0, 0, 0, 1);
  11414. padding: 0 2px;
  11415. }
  11416. .messageShareButtons .inlineList {
  11417. margin-bottom: -5px;
  11418. margin-right: -5px;
  11419. }
  11420. .messageShareButtons .inlineList > li {
  11421. margin-bottom: 5px;
  11422. }
  11423. .messageShareButtons .button {
  11424. align-items: center;
  11425. display: flex;
  11426. }
  11427. @media (max-width: 768px) {
  11428. .messageShareButtons .button > span:not(.icon) {
  11429. display: none;
  11430. }
  11431. }
  11432. @media (min-width: 769px) {
  11433. .messageShareButtons .icon {
  11434. margin-right: 3px;
  11435. }
  11436. }
  11437. .messageShareButtons .jsShareFacebook {
  11438. background-color: rgba(59, 89, 153, 1);
  11439. color: rgba(255, 255, 255, 1);
  11440. }
  11441. .messageShareButtons .jsShareFacebook:hover {
  11442. background-color: rgba(45, 68, 116, 1);
  11443. color: rgba(255, 255, 255, 1);
  11444. }
  11445. .messageShareButtons .jsShareTwitter {
  11446. background-color: #55acee;
  11447. color: rgba(255, 255, 255, 1);
  11448. }
  11449. .messageShareButtons .jsShareTwitter:hover {
  11450. background-color: #2795e9;
  11451. color: rgba(255, 255, 255, 1);
  11452. }
  11453. .messageShareButtons .jsShareGoogle {
  11454. background-color: rgba(220, 78, 65, 1);
  11455. color: rgba(255, 255, 255, 1);
  11456. }
  11457. .messageShareButtons .jsShareGoogle:hover {
  11458. background-color: rgba(198, 50, 36, 1);
  11459. color: rgba(255, 255, 255, 1);
  11460. }
  11461. .messageShareButtons .jsShareReddit {
  11462. background-color: rgba(255, 69, 0, 1);
  11463. color: rgba(255, 255, 255, 1);
  11464. }
  11465. .messageShareButtons .jsShareReddit:hover {
  11466. background-color: rgba(204, 55, 0, 1);
  11467. color: rgba(255, 255, 255, 1);
  11468. }
  11469. .messageShareButtons .jsShareWhatsApp {
  11470. background-color: #25d366;
  11471. color: rgba(255, 255, 255, 1);
  11472. }
  11473. .messageShareButtons .jsShareWhatsApp:hover {
  11474. background-color: #1da851;
  11475. color: rgba(255, 255, 255, 1);
  11476. }
  11477. .messageShareButtons .jsShareLinkedIn {
  11478. background-color: rgba(0, 122, 182, 1);
  11479. color: rgba(255, 255, 255, 1);
  11480. }
  11481. .messageShareButtons .jsShareLinkedIn:hover {
  11482. background-color: rgba(0, 88, 131, 1);
  11483. color: rgba(255, 255, 255, 1);
  11484. }
  11485. .messageShareButtons .jsSharePinterest {
  11486. background-color: rgba(189, 33, 37, 1);
  11487. color: rgba(255, 255, 255, 1);
  11488. }
  11489. .messageShareButtons .jsSharePinterest:hover {
  11490. background-color: rgba(146, 25, 28, 1);
  11491. color: rgba(255, 255, 255, 1);
  11492. }
  11493. .messageShareButtons .jsShareXing {
  11494. background-color: rgba(0, 101, 103, 1);
  11495. color: rgba(255, 255, 255, 1);
  11496. }
  11497. .messageShareButtons .jsShareXing:hover {
  11498. background-color: rgba(0, 51, 52, 1);
  11499. color: rgba(255, 255, 255, 1);
  11500. }
  11501. .slideshowContainer {
  11502. overflow: hidden;
  11503. position: relative;
  11504. }
  11505. .slideshowContainer > ul:not(.slideshowButtonList) > li:not(:first-child) {
  11506. display: none;
  11507. }
  11508. .slideshowContainer > .slideshowItemList {
  11509. position: absolute;
  11510. transition: left 0.8s ease-out 0s;
  11511. }
  11512. .slideshowContainer > .slideshowItemList > li.slideshowItem {
  11513. display: block;
  11514. float: left;
  11515. overflow: hidden;
  11516. position: absolute;
  11517. top: 0;
  11518. transform: translate3d(0px, 0px, 0px);
  11519. }
  11520. .slideshowContainer > .slideshowButtonList {
  11521. position: absolute;
  11522. right: 0;
  11523. top: 0;
  11524. }
  11525. .slideshowContainer > .slideshowButtonList > li {
  11526. display: inline-block;
  11527. }
  11528. .slideshowContainer > .slideshowButtonList > li > a > .icon {
  11529. color: rgba(207, 216, 220, 1);
  11530. }
  11531. .slideshowContainer > .slideshowButtonList > li > a > .icon.active {
  11532. color: rgba(33, 150, 243, 1);
  11533. }
  11534. .slideshowContainer > .slideshowButtonList > li:hover > a > .icon {
  11535. color: rgba(26, 119, 201, 1);
  11536. }
  11537. .tabMenu > ul, .menu > ul {
  11538. display: flex;
  11539. flex-wrap: wrap;
  11540. }
  11541. .tabMenu > ul > li, .menu > ul > li {
  11542. flex: 0 1 auto;
  11543. }
  11544. .tabMenu > ul > li:not(:last-child), .menu > ul > li:not(:last-child) {
  11545. margin-right: 5px;
  11546. }
  11547. .tabMenu > ul.commaSeparated > li:not(:last-child)::after, .menu > ul.commaSeparated > li:not(:last-child)::after {
  11548. content: ",";
  11549. padding-left: 1px;
  11550. }
  11551. .tabMenu > ul.dotSeparated > li:not(:last-child)::after, .menu > ul.dotSeparated > li:not(:last-child)::after {
  11552. content: "·";
  11553. margin-left: 5px;
  11554. }
  11555. .tabMenu > ul > li, .menu > ul > li {
  11556. position: relative;
  11557. }
  11558. .tabMenu > ul > li:not(:last-child), .menu > ul > li:not(:last-child) {
  11559. margin-right: 20px;
  11560. }
  11561. .tabMenu > ul > li::before, .menu > ul > li::before {
  11562. border-top: 1px solid rgba(230, 81, 0, 1);
  11563. bottom: 0;
  11564. content: "";
  11565. left: 50%;
  11566. position: absolute;
  11567. width: 0;
  11568. }
  11569. .tabMenu > ul > li.active, .menu > ul > li.active {
  11570. z-index: 60;
  11571. }
  11572. .tabMenu > ul > li.active::before, .menu > ul > li.active::before {
  11573. left: 0;
  11574. transition: left 0.12s linear 0s, width 0.12s linear 0s;
  11575. width: 100%;
  11576. }
  11577. .tabMenu > ul > li.active > a, .menu > ul > li.active > a {
  11578. cursor: default;
  11579. }
  11580. .tabMenu > ul > li > a, .menu > ul > li > a {
  11581. display: block;
  11582. padding: 5px 0;
  11583. }
  11584. @media (max-width: 768px) {
  11585. .tabMenu, .menu {
  11586. padding-left: 15px;
  11587. padding-right: 15px;
  11588. position: relative;
  11589. }
  11590. .tabMenu::before, .menu::before {
  11591. display: none;
  11592. }
  11593. .tabMenu > ul, .menu > ul {
  11594. flex-wrap: nowrap;
  11595. overflow: auto;
  11596. }
  11597. .tabMenu > ul > li, .menu > ul > li {
  11598. flex-shrink: 0;
  11599. white-space: nowrap;
  11600. }
  11601. .tabMenu > ul.enableAnimation, .menu > ul.enableAnimation {
  11602. transition: padding-left 0.24s linear 0s;
  11603. }
  11604. .tabMenu > ul.enableAnimation > li:first-child, .menu > ul.enableAnimation > li:first-child {
  11605. transition: margin-left 0.24s linear 0s;
  11606. }
  11607. }
  11608. @media (min-width: 769px) {
  11609. .tabMenu > ul, .menu > ul {
  11610. border-bottom: 1px solid rgba(224, 224, 224, 1);
  11611. }
  11612. .tabMenu > ul > li::before, .menu > ul > li::before {
  11613. bottom: -1px;
  11614. }
  11615. }
  11616. .tabMenu > ul > li > a {
  11617. font-weight: 300;
  11618. line-height: 1.28;
  11619. }
  11620. @media (min-width: 769px) {
  11621. .tabMenu > ul > li > a {
  11622. font-size: 23px;
  11623. }
  11624. }
  11625. @media (max-width: 768px) {
  11626. .tabMenu > ul > li > a {
  11627. font-size: 20px;
  11628. }
  11629. }
  11630. .menu {
  11631. margin-top: 10px;
  11632. }
  11633. @media (min-width: 769px) {
  11634. .menu > ul > li > a {
  11635. font-weight: 400;
  11636. line-height: 1.28;
  11637. }
  11638. }
  11639. @media (min-width: 769px) and (min-width: 769px) {
  11640. .menu > ul > li > a {
  11641. font-size: 18px;
  11642. }
  11643. }
  11644. @media (min-width: 769px) and (max-width: 768px) {
  11645. .menu > ul > li > a {
  11646. font-size: 18px;
  11647. }
  11648. }
  11649. .menu + .tabMenuContent {
  11650. margin-top: 20px;
  11651. }
  11652. .tabMenuOverlayLeft, .tabMenuOverlayRight {
  11653. align-items: center;
  11654. bottom: 0;
  11655. display: flex;
  11656. height: 100%;
  11657. opacity: 0;
  11658. position: absolute;
  11659. top: 0;
  11660. transition: opacity 0.24s linear 0s, visibility 0s linear 0.24s;
  11661. visibility: hidden;
  11662. width: 30px;
  11663. z-index: 50;
  11664. }
  11665. .tabMenuOverlayLeft.active, .tabMenuOverlayRight.active {
  11666. opacity: 1;
  11667. transition-delay: 0s;
  11668. visibility: visible;
  11669. }
  11670. .tabMenuOverlayLeft::before, .tabMenuOverlayRight::before {
  11671. color: rgba(125, 130, 135, 1);
  11672. }
  11673. .tabMenuOverlayLeft {
  11674. background: rgba(0, 0, 0, 0) linear-gradient(to left, rgba(250, 250, 250, 0) 0%, rgba(250, 250, 250, 1) 50%) repeat scroll 0 0;
  11675. left: 0;
  11676. }
  11677. .tabMenuOverlayRight {
  11678. background: rgba(0, 0, 0, 0) linear-gradient(to right, rgba(250, 250, 250, 0) 0%, rgba(250, 250, 250, 1) 50%) repeat scroll 0 0;
  11679. justify-content: flex-end;
  11680. right: 0;
  11681. }
  11682. .tabMenuContent.hidden {
  11683. display: none;
  11684. }
  11685. .tabMenuContent > .containerList:first-child > li:first-child {
  11686. border-top-width: 0;
  11687. }
  11688. .messageTabMenu > .messageTabMenuContent {
  11689. display: none;
  11690. }
  11691. .messageTabMenu > .messageTabMenuContent.active {
  11692. background-color: rgba(250, 250, 250, 1);
  11693. display: block;
  11694. margin-top: 0;
  11695. }
  11696. .messageTabMenu:not(.messageTabMenuContent) > .messageTabMenuContent.active {
  11697. -moz-border-bottom-colors: none;
  11698. -moz-border-left-colors: none;
  11699. -moz-border-right-colors: none;
  11700. -moz-border-top-colors: none;
  11701. border-color: rgba(224, 224, 224, 1);
  11702. border-image: none;
  11703. border-style: solid;
  11704. border-width: 0 1px 1px;
  11705. padding: 20px;
  11706. }
  11707. .messageTabMenu.messageTabMenuContent > nav {
  11708. border-bottom: 1px solid rgba(224, 224, 224, 1);
  11709. margin: -20px -20px 20px;
  11710. padding: 5px 20px;
  11711. }
  11712. .messageTabMenu.messageTabMenuContent > nav > ul {
  11713. display: flex;
  11714. flex-wrap: wrap;
  11715. }
  11716. .messageTabMenu.messageTabMenuContent > nav > ul > li {
  11717. flex: 0 1 auto;
  11718. }
  11719. .messageTabMenu.messageTabMenuContent > nav > ul > li:not(:last-child) {
  11720. margin-right: 5px;
  11721. }
  11722. .messageTabMenu.messageTabMenuContent > nav > ul.commaSeparated > li:not(:last-child)::after {
  11723. content: ",";
  11724. padding-left: 1px;
  11725. }
  11726. .messageTabMenu.messageTabMenuContent > nav > ul.dotSeparated > li:not(:last-child)::after {
  11727. content: "·";
  11728. margin-left: 5px;
  11729. }
  11730. .messageTabMenu.messageTabMenuContent > nav > ul > li {
  11731. outline: 0 none;
  11732. }
  11733. .messageTabMenu.messageTabMenuContent > nav > ul > li:not(:last-child) {
  11734. margin-right: 20px;
  11735. }
  11736. .messageTabMenu.messageTabMenuContent > nav > ul > li.active > a {
  11737. color: rgba(191, 54, 12, 1);
  11738. }
  11739. .messageTabMenu.messageTabMenuContent > nav > ul > li > a {
  11740. -moz-user-select: none;
  11741. display: block;
  11742. font-weight: 400;
  11743. outline: 0 none;
  11744. }
  11745. @media (min-width: 769px) {
  11746. .messageTabMenu.messageTabMenuContent > nav > ul > li > a {
  11747. font-size: 12px;
  11748. }
  11749. }
  11750. @media (max-width: 768px) {
  11751. .messageTabMenu.messageTabMenuContent > nav > ul > li > a {
  11752. font-size: 12px;
  11753. }
  11754. }
  11755. .messageTabMenu + .innerError {
  11756. margin-top: -1px;
  11757. width: 100%;
  11758. }
  11759. .messageTabMenuNavigation > ul {
  11760. -moz-border-bottom-colors: none;
  11761. -moz-border-left-colors: none;
  11762. -moz-border-right-colors: none;
  11763. -moz-border-top-colors: none;
  11764. background-color: rgba(250, 250, 250, 1);
  11765. border-color: rgba(224, 224, 224, 1);
  11766. border-image: none;
  11767. border-style: solid;
  11768. border-width: 0 1px 1px;
  11769. display: flex;
  11770. flex-wrap: wrap;
  11771. }
  11772. .messageTabMenuNavigation > ul > li {
  11773. flex: 0 1 auto;
  11774. }
  11775. .messageTabMenuNavigation > ul > li:not(:last-child) {
  11776. margin-right: 5px;
  11777. }
  11778. .messageTabMenuNavigation > ul.commaSeparated > li:not(:last-child)::after {
  11779. content: ",";
  11780. padding-left: 1px;
  11781. }
  11782. .messageTabMenuNavigation > ul.dotSeparated > li:not(:last-child)::after {
  11783. content: "·";
  11784. margin-left: 5px;
  11785. }
  11786. .messageTabMenuNavigation > ul > li {
  11787. border-right: 1px solid rgba(224, 224, 224, 1);
  11788. }
  11789. .messageTabMenuNavigation > ul > li:not(:last-child) {
  11790. margin-right: 0;
  11791. }
  11792. .messageTabMenuNavigation > ul > li.active > a {
  11793. color: rgba(191, 54, 12, 1);
  11794. position: relative;
  11795. }
  11796. .messageTabMenuNavigation > ul > li.active > a::after {
  11797. border-bottom: 1px solid rgba(250, 250, 250, 1);
  11798. bottom: -1px;
  11799. content: "";
  11800. display: block;
  11801. left: 0;
  11802. position: absolute;
  11803. right: 0;
  11804. }
  11805. .messageTabMenuNavigation > ul > li > a {
  11806. -moz-user-select: none;
  11807. display: block;
  11808. padding: 10px 20px;
  11809. }
  11810. @media (min-width: 769px) {
  11811. .messageTabMenuNavigation > ul > li > a > .icon {
  11812. display: none;
  11813. }
  11814. }
  11815. @media (max-width: 768px) {
  11816. .messageTabMenuNavigation > ul > li > a > .icon {
  11817. display: block;
  11818. }
  11819. .messageTabMenuNavigation > ul > li > a > span:not(.icon) {
  11820. display: none;
  11821. }
  11822. }
  11823. .messageTabMenuNavigation > span {
  11824. display: none;
  11825. }
  11826. @-moz-document url-prefix("") {
  11827. fieldset + .messageTabMenu {
  11828. margin-top: -3px;
  11829. }
  11830. }
  11831. .uploadButton {
  11832. overflow: hidden;
  11833. position: relative;
  11834. }
  11835. .uploadButton > input {
  11836. bottom: 0;
  11837. left: 0;
  11838. opacity: 0;
  11839. position: absolute;
  11840. top: 0;
  11841. }
  11842. tr.sortableNode {
  11843. cursor: move;
  11844. }
  11845. .tabularList {
  11846. border-bottom: 1px solid rgba(65, 121, 173, 1);
  11847. display: flex;
  11848. flex-direction: column;
  11849. }
  11850. .tabularListRow {
  11851. flex: 0 0 auto;
  11852. padding: 5px 0;
  11853. transition: background-color 0.12s ease 0s;
  11854. }
  11855. .tabularListRow.divider + li:not(.divider) {
  11856. border-top-color: rgba(65, 121, 173, 1);
  11857. }
  11858. .tabularListRow:hover:not(.tabularListRowHead) {
  11859. background-color: rgba(242, 242, 242, 1);
  11860. }
  11861. .tabularListRowHead {
  11862. border-bottom: 2px solid currentcolor;
  11863. color: rgba(65, 121, 173, 1);
  11864. }
  11865. .tabularListRowHead + li {
  11866. border-top-width: 0 !important;
  11867. }
  11868. .tabularListRow:not(.tabularListRowHead) {
  11869. border-top: 1px solid rgba(224, 224, 224, 1);
  11870. }
  11871. .tabularListColumns {
  11872. align-items: center;
  11873. display: flex;
  11874. }
  11875. .tabularListColumns > li {
  11876. flex: 0 0 auto;
  11877. padding: 5px 10px;
  11878. }
  11879. .tabularListRowHead > .tabularListColumns > li {
  11880. color: rgba(65, 121, 173, 1);
  11881. font-weight: 400;
  11882. line-height: 1.28;
  11883. }
  11884. @media (min-width: 769px) {
  11885. .tabularListRowHead > .tabularListColumns > li {
  11886. font-size: 18px;
  11887. }
  11888. }
  11889. @media (max-width: 768px) {
  11890. .tabularListRowHead > .tabularListColumns > li {
  11891. font-size: 18px;
  11892. }
  11893. }
  11894. .tabularListRowHead > .tabularListColumns > li > a {
  11895. color: rgba(65, 121, 173, 1);
  11896. display: block;
  11897. }
  11898. .tabularListRowHead > .tabularListColumns > li.ASC > a, .tabularListRowHead > .tabularListColumns > li.DESC > a {
  11899. padding-right: 18px;
  11900. position: relative;
  11901. }
  11902. .tabularListRowHead > .tabularListColumns > li.ASC > a::after, .tabularListRowHead > .tabularListColumns > li.DESC > a::after {
  11903. display: inline-block;
  11904. font-family: FontAwesome;
  11905. margin-left: 7px;
  11906. position: absolute;
  11907. }
  11908. .tabularListRowHead > .tabularListColumns > li.ASC > a::after {
  11909. content: "";
  11910. top: 1px;
  11911. }
  11912. .tabularListRowHead > .tabularListColumns > li.DESC > a::after {
  11913. content: "";
  11914. top: 2px;
  11915. }
  11916. .tabularListRowHead > .tabularListColumns > li.active > a, .tabularListRowHead > .tabularListColumns > li > a:hover {
  11917. color: rgba(230, 81, 0, 1);
  11918. }
  11919. .tabularBox {
  11920. overflow: auto;
  11921. }
  11922. .tabularBoxTitle > header {
  11923. border-bottom: 1px solid currentcolor;
  11924. color: rgba(65, 121, 173, 1);
  11925. padding: 10px 0;
  11926. }
  11927. .tabularBoxTitle > header > h1, .tabularBoxTitle > header > h2, .tabularBoxTitle > header > h3 {
  11928. font-weight: 400;
  11929. line-height: 1.28;
  11930. }
  11931. @media (min-width: 769px) {
  11932. .tabularBoxTitle > header > h1, .tabularBoxTitle > header > h2, .tabularBoxTitle > header > h3 {
  11933. font-size: 18px;
  11934. }
  11935. }
  11936. @media (max-width: 768px) {
  11937. .tabularBoxTitle > header > h1, .tabularBoxTitle > header > h2, .tabularBoxTitle > header > h3 {
  11938. font-size: 18px;
  11939. }
  11940. }
  11941. .tabularBoxTitle > header > h1 + small, .tabularBoxTitle > header > h2 + small, .tabularBoxTitle > header > h3 + small {
  11942. display: block;
  11943. }
  11944. .tabularBoxTitle > header > h1 .badge, .tabularBoxTitle > header > h2 .badge, .tabularBoxTitle > header > h3 .badge {
  11945. top: -2px;
  11946. }
  11947. .tabularBoxTitle > header a, .tabularBoxTitle > header .icon {
  11948. color: rgba(65, 121, 173, 1);
  11949. }
  11950. .tabularBoxTitle > header a:hover, .tabularBoxTitle > header .icon:hover {
  11951. color: rgba(230, 81, 0, 1);
  11952. }
  11953. .tabularBoxTitle > header .collapsibleButton {
  11954. cursor: pointer;
  11955. transition: transform 0.12s linear 0s;
  11956. }
  11957. .htmlContent table, .messageBody > .messageText table, .messageSignature > div table, .redactor-layer table, .table {
  11958. border-bottom: 1px solid rgba(65, 121, 173, 1);
  11959. border-spacing: 0;
  11960. width: 100%;
  11961. }
  11962. .htmlContent table td, .messageBody > .messageText table td, .messageSignature > div table td, .redactor-layer table td, .table td, .htmlContent table th, .messageBody > .messageText table th, .messageSignature > div table th, .redactor-layer table th, .table th {
  11963. padding: 10px;
  11964. text-align: left;
  11965. vertical-align: middle;
  11966. }
  11967. .htmlContent table td > label, .messageBody > .messageText table td > label, .messageSignature > div table td > label, .redactor-layer table td > label, .table td > label, .htmlContent table th > label, .messageBody > .messageText table th > label, .messageSignature > div table th > label, .redactor-layer table th > label, .table th > label {
  11968. cursor: pointer;
  11969. display: block;
  11970. }
  11971. .htmlContent table th, .messageBody > .messageText table th, .messageSignature > div table th, .redactor-layer table th, .table th {
  11972. border-bottom: 2px solid currentcolor;
  11973. color: rgba(65, 121, 173, 1);
  11974. font-weight: 400;
  11975. line-height: 1.28;
  11976. text-align: left;
  11977. white-space: nowrap;
  11978. }
  11979. @media (min-width: 769px) {
  11980. .htmlContent table th, .messageBody > .messageText table th, .messageSignature > div table th, .redactor-layer table th, .table th {
  11981. font-size: 18px;
  11982. }
  11983. }
  11984. @media (max-width: 768px) {
  11985. .htmlContent table th, .messageBody > .messageText table th, .messageSignature > div table th, .redactor-layer table th, .table th {
  11986. font-size: 18px;
  11987. }
  11988. }
  11989. .htmlContent table th > a, .messageBody > .messageText table th > a, .messageSignature > div table th > a, .redactor-layer table th > a, .table th > a {
  11990. color: rgba(65, 121, 173, 1);
  11991. display: block;
  11992. }
  11993. .htmlContent table th.active > a, .messageBody > .messageText table th.active > a, .messageSignature > div table th.active > a, .redactor-layer table th.active > a, .table th.active > a, .htmlContent table th > a:hover, .messageBody > .messageText table th > a:hover, .messageSignature > div table th > a:hover, .redactor-layer table th > a:hover, .table th > a:hover {
  11994. color: rgba(230, 81, 0, 1);
  11995. }
  11996. .htmlContent table th.ASC > a::after, .messageBody > .messageText table th.ASC > a::after, .messageSignature > div table th.ASC > a::after, .redactor-layer table th.ASC > a::after, .table th.ASC > a::after, .htmlContent table th.DESC > a::after, .messageBody > .messageText table th.DESC > a::after, .messageSignature > div table th.DESC > a::after, .redactor-layer table th.DESC > a::after, .table th.DESC > a::after {
  11997. display: inline-block;
  11998. font-family: FontAwesome;
  11999. margin-left: 5px;
  12000. }
  12001. .htmlContent table th.ASC > a::after, .messageBody > .messageText table th.ASC > a::after, .messageSignature > div table th.ASC > a::after, .redactor-layer table th.ASC > a::after, .table th.ASC > a::after {
  12002. content: "";
  12003. }
  12004. .htmlContent table th.DESC > a::after, .messageBody > .messageText table th.DESC > a::after, .messageSignature > div table th.DESC > a::after, .redactor-layer table th.DESC > a::after, .table th.DESC > a::after {
  12005. content: "";
  12006. }
  12007. .htmlContent table th.columnMark, .messageBody > .messageText table th.columnMark, .messageSignature > div table th.columnMark, .redactor-layer table th.columnMark, .table th.columnMark, .htmlContent table th.columnStatus, .messageBody > .messageText table th.columnStatus, .messageSignature > div table th.columnStatus, .redactor-layer table th.columnStatus, .table th.columnStatus {
  12008. text-align: center;
  12009. }
  12010. .htmlContent table th.columnDate, .messageBody > .messageText table th.columnDate, .messageSignature > div table th.columnDate, .redactor-layer table th.columnDate, .table th.columnDate, .htmlContent table th.columnDigits, .messageBody > .messageText table th.columnDigits, .messageSignature > div table th.columnDigits, .redactor-layer table th.columnDigits, .table th.columnDigits, .htmlContent table th.columnID, .messageBody > .messageText table th.columnID, .messageSignature > div table th.columnID, .redactor-layer table th.columnID, .table th.columnID {
  12011. text-align: right;
  12012. }
  12013. .htmlContent table td.columnMark, .messageBody > .messageText table td.columnMark, .messageSignature > div table td.columnMark, .redactor-layer table td.columnMark, .table td.columnMark, .htmlContent table td.columnStatus, .messageBody > .messageText table td.columnStatus, .messageSignature > div table td.columnStatus, .redactor-layer table td.columnStatus, .table td.columnStatus {
  12014. overflow-wrap: normal;
  12015. text-align: center;
  12016. white-space: nowrap;
  12017. width: 1px;
  12018. }
  12019. .htmlContent table td.columnDigits, .messageBody > .messageText table td.columnDigits, .messageSignature > div table td.columnDigits, .redactor-layer table td.columnDigits, .table td.columnDigits, .htmlContent table td.columnID, .messageBody > .messageText table td.columnID, .messageSignature > div table td.columnID, .redactor-layer table td.columnID, .table td.columnID {
  12020. overflow-wrap: normal;
  12021. text-align: right;
  12022. white-space: nowrap;
  12023. width: 1px;
  12024. }
  12025. .htmlContent table td.columnIcon, .messageBody > .messageText table td.columnIcon, .messageSignature > div table td.columnIcon, .redactor-layer table td.columnIcon, .table td.columnIcon {
  12026. overflow-wrap: normal;
  12027. text-align: left;
  12028. white-space: nowrap;
  12029. width: 1px;
  12030. }
  12031. .htmlContent table td.columnTitle, .messageBody > .messageText table td.columnTitle, .messageSignature > div table td.columnTitle, .redactor-layer table td.columnTitle, .table td.columnTitle {
  12032. font-weight: bold;
  12033. text-align: left;
  12034. }
  12035. .htmlContent table td.columnText, .messageBody > .messageText table td.columnText, .messageSignature > div table td.columnText, .redactor-layer table td.columnText, .table td.columnText {
  12036. font-weight: normal;
  12037. max-width: 20%;
  12038. text-align: left;
  12039. }
  12040. .htmlContent table td.columnDate, .messageBody > .messageText table td.columnDate, .messageSignature > div table td.columnDate, .redactor-layer table td.columnDate, .table td.columnDate {
  12041. font-weight: 400;
  12042. overflow-wrap: normal;
  12043. text-align: right;
  12044. white-space: nowrap;
  12045. width: 1px;
  12046. }
  12047. @media (min-width: 769px) {
  12048. .htmlContent table td.columnDate, .messageBody > .messageText table td.columnDate, .messageSignature > div table td.columnDate, .redactor-layer table td.columnDate, .table td.columnDate {
  12049. font-size: 12px;
  12050. }
  12051. }
  12052. @media (max-width: 768px) {
  12053. .htmlContent table td.columnDate, .messageBody > .messageText table td.columnDate, .messageSignature > div table td.columnDate, .redactor-layer table td.columnDate, .table td.columnDate {
  12054. font-size: 12px;
  12055. }
  12056. }
  12057. .htmlContent table td.columnURL, .messageBody > .messageText table td.columnURL, .messageSignature > div table td.columnURL, .redactor-layer table td.columnURL, .table td.columnURL, .htmlContent table td.columnSmallText, .messageBody > .messageText table td.columnSmallText, .messageSignature > div table td.columnSmallText, .redactor-layer table td.columnSmallText, .table td.columnSmallText {
  12058. font-weight: 400;
  12059. text-align: left;
  12060. }
  12061. @media (min-width: 769px) {
  12062. .htmlContent table td.columnURL, .messageBody > .messageText table td.columnURL, .messageSignature > div table td.columnURL, .redactor-layer table td.columnURL, .table td.columnURL, .htmlContent table td.columnSmallText, .messageBody > .messageText table td.columnSmallText, .messageSignature > div table td.columnSmallText, .redactor-layer table td.columnSmallText, .table td.columnSmallText {
  12063. font-size: 12px;
  12064. }
  12065. }
  12066. @media (max-width: 768px) {
  12067. .htmlContent table td.columnURL, .messageBody > .messageText table td.columnURL, .messageSignature > div table td.columnURL, .redactor-layer table td.columnURL, .table td.columnURL, .htmlContent table td.columnSmallText, .messageBody > .messageText table td.columnSmallText, .messageSignature > div table td.columnSmallText, .redactor-layer table td.columnSmallText, .table td.columnSmallText {
  12068. font-size: 12px;
  12069. }
  12070. }
  12071. .htmlContent table tr:hover > td, .messageBody > .messageText table tr:hover > td, .messageSignature > div table tr:hover > td, .redactor-layer table tr:hover > td, .table tr:hover > td {
  12072. background-color: #f2f2f2;
  12073. }
  12074. .htmlContent table tr:not(:last-child) > td, .messageBody > .messageText table tr:not(:last-child) > td, .messageSignature > div table tr:not(:last-child) > td, .redactor-layer table tr:not(:last-child) > td, .table tr:not(:last-child) > td {
  12075. border-bottom: 1px solid rgba(224, 224, 224, 1);
  12076. }
  12077. .htmlContent table .statusDisplay, .messageBody > .messageText table .statusDisplay, .messageSignature > div table .statusDisplay, .redactor-layer table .statusDisplay, .table .statusDisplay {
  12078. float: right;
  12079. }
  12080. .htmlContent table .statusDisplay .statusIcons, .messageBody > .messageText table .statusDisplay .statusIcons, .messageSignature > div table .statusDisplay .statusIcons, .redactor-layer table .statusDisplay .statusIcons, .table .statusDisplay .statusIcons {
  12081. float: right;
  12082. margin-left: 5px;
  12083. }
  12084. .htmlContent table .statusDisplay .statusIcons li, .messageBody > .messageText table .statusDisplay .statusIcons li, .messageSignature > div table .statusDisplay .statusIcons li, .redactor-layer table .statusDisplay .statusIcons li, .table .statusDisplay .statusIcons li {
  12085. display: inline-block;
  12086. }
  12087. .htmlContent table tbody:first-child > tr:first-child > td, .messageBody > .messageText table tbody:first-child > tr:first-child > td, .messageSignature > div table tbody:first-child > tr:first-child > td, .redactor-layer table tbody:first-child > tr:first-child > td, .table tbody:first-child > tr:first-child > td {
  12088. border-top: 1px solid rgba(65, 121, 173, 1);
  12089. }
  12090. .balloonTooltip, .redactor-toolbar-tooltip {
  12091. background-color: rgba(0, 0, 0, 0.8);
  12092. border-radius: 2px;
  12093. box-shadow: 0 0 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  12094. color: rgba(255, 255, 255, 1);
  12095. font-weight: 400;
  12096. left: 0;
  12097. max-width: 300px;
  12098. padding: 5px 10px;
  12099. pointer-events: none;
  12100. position: absolute;
  12101. top: 0;
  12102. transition: visibility 0s linear 0.12s;
  12103. visibility: hidden;
  12104. z-index: 800;
  12105. }
  12106. @media (min-width: 769px) {
  12107. .balloonTooltip, .redactor-toolbar-tooltip {
  12108. font-size: 12px;
  12109. }
  12110. }
  12111. @media (max-width: 768px) {
  12112. .balloonTooltip, .redactor-toolbar-tooltip {
  12113. font-size: 12px;
  12114. }
  12115. }
  12116. .balloonTooltip > .elementPointer, .redactor-toolbar-tooltip > .elementPointer {
  12117. display: none;
  12118. }
  12119. .balloonTooltip.active, .redactor-toolbar-tooltip.active {
  12120. transition-delay: 0s;
  12121. visibility: visible;
  12122. }
  12123. .balloonTooltip.interactive, .redactor-toolbar-tooltip.interactive {
  12124. pointer-events: all;
  12125. }
  12126. .balloonTooltip.interactive > span, .redactor-toolbar-tooltip.interactive > span {
  12127. cursor: pointer;
  12128. }
  12129. .balloonTooltip.interactive > span:not(:first-child), .redactor-toolbar-tooltip.interactive > span:not(:first-child) {
  12130. border-left: 1px solid rgba(255, 255, 255, 1);
  12131. margin-left: 10px;
  12132. padding-left: 10px;
  12133. }
  12134. .ignoredUserContent {
  12135. filter: grayscale(100%) !important;
  12136. }
  12137. .ignoredUserContent:not(:hover) {
  12138. opacity: 0.5 !important;
  12139. }
  12140. .ignoredUserMessage {
  12141. background-color: rgba(217, 237, 247, 1) !important;
  12142. border-left: 5px solid rgba(188, 223, 241, 1) !important;
  12143. color: rgba(49, 112, 143, 1) !important;
  12144. cursor: pointer !important;
  12145. }
  12146. .ignoredUserMessage::before {
  12147. content: attr(data-ignored-user-message);
  12148. }
  12149. @media (min-width: 769px) {
  12150. .ignoredUserMessage::before {
  12151. padding: 10px 20px;
  12152. }
  12153. }
  12154. @media (max-width: 768px) {
  12155. .ignoredUserMessage::before {
  12156. padding: 10px;
  12157. }
  12158. }
  12159. .ignoredUserMessage > * {
  12160. display: none;
  12161. }
  12162. .loginForm > form .userLoginButtons {
  12163. margin-top: 20px;
  12164. text-align: center;
  12165. }
  12166. .loginForm > form .thirdPartyLogin {
  12167. flex: 0 0 100%;
  12168. }
  12169. .loginForm > form .thirdPartyLogin + .thirdPartyLogin {
  12170. margin-top: 10px;
  12171. }
  12172. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton {
  12173. border-width: 0;
  12174. color: rgba(255, 255, 255, 1);
  12175. display: flex;
  12176. }
  12177. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton > .icon {
  12178. flex: 0 0 24px;
  12179. }
  12180. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton > span:not(.icon) {
  12181. flex: 1 1 auto;
  12182. margin-left: 5px;
  12183. }
  12184. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.googleLoginButton {
  12185. background-color: #dd4b39;
  12186. }
  12187. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.googleLoginButton:hover {
  12188. background-color: #ca3523;
  12189. }
  12190. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.facebookLoginButton {
  12191. background-color: #3b5998;
  12192. }
  12193. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.facebookLoginButton:hover {
  12194. background-color: #30487b;
  12195. }
  12196. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.twitterLoginButton {
  12197. background-color: #55acee;
  12198. }
  12199. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.twitterLoginButton:hover {
  12200. background-color: #309aea;
  12201. }
  12202. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.githubLoginButton {
  12203. background-color: #444;
  12204. }
  12205. .loginForm > form .thirdPartyLogin .thirdPartyLoginButton.githubLoginButton:hover {
  12206. background-color: #303030;
  12207. }
  12208. @media (min-width: 769px) {
  12209. .loginForm:not(.loginFormLoginOnly) > form {
  12210. -moz-column-count: 2;
  12211. -moz-column-gap: 40px;
  12212. }
  12213. .loginForm:not(.loginFormLoginOnly) > form > .section {
  12214. margin-top: 0;
  12215. overflow: hidden;
  12216. page-break-inside: avoid;
  12217. }
  12218. .loginForm:not(.loginFormLoginOnly) > form > .section.loginFormLogin {
  12219. page-break-after: always;
  12220. }
  12221. .loginForm:not(.loginFormLoginOnly) > form > .section.loginFormRegister {
  12222. margin-top: 0;
  12223. }
  12224. .loginForm:not(.loginFormLoginOnly) > form > .section.loginFormRegister + .loginFormThirdPartyLogin {
  12225. margin-top: 30px;
  12226. }
  12227. }
  12228. @media (min-width: 769px) {
  12229. .contentHeader ~ .loginForm {
  12230. margin-top: 30px;
  12231. }
  12232. .dialogContent .loginForm:not(.loginFormLoginOnly) .section {
  12233. width: 300px;
  12234. }
  12235. }
  12236. .userProfileUser .contentHeaderIcon {
  12237. position: relative;
  12238. }
  12239. .userProfileUser .contentHeaderIcon a {
  12240. display: block;
  12241. }
  12242. .userProfileUser .contentHeaderIcon .badgeOnline {
  12243. left: 0;
  12244. pointer-events: none;
  12245. position: absolute;
  12246. }
  12247. @media (min-width: 769px) {
  12248. .userProfileUser .contentHeaderIcon .badgeOnline {
  12249. bottom: 0;
  12250. }
  12251. }
  12252. @media (max-width: 768px) {
  12253. .userProfileUser .contentHeaderIcon .badgeOnline {
  12254. color: transparent;
  12255. padding: 0;
  12256. top: 0;
  12257. width: 0;
  12258. }
  12259. .userProfileUser .contentHeaderIcon .badgeOnline::before {
  12260. background-color: inherit;
  12261. border: 1px solid rgba(255, 255, 255, 1);
  12262. border-radius: 50%;
  12263. content: "";
  12264. height: 16px;
  12265. left: 34px;
  12266. position: absolute;
  12267. width: 16px;
  12268. }
  12269. }
  12270. .userProfileUser .contentHeaderIcon a {
  12271. display: block;
  12272. }
  12273. .userProfileUser .contentHeaderDescription {
  12274. margin-top: 20px;
  12275. }
  12276. @media (min-width: 545px) and (max-width: 1024px) {
  12277. .userProfileUser .contentHeaderNavigation .button .invisible {
  12278. display: inline;
  12279. }
  12280. }
  12281. @media (max-width: 768px) {
  12282. .userProfileUser {
  12283. display: flex;
  12284. flex-wrap: wrap;
  12285. }
  12286. .userProfileUser .contentHeaderIcon {
  12287. display: block;
  12288. flex: 0 0 48px;
  12289. margin-right: 10px;
  12290. }
  12291. .userProfileUser .contentHeaderIcon img {
  12292. height: 48px !important;
  12293. width: 48px !important;
  12294. }
  12295. .userProfileUser .contentHeaderTitle {
  12296. flex: 0 0 calc(100% - 58px);
  12297. max-width: calc(100% - 58px);
  12298. }
  12299. .userProfileUser .contentHeaderNavigation {
  12300. flex: 0 0 100%;
  12301. }
  12302. }
  12303. @media (max-width: 544px) {
  12304. .userProfileUser .contentHeaderNavigation .userProfileButtonContainer {
  12305. display: flex;
  12306. }
  12307. .userProfileUser .contentHeaderNavigation .userProfileButtonContainer > li {
  12308. flex: 1 1 auto;
  12309. margin-top: 0 !important;
  12310. }
  12311. .userProfileUser .contentHeaderNavigation .userProfileButtonContainer > li:not(:last-child) {
  12312. margin-right: 1px;
  12313. }
  12314. .userProfileUser .contentHeaderNavigation .userProfileButtonContainer > li .invisible {
  12315. display: none !important;
  12316. }
  12317. }
  12318. @media (min-width: 769px) {
  12319. .userProfileUser .contentHeaderIcon {
  12320. flex: 0 0 128px;
  12321. margin-right: 20px;
  12322. }
  12323. }
  12324. .userTitleBadge {
  12325. max-width: 154px;
  12326. overflow: hidden;
  12327. text-overflow: ellipsis;
  12328. }
  12329. .userAvatarImage {
  12330. background-color: #fff;
  12331. border-radius: 50%;
  12332. }
  12333. .userAvatarList {
  12334. display: flex;
  12335. flex-wrap: wrap;
  12336. margin-bottom: -10px;
  12337. }
  12338. .userAvatarList > li {
  12339. flex: 0 0 48px;
  12340. margin-bottom: 10px;
  12341. text-align: center;
  12342. }
  12343. .userAvatarList > li:not(:last-child) {
  12344. margin-right: -12px;
  12345. }
  12346. .userAvatarList > li > a {
  12347. display: block;
  12348. }
  12349. .userAvatarList > li > a > img {
  12350. border: 2px solid #fff;
  12351. }
  12352. .userAvatarList.small > li {
  12353. flex: 0 0 24px;
  12354. }
  12355. .userAvatarList.small > li:not(:last-child) {
  12356. margin-right: -6px;
  12357. }
  12358. .userAvatarList.small > li > a > img {
  12359. border: 1px solid #fff;
  12360. }
  12361. .userList .box48 {
  12362. align-items: center;
  12363. }
  12364. .userProfilePreview {
  12365. position: relative;
  12366. }
  12367. .userProfilePreview .userInformation {
  12368. padding-bottom: 16px;
  12369. }
  12370. .userProfilePreview .buttonGroupNavigation {
  12371. bottom: 0;
  12372. position: absolute;
  12373. right: 0;
  12374. }
  12375. .userProfilePreview dl.inlineDataList {
  12376. font-weight: 400;
  12377. margin-top: 10px;
  12378. }
  12379. @media (min-width: 769px) {
  12380. .userProfilePreview dl.inlineDataList {
  12381. font-size: 12px;
  12382. }
  12383. }
  12384. @media (max-width: 768px) {
  12385. .userProfilePreview dl.inlineDataList {
  12386. font-size: 12px;
  12387. }
  12388. }
  12389. .userNotificationItemList > .notificationItem.notificationUnconfirmed {
  12390. align-items: center;
  12391. display: flex;
  12392. }
  12393. .userNotificationItemList > .notificationItem.notificationUnconfirmed > .box32 {
  12394. flex: 1 1 auto;
  12395. }
  12396. .userNotificationItemList > .notificationItem.notificationUnconfirmed > .notificationItemMarkAsConfirmed {
  12397. flex: 0 0 auto;
  12398. }
  12399. .conversationLeft .userLink, .conversationLeft.userLink, .conversationLeft p > span {
  12400. text-decoration: line-through;
  12401. }
  12402. .sidebar .box.conversationQuota .boxContent {
  12403. text-align: center;
  12404. }
  12405. .conversationUsageBar {
  12406. background-color: rgba(165, 223, 65, 1);
  12407. height: 5px;
  12408. }
  12409. .conversationUsageBar > span {
  12410. background-color: rgba(76, 169, 22, 1);
  12411. color: transparent;
  12412. display: block;
  12413. height: 100%;
  12414. }
  12415. .conversationUsageBar.yellow {
  12416. background-color: rgba(254, 207, 35, 1);
  12417. }
  12418. .conversationUsageBar.yellow > span {
  12419. background-color: rgba(253, 146, 21, 1);
  12420. }
  12421. .conversationUsageBar.red {
  12422. background-color: rgba(255, 205, 210, 1);
  12423. }
  12424. .conversationUsageBar.red > span {
  12425. background-color: rgba(244, 67, 54, 1);
  12426. }
  12427. .conversationItem .conversationInfo {
  12428. display: flex;
  12429. }
  12430. .conversationItem .conversationParticipant {
  12431. flex: 1 1 auto;
  12432. }
  12433. .conversationItem .conversationLastPostTime {
  12434. flex: 0 0 auto;
  12435. margin-left: 10px;
  12436. }
  12437. .wbbBoardList {
  12438. }
  12439. .wbbBoardList > li.wbbCategory:not(:last-child) {
  12440. margin-bottom: 20px;
  12441. }
  12442. .wbbBoardList > li.wbbBoardContainer:first-child {
  12443. border-top: 1px solid rgba(224, 224, 224, 1);
  12444. }
  12445. .wbbBoardList .wbbBoardContainer {
  12446. border-bottom: 1px solid rgba(224, 224, 224, 1);
  12447. }
  12448. .wbbBoardList .wbbBoard {
  12449. align-items: center;
  12450. display: flex;
  12451. padding: 10px 0;
  12452. }
  12453. .wbbBoardList .wbbBoard:hover {
  12454. background-color: rgba(242, 242, 242, 1);
  12455. }
  12456. @media (min-width: 1025px) {
  12457. .wbbBoardList .wbbBoard:hover .messageGroupListStatsSimple {
  12458. display: none;
  12459. }
  12460. .wbbBoardList .wbbBoard:hover .wbbStats > dl {
  12461. visibility: visible;
  12462. }
  12463. }
  12464. @media (min-width: 769px) {
  12465. .wbbBoardList .wbbBoard > .icon {
  12466. flex: 0 0 auto;
  12467. height: auto;
  12468. margin-left: 26px;
  12469. margin-right: 10px;
  12470. }
  12471. }
  12472. @media (max-width: 768px) {
  12473. .wbbBoardList .wbbBoard > .icon {
  12474. display: none;
  12475. }
  12476. }
  12477. .wbbBoardList .wbbBoard + ul {
  12478. border-top: 1px solid rgba(224, 224, 224, 1);
  12479. }
  12480. .wbbBoardList .wbbBoard + ul > li:last-child {
  12481. border-bottom-width: 0;
  12482. }
  12483. @media (max-width: 768px) {
  12484. .wbbBoardList .wbbBoard {
  12485. flex-wrap: wrap;
  12486. }
  12487. .wbbBoardList .wbbBoard .messageGroupListStatsSimple {
  12488. display: none;
  12489. }
  12490. }
  12491. .wbbBoardList .wbbBoardMain {
  12492. overflow: hidden;
  12493. }
  12494. .wbbBoardList .wbbBoardMain .badgeUpdateMobile {
  12495. display: none;
  12496. }
  12497. @media (min-width: 769px) {
  12498. .wbbBoardList .wbbBoardMain {
  12499. flex: 1 1 auto;
  12500. margin-right: 20px;
  12501. }
  12502. }
  12503. @media (max-width: 768px) {
  12504. .wbbBoardList .wbbBoardMain {
  12505. flex: 0 0 100%;
  12506. }
  12507. .wbbBoardList .wbbBoardMain h3 {
  12508. align-items: center;
  12509. display: flex;
  12510. overflow: hidden;
  12511. white-space: nowrap;
  12512. }
  12513. .wbbBoardList .wbbBoardMain h3::after {
  12514. color: rgba(125, 130, 135, 1);
  12515. content: "";
  12516. flex: 0 0 18px;
  12517. font-family: FontAwesome;
  12518. font-size: 28px;
  12519. line-height: 32px;
  12520. margin-left: 10px;
  12521. position: relative;
  12522. text-align: right;
  12523. top: -1px;
  12524. }
  12525. .wbbBoardList .wbbBoardMain h3 > a {
  12526. flex: 1 1 auto;
  12527. overflow: hidden;
  12528. text-overflow: ellipsis;
  12529. }
  12530. .wbbBoardList .wbbBoardMain h3 > .badge {
  12531. flex: 0 0 auto;
  12532. margin-left: 10px;
  12533. }
  12534. .wbbBoardList .wbbBoardMain .badgeUpdate:not(.badgeUpdateMobile) {
  12535. display: none;
  12536. }
  12537. .wbbBoardList .wbbBoardMain .badgeUpdateMobile {
  12538. display: inline-block;
  12539. }
  12540. }
  12541. @media (max-width: 768px) {
  12542. .wbbBoardList .wbbExternalLink .wbbBoardMain h3::after {
  12543. content: "";
  12544. font-size: 18px;
  12545. top: 3px;
  12546. }
  12547. }
  12548. @media (min-width: 769px) {
  12549. .wbbBoardList .wbbBoardDescription {
  12550. color: rgba(125, 130, 135, 1);
  12551. }
  12552. }
  12553. @media (max-width: 768px) {
  12554. .wbbBoardList .wbbBoardDescription {
  12555. display: none;
  12556. }
  12557. }
  12558. .wbbBoardList .wbbCollapsibleCategory h2 {
  12559. align-items: center;
  12560. display: flex;
  12561. }
  12562. .wbbBoardList .wbbCollapsibleCategory h2 > .collapsibleButton {
  12563. flex: 0 0 auto;
  12564. margin-right: 10px;
  12565. }
  12566. .wbbBoardList .wbbCollapsibleCategory h2 > a {
  12567. flex: 1 1 auto;
  12568. overflow: hidden;
  12569. }
  12570. @media (min-width: 769px) {
  12571. .wbbBoardList .wbbCollapsibleCategory h2 + small {
  12572. color: rgba(125, 130, 135, 1);
  12573. margin-left: 26px;
  12574. }
  12575. }
  12576. @media (max-width: 768px) {
  12577. .wbbBoardList .wbbCollapsibleCategory h2 + small {
  12578. display: none;
  12579. }
  12580. }
  12581. .wbbBoardList .wbbCollapsibleCategory.jsCollapsed h2 > .collapsibleButton {
  12582. transform: rotate(-90deg);
  12583. }
  12584. @media (min-width: 769px) {
  12585. .wbbBoardList .wbbSubBoards {
  12586. margin-top: 5px;
  12587. }
  12588. .wbbBoardList .wbbSubBoards > li {
  12589. align-items: center;
  12590. }
  12591. }
  12592. @media (max-width: 768px) {
  12593. .wbbBoardList .wbbSubBoards {
  12594. display: none;
  12595. }
  12596. }
  12597. .wbbBoardList .wbbStats {
  12598. position: relative;
  12599. }
  12600. @media (min-width: 769px) {
  12601. .wbbBoardList .wbbStats {
  12602. flex: 0 0 16%;
  12603. margin-right: 34%;
  12604. }
  12605. .wbbBoardList .wbbStats + .wbbLastPost {
  12606. margin-left: -34%;
  12607. }
  12608. .wbbBoardList .wbbStats > dl {
  12609. visibility: hidden;
  12610. }
  12611. }
  12612. @media (max-width: 768px) {
  12613. .wbbBoardList .wbbStats {
  12614. display: none;
  12615. }
  12616. }
  12617. .wbbBoardList .wbbLastPost {
  12618. overflow: hidden;
  12619. }
  12620. @media (min-width: 769px) {
  12621. .wbbBoardList .wbbLastPost {
  12622. flex: 0 0 34%;
  12623. padding-right: 20px;
  12624. }
  12625. }
  12626. @media (max-width: 768px) {
  12627. .wbbBoardList .wbbLastPost {
  12628. flex: 0 0 100%;
  12629. }
  12630. }
  12631. .wbbBoardList .wbbLastPost > .box32 {
  12632. align-items: center;
  12633. }
  12634. .wbbBoardList .wbbLastPost > .box32 > div > p {
  12635. overflow: hidden;
  12636. text-overflow: ellipsis;
  12637. white-space: nowrap;
  12638. }
  12639. @media (max-width: 768px) {
  12640. .wbbBoardList .wbbLastPost > .box32 > a {
  12641. display: none;
  12642. }
  12643. .wbbBoardList .wbbLastPost > .box32 > div {
  12644. align-items: center;
  12645. display: flex;
  12646. }
  12647. .wbbBoardList .wbbLastPost > .box32 > div > p {
  12648. flex: 1 1 auto;
  12649. }
  12650. .wbbBoardList .wbbLastPost > .box32 > div > p > a {
  12651. color: rgba(125, 130, 135, 1);
  12652. font-weight: 400;
  12653. }
  12654. .wbbBoardList .wbbLastPost > .box32 > div > small {
  12655. color: rgba(125, 130, 135, 1);
  12656. flex: 0 0 auto;
  12657. margin-left: 10px;
  12658. }
  12659. .wbbBoardList .wbbLastPost > .box32 > div > small > a, .wbbBoardList .wbbLastPost > .box32 > div > small > .wbbLastPostAuthor {
  12660. display: none;
  12661. }
  12662. .wbbBoardList .wbbLastPost > .box32 > div > small > .separatorLeft::before {
  12663. display: none;
  12664. }
  12665. }
  12666. @media (max-width: 768px) and (min-width: 769px) {
  12667. .wbbBoardList .wbbLastPost > .box32 > div > p > a {
  12668. font-size: 12px;
  12669. }
  12670. }
  12671. @media (max-width: 768px) and (max-width: 768px) {
  12672. .wbbBoardList .wbbLastPost > .box32 > div > p > a {
  12673. font-size: 12px;
  12674. }
  12675. }
  12676. .wbbBoardList .wbbDepth2.wbbBoardContainer > .wbbBoard > .icon {
  12677. margin-left: 68px;
  12678. }
  12679. .wbbBoardList .wbbDepth2.wbbCategory > header {
  12680. padding-left: 26px;
  12681. }
  12682. .wbbBoardList .wbbDepth3.wbbBoardContainer > .wbbBoard > .icon {
  12683. margin-left: 110px;
  12684. }
  12685. .wbbBoardList .wbbDepth3.wbbCategory > header {
  12686. padding-left: 68px;
  12687. }
  12688. .wbbBoardList .wbbCategory .wbbDepth2.wbbBoardContainer > .wbbBoard > .icon {
  12689. margin-left: 26px;
  12690. }
  12691. .wbbBoardList .wbbCategory .wbbDepth3.wbbBoardContainer > .wbbBoard > .icon {
  12692. margin-left: 68px;
  12693. }
  12694. @media (min-width: 769px) {
  12695. .wbbBoardList .wbbExternalLinkTarget {
  12696. display: none;
  12697. }
  12698. }
  12699. @media (max-width: 768px) {
  12700. .wbbBoardList .wbbExternalLinkTarget {
  12701. color: rgba(125, 130, 135, 1);
  12702. font-weight: 400;
  12703. overflow: hidden;
  12704. text-overflow: ellipsis;
  12705. white-space: nowrap;
  12706. }
  12707. }
  12708. @media (max-width: 768px) and (min-width: 769px) {
  12709. .wbbBoardList .wbbExternalLinkTarget {
  12710. font-size: 12px;
  12711. }
  12712. }
  12713. @media (max-width: 768px) and (max-width: 768px) {
  12714. .wbbBoardList .wbbExternalLinkTarget {
  12715. font-size: 12px;
  12716. }
  12717. }
  12718. @media (max-width: 768px) {
  12719. .wbbBoardList .wbbUsersOnline {
  12720. display: none;
  12721. }
  12722. }
  12723. .wbbBoardListReduced {
  12724. margin-top: 0;
  12725. }
  12726. .wbbBoardListReduced .wbbBoardContainer .wbbDepth2 > div {
  12727. padding-left: 20px;
  12728. }
  12729. .wbbBoardListReduced .wbbBoardContainer .wbbDepth3 > div {
  12730. padding-left: 40px;
  12731. }
  12732. .wbbBoardListReduced .wbbCategory .wbbDepth2 > div {
  12733. padding-left: 0;
  12734. }
  12735. .wbbBoardListReduced .wbbCategory .wbbDepth3 > div {
  12736. padding-left: 20px;
  12737. }
  12738. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  12739. border-radius: 50%;
  12740. position: absolute;
  12741. }
  12742. @media (min-width: 769px) {
  12743. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  12744. border: 1px solid rgba(250, 250, 250, 1);
  12745. box-sizing: content-box;
  12746. padding: 4px;
  12747. right: -8px;
  12748. top: -2px;
  12749. }
  12750. }
  12751. @media (max-width: 768px) {
  12752. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  12753. font-size: 18px;
  12754. height: 32px;
  12755. line-height: 32px;
  12756. top: 0;
  12757. width: 32px;
  12758. }
  12759. }
  12760. .wbbAnnouncementIcon {
  12761. background-color: rgba(204, 0, 1, 1);
  12762. color: rgba(255, 255, 255, 1);
  12763. }
  12764. .wbbStickyIcon, .wbbMovedIcon {
  12765. background-color: rgba(44, 62, 80, 1);
  12766. color: rgba(250, 250, 250, 1);
  12767. }
  12768. .wbbMovedIcon::before {
  12769. left: 1px;
  12770. position: relative;
  12771. }
  12772. @media (min-width: 1025px) {
  12773. .contentHeader.wbbThread > .contentHeaderIcon .wbbAnnouncementIcon, .contentHeader.wbbThread > .contentHeaderIcon .wbbStickyIcon {
  12774. right: -4px;
  12775. }
  12776. }
  12777. .wbbPost.wbbPostDeleted.messageCollapsedExpandable {
  12778. cursor: pointer;
  12779. }
  12780. .wbbPost.wbbPostDeleted.messageCollapsedExpandable .messageHeaderWrapper > *:first-child {
  12781. pointer-events: none;
  12782. position: relative;
  12783. }
  12784. .wbbPost.wbbPostDeleted.messageCollapsedExpandable .messageHeaderWrapper > *:first-child::before {
  12785. color: #b40000;
  12786. content: "";
  12787. display: block;
  12788. font-family: FontAwesome;
  12789. font-size: 42px;
  12790. left: 13px;
  12791. position: absolute;
  12792. top: -8px;
  12793. }
  12794. .wbbPost.wbbPostDeleted.messageCollapsedExpandable .messageHeaderWrapper > *:first-child > img {
  12795. visibility: hidden;
  12796. }
  12797. .wbbPostDeleteNote {
  12798. border-left-color: rgba(235, 204, 204, 1);
  12799. }
  12800. .wbbPostDisabledNote, .wbbPostDelayedNote {
  12801. border-left-color: rgba(208, 233, 198, 1);
  12802. }
  12803. .wbbMorePostsNotice > .info {
  12804. margin-top: 0;
  12805. }
  12806. .wbbInlineSimilarThreadList {
  12807. margin-top: 20px;
  12808. }
  12809. .wbbAdLocationIn1stPost {
  12810. float: left;
  12811. margin-bottom: 10px;
  12812. margin-right: 15px;
  12813. }
  12814. .wbbAdLocationPostList, .wbbAdLocationBoardList {
  12815. text-align: center;
  12816. }
  12817. .wbbAdLocationPostList > div, .wbbAdLocationBoardList > div {
  12818. display: inline-block;
  12819. text-align: left;
  12820. }
  12821. #postMergeContainer .sortableList {
  12822. list-style-type: none;
  12823. }
  12824. #postMergeContainer .sortableNode:not(:last-child) {
  12825. border-bottom-width: 0;
  12826. margin-bottom: 30px;
  12827. }
  12828. #shoutbox {
  12829. background-color: rgba(236, 241, 247, 1);
  12830. color: rgba(44, 62, 80, 1);
  12831. overflow: hidden;
  12832. padding: 10px;
  12833. position: relative;
  12834. }
  12835. #shoutbox .shoutboxContent {
  12836. overflow: auto;
  12837. }
  12838. #shoutbox > div {
  12839. border-top-left-radius: 0;
  12840. border-top-right-radius: 0;
  12841. }
  12842. #shoutbox > div > ul {
  12843. overflow: hidden;
  12844. }
  12845. #shoutbox > div > ul > li {
  12846. overflow: hidden;
  12847. padding: 0 2px 0 0;
  12848. transition-duration: 0.1s;
  12849. transition-property: background-color;
  12850. transition-timing-function: linear;
  12851. }
  12852. #shoutbox > div > ul > li:hover {
  12853. background-color: rgba(222, 230, 241, 1);
  12854. }
  12855. #shoutbox .shoutboxOptions {
  12856. bottom: 0;
  12857. position: absolute;
  12858. right: 0;
  12859. }
  12860. #shoutbox .shoutboxEntry {
  12861. position: relative;
  12862. }
  12863. #shoutbox .shoutboxEntry > .userAvatar {
  12864. float: left;
  12865. margin: 4px 6px 4px 4px;
  12866. }
  12867. #shoutbox .shoutboxEntry time, #shoutbox .shoutboxEntry .shoutboxOptions {
  12868. opacity: 0;
  12869. transition-duration: 0.1s;
  12870. transition-property: opacity;
  12871. transition-timing-function: linear;
  12872. }
  12873. #shoutbox .shoutboxEntry:hover time, #shoutbox .shoutboxEntry:hover .shoutboxOptions {
  12874. opacity: 1;
  12875. }
  12876. #shoutbox #shoutboxMessage {
  12877. margin-top: 10px;
  12878. padding: 10px;
  12879. width: 100%;
  12880. }
  12881. #shoutbox .shoutboxContent {
  12882. height: 200px;
  12883. }
  12884. #shoutbox .shoutboxContent.fadeOut::after {
  12885. content: "";
  12886. height: 40px;
  12887. left: 0;
  12888. position: absolute;
  12889. width: calc(100% - 27px);
  12890. }
  12891. #shoutbox .shoutboxContent.asc::after {
  12892. background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(236, 241, 247, 0) 0%, rgba(236, 241, 247, 1) 100%) repeat scroll 0 0;
  12893. top: calc(200px - 20px);
  12894. }
  12895. #shoutbox .shoutboxContent.desc::after {
  12896. background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(236, 241, 247, 1) 0%, rgba(236, 241, 247, 0) 100%) repeat scroll 0 0;
  12897. top: 5px;
  12898. }
  12899. #shoutbox.noForm .shoutboxContent.fadeOut::after {
  12900. bottom: 0;
  12901. }
  12902. #shoutbox.sidebar .shoutboxContent {
  12903. height: 250px;
  12904. }
  12905. #shoutbox.sidebar .shoutboxContent.asc::after {
  12906. top: calc(250px - 20px);
  12907. }
  12908. #shoutbox.sidebar #submitLink span {
  12909. display: none;
  12910. }
  12911. #shoutbox.sidebar #submitLink::after {
  12912. content: "";
  12913. font-family: FontAwesome;
  12914. }
  12915. #shoutbox #shoutboxEntryAddForm {
  12916. position: relative;
  12917. }
  12918. #shoutbox #shoutboxEntryAddForm .shoutboxExtend {
  12919. opacity: 0;
  12920. position: absolute;
  12921. right: 5px;
  12922. top: 2px;
  12923. transition-duration: 0.1s;
  12924. transition-property: opacity;
  12925. transition-timing-function: linear;
  12926. }
  12927. #shoutbox #shoutboxEntryAddForm .shoutboxExtend .shoutboxButton {
  12928. border-radius: 0;
  12929. height: 38px;
  12930. line-height: 38px;
  12931. margin: 10px -3px -3px;
  12932. padding: 0 13px;
  12933. }
  12934. #shoutbox #shoutboxEntryAddForm:hover .shoutboxExtend {
  12935. opacity: 1;
  12936. }
  12937. #shoutbox #smilies {
  12938. padding: 10px 5px 0;
  12939. }
  12940. .shoutboxBoxContent:hover header .shoutboxHeadlineOptions, .shoutboxBoard:hover header .shoutboxHeadlineOptions {
  12941. opacity: 1;
  12942. }
  12943. .shoutboxBoxContent header, .shoutboxBoard header {
  12944. position: relative;
  12945. }
  12946. .shoutboxBoxContent header .shoutboxHeadlineOptions, .shoutboxBoard header .shoutboxHeadlineOptions {
  12947. opacity: 0;
  12948. position: absolute;
  12949. right: 6px;
  12950. top: 8px;
  12951. transition-duration: 0.1s;
  12952. transition-property: opacity;
  12953. transition-timing-function: linear;
  12954. }
  12955. .shoutboxBoxContent header .shoutboxHeadlineOptions a, .shoutboxBoard header .shoutboxHeadlineOptions a {
  12956. display: inline-block;
  12957. margin-left: 3px;
  12958. }
  12959. @media only screen and (max-width: 800px) {
  12960. #shoutbox .shoutboxContent.desc::after, #shoutbox .shoutboxContent.asc::after {
  12961. display: none;
  12962. }
  12963. #shoutbox #shoutboxEntryAddForm .shoutboxExtend {
  12964. opacity: 1;
  12965. }
  12966. #submitLink span {
  12967. display: none;
  12968. }
  12969. #submitLink::after {
  12970. content: "";
  12971. font-family: FontAwesome;
  12972. }
  12973. }
  12974. @media (min-width: 1025px) {
  12975. .resizeExternalImages, .jsResizeImage {
  12976. max-height: 500px !important;
  12977. max-width: 500px !important;
  12978. }
  12979. }
  12980. @media (max-width: 1024px) {
  12981. .resizeExternalImages, .jsResizeImage {
  12982. max-height: 300px !important;
  12983. max-width: 300px !important;
  12984. }
  12985. }
  12986. @media (min-width: 1025px) {
  12987. .messageBody > .messageText > p > a.resizeAttachmentImages > img, .attachmentThumbnailList a.resizeAttachmentImages > div > .attachmentThumbnailImage {
  12988. max-height: 500px !important;
  12989. max-width: 500px !important;
  12990. }
  12991. }
  12992. @media (max-width: 1024px) {
  12993. .messageBody > .messageText > p > a.resizeAttachmentImages > img, .attachmentThumbnailList a.resizeAttachmentImages > div > .attachmentThumbnailImage {
  12994. max-height: 300px !important;
  12995. max-width: 300px !important;
  12996. }
  12997. }
  12998. @media (min-width: 1025px) {
  12999. .messageBody > .messageText > div:not(.galleryImageSeries) > a > img[src*="userImages"], .messageBody > .messageText > p > span.mediaBBCode img {
  13000. max-height: 500px !important;
  13001. max-width: 500px !important;
  13002. }
  13003. }
  13004. @media (max-width: 1024px) {
  13005. .messageBody > .messageText > div:not(.galleryImageSeries) > a > img[src*="userImages"], .messageBody > .messageText > p > span.mediaBBCode img {
  13006. max-height: 300px !important;
  13007. max-width: 300px !important;
  13008. }
  13009. }
  13010. .externalLinkMessage {
  13011. display: table;
  13012. height: 80px;
  13013. left: 50%;
  13014. margin-left: -250px;
  13015. position: absolute;
  13016. top: 50%;
  13017. width: 500px;
  13018. }
  13019. .externalLinkMessage > div {
  13020. display: table-cell;
  13021. text-align: center;
  13022. vertical-align: middle;
  13023. }
  13024. .externalLinkMessage .bold {
  13025. font-weight: bold;
  13026. }
  13027. .externalLinkMessage .button, .externalLinkMessage button:not([disabled]) {
  13028. text-shadow: none;
  13029. }
  13030. .externalLinkMessage .info::after, .externalLinkMessage .error::after, .externalLinkMessage .success::after, .externalLinkMessage .warning::after {
  13031. display: none;
  13032. }
  13033. .externalLinkMessage .success {
  13034. background-color: rgba(223, 240, 216, 1);
  13035. color: rgba(60, 118, 61, 1);
  13036. margin-right: 7px;
  13037. }
  13038. .externalLinkMessage .error {
  13039. background-color: rgba(242, 222, 222, 1);
  13040. color: rgba(169, 68, 66, 1);
  13041. }
  13042. body {
  13043. background: rgba(0, 0, 0, 0) url("../images/kriegergames/BG.jpg") repeat fixed 0 0 / 100% auto;
  13044. color: #fafafa;
  13045. }
  13046. a, .boxesSidebarLeft a, .boxesSidebarRight a, .boxesSidebarLeft small a, .boxesSidebarRight small a, .boxesSidebarLeft .dimmed a, .boxesSidebarRight .dimmed a, .boxesSidebarLeft .boxTitle a, .boxesSidebarRight .boxTitle a, .messageSidebar a, .messageFooterNote a, .messageTitle a {
  13047. color: #ef7c46;
  13048. }
  13049. a:hover, .boxesSidebarLeft a:hover, .boxesSidebarRight a:hover, .boxesSidebarLeft small a:hover, .boxesSidebarRight small a:hover, .boxesSidebarLeft .dimmed a:hover, .boxesSidebarRight .dimmed a:hover, .boxesSidebarLeft .boxTitle a:hover, .boxesSidebarRight .boxTitle a:hover, .interactiveDropdownShowAll:hover, .tabularListRowHead > .tabularListColumns > li.active > a, .tabularListRowHead > .tabularListColumns > li > a:hover, .breadcrumbs > ol > li > a:hover, .messageSidebar a:hover, .pageNavigation a:hover, .messageFooterNote a:hover, .messageTitle a:hover {
  13050. color: #af5c34;
  13051. }
  13052. .pageHeaderPanel {
  13053. background-color: #35414e;
  13054. border-bottom: 2px solid #ef7c46;
  13055. }
  13056. .pageNavigation {
  13057. background-color: #272f38;
  13058. border-bottom: 2px solid #ef7c46;
  13059. border-top: 2px solid #ef7c46;
  13060. }
  13061. .pageHeaderContainer {
  13062. background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  13063. }
  13064. .mainMenu .boxMenu > li > a, .userPanel > ul > li > a, .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover, .pageHeaderSearchInputContainer .pageHeaderSearchType.dropdownOpen > .button {
  13065. background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  13066. }
  13067. .mainMenu .boxMenu .boxMenuDepth1 {
  13068. background-color: #303944;
  13069. }
  13070. .mainMenu .boxMenu > li.active > a, .mainMenu .boxMenu > li.active > a:hover, .mainMenu .boxMenu > li > a:hover, .userPanel > ul > li > a:hover, .userPanel > ul > li.open > a, .userPanel > ul > li.open > a:hover, .mainMenu .boxMenu > li:hover > a, .interactiveDropdownHeader, .interactiveDropdownShowAll, .pageHeaderSearchInputContainer .pageHeaderSearchType > .button, .pageHeaderSearchInputContainer .pageHeaderSearchInput, .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
  13071. background-color: #303944;
  13072. }
  13073. .mainMenu .boxMenu > li > a {
  13074. font-family: "Oswald",sans-serif;
  13075. text-transform: uppercase;
  13076. }
  13077. .breadcrumbs > ol > li > a, .pageNavigation a, .contentHeader, .boxHeadline, .section .sectionTitle, .boxesSidebarLeft, .boxesSidebarRight, .boxesSidebarLeft .boxTitle, .boxesSidebarRight .boxTitle, dl.dataList > dt, .boxesSidebarLeft small, .boxesSidebarRight small, .boxesSidebarLeft .dimmed, .boxesSidebarRight .dimmed, .interactiveDropdownHeader, .interactiveDropdownShowAll, dl:not(.plain) > dt, .tabularListRowHead > .tabularListColumns > li > a, .tabularListRowHead > .tabularListColumns > li, .tabularListRowHead, .icon, .fa, .messageTitle {
  13078. color: #fafafa;
  13079. }
  13080. .badge.badgeUpdate, a.badge.badgeUpdate {
  13081. background-color: #ef7c46 !important;
  13082. }
  13083. .menuOverlayItemList {
  13084. background-color: #525f6f !important;
  13085. }
  13086. .menuOverlayTitle {
  13087. background-color: #ef7c46 !important;
  13088. }
  13089. .menuOverlayItemLink, .menuOverlayItemLinkIcon {
  13090. background-color: #303944 !important;
  13091. }
  13092. #content {
  13093. background-color: #272f38;
  13094. border: 1px solid #ef7c46;
  13095. padding: 15px;
  13096. }
  13097. .containerList > li:hover {
  13098. background-color: #272f38;
  13099. }
  13100. .containerList > li:first-child {
  13101. border-top: 1px solid #ef7c46;
  13102. }
  13103. .containerList > li:last-child {
  13104. border-bottom: 1px solid #ef7c46;
  13105. }
  13106. .dialogContainer, .dialogContainer > .dialogContent dl:not(.plain) > dt {
  13107. color: #525f6f;
  13108. }
  13109. .dialogContainer > header {
  13110. background-color: #272f38;
  13111. }
  13112. .htmlContent table tr:hover > td, .messageBody > .messageText table tr:hover > td, .messageSignature > div table tr:hover > td, .redactor-layer table tr:hover > td, .messageSignature > div table tr:hover > td .table tr:hover > td {
  13113. background-color: #272f38;
  13114. }
  13115. .htmlContent table tbody:first-child > tr:first-child > td, .messageBody > .messageText table tbody:first-child > tr:first-child > td, .messageSignature > div table tbody:first-child > tr:first-child > td, .redactor-layer table tbody:first-child > tr:first-child > td, .table tbody:first-child > tr:first-child > td {
  13116. background-color: #525f6f;
  13117. border-top: 1px solid #ef7c46;
  13118. }
  13119. .redactor-layer table tr:hover > td, .redactor-layer table tbody:first-child > tr:first-child > td {
  13120. background-color: #fcfcfc;
  13121. }
  13122. .htmlContent table, .messageBody > .messageText table, .messageSignature > div table, .redactor-layer table, .table {
  13123. border-bottom: 1px solid #ef7c46;
  13124. }
  13125. .codeBox {
  13126. background-color: #303944;
  13127. }
  13128. .boxesSidebarLeft .box:not(.boxBorderless), .boxesSidebarRight .box:not(.boxBorderless) {
  13129. background-color: #272f38;
  13130. border: 1px solid #ef7c46;
  13131. }
  13132. button.active, input.active[type="button"], input.active[type="reset"], input.active[type="submit"], .button.active, a.button.active, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, .button:hover, a.button:hover {
  13133. background-color: #525f6f !important;
  13134. }
  13135. button, input[type="button"], input[type="reset"], input[type="submit"], .button, a.button {
  13136. background-color: #303944 !important;
  13137. border: 1px solid #ef7c46;
  13138. color: #fafafa;
  13139. }
  13140. input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="url"]:focus, select:focus, textarea:focus, input[type="date"]:hover, input[type="datetime"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="text"]:hover, input[type="url"]:hover, select:hover, textarea:hover, .inputItemList:hover {
  13141. background-color: #525f6f !important;
  13142. border: 1px solid #ef7c46 !important;
  13143. color: #fafafa;
  13144. }
  13145. input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="text"], input[type="url"], select, textarea, .inputItemList {
  13146. background-color: #303944 !important;
  13147. color: #fafafa;
  13148. }
  13149. input[type="date"][disabled], input[type="datetime"][disabled], input[type="email"][disabled], input[type="number"][disabled], input[type="password"][disabled], input[type="search"][disabled], input[type="text"][disabled], input[type="url"][disabled], input[type="date"][readonly], input[type="datetime"][readonly], input[type="email"][readonly], input[type="number"][readonly], input[type="password"][readonly], input[type="search"][readonly], input[type="text"][readonly], input[type="url"][readonly], select[disabled], textarea[disabled] {
  13150. background-color: #424242 !important;
  13151. }
  13152. .wcfLikeCounter.likeCounterLiked {
  13153. color: #2cb700 !important;
  13154. }
  13155. .tabularBoxTitle > header a, .tabularBoxTitle > header .icon {
  13156. color: #fafafa;
  13157. text-transform: uppercase;
  13158. }
  13159. .tabularBoxTitle > header a:hover, .tabularBoxTitle > header .icon:hover, .wbbBoardList .wbbBoardDescription, .wbbBoardList .wbbCollapsibleCategory h2 + small, dl.statsDataList > dt {
  13160. color: #e2e2e2;
  13161. }
  13162. .tabularBoxTitle > header {
  13163. background-color: #ef7c46;
  13164. border-radius: 4px 4px 0 0;
  13165. color: #fafafa;
  13166. }
  13167. .tabularListRow.divider + li:not(.divider) {
  13168. border-top: 5px solid #ef7c46;
  13169. }
  13170. .wbbBoardList .wbbCollapsibleCategory h2 {
  13171. margin-left: 10px;
  13172. }
  13173. .wbbBoardList .wbbBoard:hover, .tabularListRow:hover:not(.tabularListRowHead) {
  13174. background-color: #525f6f;
  13175. }
  13176. .tabularList, .messageList:not(.messageReducedList) > li {
  13177. border-bottom: 1px solid #fafafa;
  13178. }
  13179. .messageList:not(.messageReducedList) {
  13180. border-top: 1px solid #fafafa;
  13181. }
  13182. .messageSidebar {
  13183. background-color: #303944;
  13184. color: #fafafa;
  13185. }
  13186. woltlab-quote, .quoteBox {
  13187. background-color: #303944;
  13188. }
  13189. .messageGroupList .tabularListColumns.new .columnSubject > h3 > .messageGroupLink::before, .messageGroupList tr.new .columnSubject > h3 > .messageGroupLink::before {
  13190. background-color: #ef7c46;
  13191. color: #fafafa;
  13192. content: "NEU";
  13193. font-size: 90%;
  13194. margin-right: 5px;
  13195. padding: 2px;
  13196. }
  13197. @media (min-width: 769px) {
  13198. .wbbBoardList .wbbLastPost {
  13199. background-color: #303944;
  13200. border-bottom: 1px solid #ef7c46;
  13201. border-radius: 4px;
  13202. padding: 6px;
  13203. }
  13204. .wbbBoardList .wbbBoardMain {
  13205. margin-left: 10px;
  13206. }
  13207. }
  13208. .fa-folder-open-o::before {
  13209. background-color: #303944;
  13210. color: #fafafa;
  13211. content: "";
  13212. padding: 0 4px 4px;
  13213. }
  13214. .wbbPost.wbbPostDeleted.messageCollapsedExpandable .messageHeaderWrapper > *:first-child::before {
  13215. color: #bb4a4a;
  13216. }
  13217. .redactor-toolbar, .messageTabMenuNavigation > ul, .messageTabMenu > .messageTabMenuContent.active {
  13218. background-color: #303944;
  13219. border: medium none;
  13220. }
  13221. .messageTabMenuNavigation > ul > li, .messageTabMenu:not(.messageTabMenuContent) > .messageTabMenuContent.active {
  13222. border: medium none;
  13223. }
  13224. .redactor-layer {
  13225. color: #525f6f;
  13226. }
  13227. .boxesFooterBoxes {
  13228. background-color: #ef7c46;
  13229. border-top: 1px solid #525f6f;
  13230. color: #fafafa;
  13231. }
  13232. .boxesFooterBoxes .boxTitle, .boxesFooterBoxes .boxTitle a, .boxesFooterBoxes .boxTitle a:hover {
  13233. color: #fafafa;
  13234. }
  13235. .boxesFooterBoxes .boxTitle a, .boxesFooterBoxes a {
  13236. color: #fcfcfc;
  13237. text-decoration: underline;
  13238. }
  13239. .boxesFooter {
  13240. background-color: #525f6f;
  13241. border-bottom: 1px solid #ef7c46;
  13242. border-top: 1px solid #ef7c46;
  13243. }
  13244. .pageFooterCopyright {
  13245. background-color: #303944;
  13246. border-bottom: 1px solid #ef7c46;
  13247. }
  13248. .samplifegameserver {
  13249. background-color: #303944;
  13250. border-bottom: 1px solid #ef7c46;
  13251. height: 30px;
  13252. line-height: 30px;
  13253. margin: 0 auto !important;
  13254. text-align: center;
  13255. }
  13256. .samplifegameserver-span {
  13257. background-color: #337ab7;
  13258. border-radius: 4px;
  13259. padding: 2px;
  13260. }
Add Comment
Please, Sign In to add comment