Advertisement
Amuli

Dark Version

Oct 17th, 2019
277
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 92.97 KB | None | 0 0
  1. /* =================================================================== */
  2. /* DESSENCE ============================================== RED EDITION */
  3. /* ERSTELLT UND UMGESETZT VON ================== SGTKANEKI | WBB-ELITE */
  4. /* =================================================================== */
  5.  
  6.  
  7.  
  8.  
  9. .boxesFooterBoxes .layoutBoundary {
  10. width: 100%;
  11. min-width: 100%;
  12. padding-bottom: 20px!important;
  13. padding-top: 0px;
  14. padding-left: 20px!important;
  15. padding-right: 20px!important;
  16. }
  17.  
  18.  
  19. /* =================================================================== */
  20. /* ============================== DESIGN ============================= */
  21. /* =================================================================== */
  22.  
  23. :root {
  24. --Hell1: rgba(255, 255, 255, 1);
  25. --Hell2: rgba(238, 238, 238, 1);
  26. --Hell3: rgba(221, 221, 221, 1);
  27. --Hell4: rgba(204, 204, 204, 1);
  28. --Hell5: rgba(229, 229, 229, 1);
  29. --Dunkel1: rgba(17, 17, 17, 1);
  30. --Dunkel2: rgba(45, 45, 45, 1);
  31. --Dunkel3: rgba(60, 60, 60, 1);
  32. --Dunkel4: rgba(34, 34, 34, 1);
  33. --Dunkel5: rgba(37, 37, 37, 1);
  34. --Farbe2: rgb(37, 37, 37);
  35. --Farbe3: rgba(143, 33, 33, 1);
  36.  
  37. }
  38.  
  39. .pageHeaderLogo .pageHeaderLogoLarge {
  40. background: rgba(0, 0, 0, 0) !important;
  41. }
  42.  
  43. .pageHeaderLogo {
  44. text-align: center;
  45. }
  46.  
  47. .pageHeaderLogo > a {
  48.  
  49. margin: auto;
  50. width: 256px;
  51. height: 256px;
  52.  
  53. }
  54.  
  55. /* =================================================================== */
  56. /* ============================ TESTBEREICH ========================== */
  57. /* =================================================================== */
  58.  
  59.  
  60.  
  61. /* =================================================================== */
  62. /* ============================ ALLGEMEINES ========================== */
  63. /* =================================================================== */
  64.  
  65. .boxFlag.box24 > span:first-child {
  66. display: inline !important;
  67. left: -10px;
  68. position: relative;
  69. top: -2px;
  70. }
  71.  
  72. .redactor-toolbar {
  73. background-color: var(--Farbe2) !important;
  74. }
  75.  
  76. .redactor-toolbar > li > a:hover, .redactor-toolbar > li > a.redactor-act, .redactor-toolbar > li > a.dropact {
  77. background-color: var(--Farbe1) !important;
  78. }
  79.  
  80. .layoutBoundary {
  81. padding: 0px 0px;
  82. width: 90%;
  83. }
  84.  
  85. *:hover {
  86. -webkit-transition: all 0.4s ease-in-out;
  87. -moz-transition: all 0.4s ease-in-out;
  88. -o-transition: all 0.4s ease-in-out;
  89. -ms-transition: all 0.4s ease-in-out;
  90. transition: all 0.4s ease-in-out;
  91. text-decoration: none !important;
  92. }
  93.  
  94. .button, a.button {
  95. font-size: 13px;
  96. text-transform: uppercase;
  97. font-weight: 700;
  98. }
  99.  
  100. .buttonGroup > li:last-child .button, .messageFooterButtons > li:last-child .button, .messageFooterButtonsExtra > li:last-child .button,
  101. .buttonGroup > li:first-child .button, .messageFooterButtons > li:first-child .button, .messageFooterButtonsExtra > li:first-child .button {
  102. border-radius: 0px !important;
  103. }
  104.  
  105. body {
  106. background-image: url('#{$style_image_path}bg.png');
  107. background-position: center center;
  108. background-repeat: repeat;
  109. background-color: #eee;
  110. }
  111.  
  112. .badge, a.badge {
  113. text-transform: uppercase;
  114. background-color: var(--Dunkel2);
  115. }
  116.  
  117. .flexibleButtonGroup > li > a.active.green, .flexibleButtonGroup > li > input[type="radio"]:checked + label.green, .flexibleButtonGroup > li > input[type="radio"] + label:hover.green {
  118. background-color: #2d2d2d;
  119. }
  120.  
  121. html body#tpl_wbb_boardList div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content div.section,
  122. html body#tpl_wbb_thread.mobileShowPaginationTop div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content div.section {
  123. border: none !important;
  124. background: transparent !important;
  125. padding: 0px !important;
  126. border-radius: 0px !important;
  127. }
  128.  
  129. .fa-money::before {
  130. content: "\f155";
  131. }
  132.  
  133. .userMention {
  134. background-color: #eee;
  135. border-radius: 0px;
  136. padding: 1px 5px;
  137. color: var(--Dunkel2) !important;
  138. }
  139.  
  140. .dialogContainer > .dialogContent .dialogFormSubmit {
  141. background-color: #eee;
  142. }
  143.  
  144. .dialogOverlay .dialogContainer .dialogContent.dialogForm ul.wbbBoardListReduced.wbbBoardList li.wbbCategory.tabularBox.tabularBoxTitle.wbbDepth1 header h2 {
  145. position: relative !important;
  146. }
  147.  
  148. .dialogOverlay .dialogContainer .dialogContent.dialogForm ul.wbbBoardListReduced.wbbBoardList li.wbbCategory.tabularBox.tabularBoxTitle.wbbDepth1 header
  149. h2::after {
  150. display: none;
  151. }
  152.  
  153. /* =================================================================== */
  154. /* ============================== HEADER ============================= */
  155. /* =================================================================== */
  156.  
  157. .pageHeaderContainer {
  158. height: 420px;
  159. background-image: url('https://imgur.com/mA7ApJX.png')!important;
  160. background-position-x: center;
  161. background-position-y: bottom;
  162. background-repeat: no-repeat;
  163. background-color: var(--Farbe2);
  164. box-shadow: inset 0px 0px 5px #000;
  165. }
  166.  
  167. /* =================================================================== */
  168. /* =============================== LOGO ============================== */
  169. /* =================================================================== */
  170.  
  171. .pageHeaderLogo {
  172. margin-top: 80px;
  173. }
  174.  
  175. .pageHeaderLogo > a {
  176. text-align: center;
  177. }
  178.  
  179. .pageHeaderLogo .pageHeaderLogoLarge {
  180. -webkit-transition: all 0.4s ease-in-out;
  181. -moz-transition: all 0.4s ease-in-out;
  182. -o-transition: all 0.4s ease-in-out;
  183. -ms-transition: all 0.4s ease-in-out;
  184. transition: all 0.4s ease-in-out;
  185. background: rgba(0, 0, 0, 0.2);
  186. }
  187.  
  188. .pageHeaderLogo .pageHeaderLogoLarge:hover {
  189. opacity: 0.6;
  190. }
  191.  
  192. /* =================================================================== */
  193. /* ============================= USERPANEL =========================== */
  194. /* =================================================================== */
  195.  
  196. .dropdownMenu {
  197. border-radius: 0px;
  198. font-size: 12px;
  199. }
  200.  
  201. #userPanelSearchButton {
  202. display: none;
  203. }
  204.  
  205. .pageHeaderSearch {
  206. display: block !important;
  207. right: 0px;
  208. top: 70px;
  209. z-index: 100;
  210. }
  211.  
  212. #userPanelSearchButton span {
  213. font-size: 0px;
  214. margin-left: 0px;
  215. }
  216.  
  217. .pageHeaderPanel {
  218. z-index: unset !important;
  219. }
  220.  
  221. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button {
  222. background: var(--Dunkel2);
  223. overflow: visible;
  224. }
  225.  
  226. .pageHeaderSearch {
  227. width: 500px;
  228. min-width: 500px;
  229. max-width: 500px;
  230. }
  231.  
  232. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover, .pageHeaderSearchInputContainer .pageHeaderSearchType.dropdownOpen > .button {
  233. background: var(--Dunkel2);
  234. }
  235.  
  236. .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
  237. background: var(--Farbe3);
  238. padding: 0px 15px;
  239. }
  240.  
  241. .pageHeaderSearchInputContainer .pageHeaderSearchInputButton:hover {
  242. background: var(--Farbe2);
  243. }
  244.  
  245. .pageHeaderSearchInputContainer .pageHeaderSearchInput {
  246. background-color: var(--Dunkel1);
  247. border-width: 0;
  248. color: var(--Hell1);
  249. padding-bottom: 10px;
  250. padding-top: 10px;
  251. width: 315px;
  252. height: 40px !important;
  253. box-shadow: none !important;
  254. }
  255.  
  256. .userPanel > ul > li:first-child > a {
  257. background: var(--Farbe3);
  258. }
  259.  
  260. .userPanel > ul > li:first-child > a:hover {
  261. background: var(--Farbe2);
  262. }
  263.  
  264. .userPanel > ul > li > a {
  265. background: var(--Dunkel2);
  266. }
  267.  
  268. .userPanel > ul > li > a:hover {
  269. background: var(--Dunkel3);
  270. }
  271.  
  272. .userPanel > ul > li.dropdownOpen > a, .userPanel > ul > li.open > a, .userPanel > ul > li:hover > a {
  273. background: var(--Dunkel3);
  274. }
  275.  
  276. .userPanel > ul > li, .userPanel > ul > li > a {
  277. overflow: visible;
  278. }
  279.  
  280. #userMenu a img.userAvatarImage {
  281. width: 32px !important;
  282. height: 32px !important;
  283. border-radius: 0% !important;
  284. position: relative;
  285. left: -5px;
  286. }
  287.  
  288. .userPanel {
  289. flex: 0 0 auto;
  290. position: absolute;
  291. width: 100%;
  292. margin: 0 auto;
  293. left: 0px;
  294. z-index: 100;
  295. top: 70px;
  296. height: 40px;
  297. background: rgba(0, 0, 0, 0.2);
  298. }
  299.  
  300. .pageHeaderPanel > .layoutBoundary {
  301. flex-direction: row-reverse;
  302. }
  303.  
  304. .userPanel > ul {
  305. display: flex;
  306. justify-content: flex-start;
  307. margin: 0 auto;
  308. position: absolute;
  309. width: 500px;
  310. max-width: 500px;
  311. background: var(--Dunkel2);
  312. }
  313.  
  314. .userPanel > ul > li > a {
  315. align-items: center;
  316. display: flex;
  317. flex: 0 0 auto;
  318. height: 40px;
  319. padding: 0 15px;
  320. z-index: 100;
  321. }
  322.  
  323. .userPanel > ul > li > a.loginLink {
  324. background: var(--Dunkel2) !important;
  325. text-transform: uppercase;
  326. font-weight: 700;
  327. }
  328.  
  329. #userMenu a {
  330. width: auto;
  331. }
  332.  
  333. .userPanel > ul > li > a .icon {
  334. font-size: 20px;
  335. width: 20px;
  336. line-height: 30px;
  337. }
  338.  
  339. .userPanel > ul > li:hover > a > span:not(.icon):not(.badge), .userPanel > ul > li.dropdownOpen > a > span:not(.icon):not(.badge), .userPanel > ul > li.open > a >
  340. span:not(.icon):not(.badge), .userPanel > ul > li:hover > a > span:not(.icon):not(.badge) {
  341. -webkit-transition: all 0.5s ease-in-out !important;
  342. -moz-transition: all 0.5s ease-in-out !important;
  343. -o-transition: all 0.5s ease-in-out !important;
  344. -ms-transition: all 0.5s ease-in-out !important;
  345. transition: all 0.5s ease-in-out !important;
  346. display: flex !important;
  347. color: #fff !important;
  348. font-size: 14px !important;
  349. margin-left: 5px;
  350. }
  351.  
  352. .userPanel > ul > li:first-child > a > span:not(.icon):not(.badge) {
  353. font-size: 14px !important;
  354. margin-left: 5px;
  355. }
  356.  
  357. .userPanel > ul > li > a > span:not(.icon):not(.badge) {
  358. -webkit-transition: all 0.5s ease-in-out !important;
  359. -moz-transition: all 0.5s ease-in-out !important;
  360. -o-transition: all 0.5s ease-in-out !important;
  361. -ms-transition: all 0.5s ease-in-out !important;
  362. transition: all 0.5s ease-in-out !important;
  363. display: flex !important;
  364. font-size: 0px;
  365. }
  366.  
  367. .userPanel > ul > li > a > .badgeUpdate {
  368. left: 5px;
  369. padding: 2px 6px;
  370. top: 1px;
  371. margin-left: 3px;
  372. margin-right: 0px;
  373. margin-top: -2px;
  374. font-size: 10px;
  375. text-align: left !important;
  376. position: relative;
  377. box-shadow: none;
  378. background-color: var(--Hell2);
  379. color: var(--Dunkel1);
  380. font-weight: 700;
  381. text-shadow: none;
  382. }
  383.  
  384. .interactiveDropdown {
  385. top: 110px !important;
  386. }
  387.  
  388. .interactiveDropdownHeader {
  389. align-items: center;
  390. background-color: var(--Farbe2);
  391. color: var(--Hell1);
  392. display: flex;
  393. padding: 5px 20px;
  394. }
  395.  
  396. .interactiveDropdownHeader .icon {
  397. color: var(--Hell1);
  398. }
  399.  
  400. .interactiveDropdownShowAll {
  401. background-color: var(--Dunkel1);
  402. color: var(--Hell1);
  403. padding: 5px 20px;
  404. }
  405.  
  406. .interactiveDropdown {
  407. position: absolute;
  408. }
  409.  
  410. .userPanel > ul::after {
  411. content: "";
  412. width: 0px;
  413. height: 0px;
  414. border-style: solid;
  415. border-width: 0 40px 48px 0px;
  416. border-color: transparent transparent var(--Dunkel2) transparent;
  417. top: -4px;
  418. position: absolute;
  419. -webkit-transform: rotate(90deg);
  420. -moz-transform: rotate(90deg);
  421. -o-transform: rotate(90deg);
  422. -ms-transform: rotate(90deg);
  423. transform: rotate(90deg);
  424. margin-left: calc(100% + 3px);
  425. }
  426.  
  427. .userPanel > ul > li:nth-last-child(2) > a::after {
  428. content: "";
  429. width: 0px;
  430. height: 0px;
  431. border-style: solid;
  432. border-width: 0 40px 48px 0px;
  433. border-color: transparent transparent var(--Dunkel2) transparent;
  434. top: -4px;
  435. position: absolute;
  436. -webkit-transform: rotate(90deg);
  437. -moz-transform: rotate(90deg);
  438. -o-transform: rotate(90deg);
  439. -ms-transform: rotate(90deg);
  440. transform: rotate(90deg);
  441. margin-left: calc(100% - 11px);
  442. }
  443.  
  444. .pageHeaderSearchInputContainer .pageHeaderSearchType > .button::before {
  445. content: "";
  446. width: 0px;
  447. height: 0px;
  448. border-style: solid;
  449. border-width: 0 50px 40px 0px;
  450. border-color: transparent transparent var(--Dunkel2) transparent;
  451. margin-left: -57px;
  452. top: 0px;
  453. position: absolute;
  454. -webkit-transform: rotate(180deg);
  455. -moz-transform: rotate(180deg);
  456. -o-transform: rotate(180deg);
  457. -ms-transform: rotate(180deg);
  458. transform: rotate(180deg);
  459. }
  460.  
  461. .interactiveDropdownItems > li > div > div > span {
  462. background: var(--Farbe2);
  463. }
  464.  
  465. .interactiveDropdownItems > li .icon {
  466. color: #fff;
  467. }
  468.  
  469. .interactiveDropdownItems > li {
  470. padding: 8px 20px;
  471. }
  472.  
  473. ul.userPanelItems li#jcoinsPanel a span.badge.badgeUpdate {
  474. display: none;
  475. }
  476.  
  477. .interactiveDropdown li.statement .amount > span {
  478. background: none !important;
  479. }
  480.  
  481. .interactiveDropdownItems > li a, .interactiveDropdownItems > li a > .icon {
  482. color: var(--Dunkel2) !important;
  483. }
  484.  
  485. /* =================================================================== */
  486. /* ============================= MAINMENU ============================ */
  487. /* =================================================================== */
  488.  
  489. .pageHeaderPanel, .pageHeaderSearch {
  490. position: absolute;
  491. }
  492.  
  493. .pageHeaderPanel {
  494. background-color: var(--Dunkel5);
  495. padding-top: 10px;
  496. padding-bottom: 10px;
  497. }
  498.  
  499. .mainMenu .boxMenu .boxMenuDepth1 {
  500. z-index: 401;
  501. margin-left: 5px;
  502. min-width: 150px;
  503. background: rgba(0,0,0,0.6);
  504. border-top: solid 5px var(--Farbe1);
  505. border-radius: 0px !important;
  506. }
  507.  
  508. .mainMenu .boxMenu {
  509. justify-content: center;
  510. }
  511.  
  512. .mainMenu > div > nav {
  513. margin: 0 auto;
  514. text-align: center;
  515. }
  516.  
  517. .mainMenu .boxMenu > li.active > a, .mainMenu .boxMenu > li.active:hover > a {
  518. background: var(--Farbe3);
  519. }
  520.  
  521. .mainMenu .boxMenu > li:hover > a {
  522. background: var(--Farbe2);
  523. }
  524.  
  525. .mainMenu .boxMenu > li > a {
  526. background: var(--Dunkel2);
  527. margin-left: 5px;
  528. margin-right: 5px;
  529. padding-top: 20px;
  530. padding-bottom: 20px;
  531. text-shadow: 0px 1px 1px var(--Dunkel1);
  532. font-weight: 600;
  533. text-transform: uppercase;
  534. width: 150px;
  535. min-width: 150px;
  536. max-width: 150px;
  537. }
  538.  
  539. .mainMenu .boxMenu > li > a > span {
  540. margin: 0 auto;
  541. }
  542.  
  543. .mainMenu .boxMenu > li > a .badge.badgeUpdate, .mainMenu .boxMenu > li > a.badge.badgeUpdate {
  544. background-color: var(--Hell2);
  545. color: var(--Dunkel1);
  546. font-weight: 700;
  547. text-shadow: none;
  548. margin-left: -10px !important;
  549. }
  550.  
  551. .mainMenu .boxMenu .boxMenuDepth1 > li.active > a, .mainMenu .boxMenu .boxMenuDepth1 > li > a:hover,
  552. .mainMenu .boxMenu .boxMenuDepth2 > li.active > a, .mainMenu .boxMenu .boxMenuDepth2 > li > a:hover,
  553. .mainMenu .boxMenu .boxMenuDepth3 > li.active > a, .mainMenu .boxMenu .boxMenuDepth3 > li > a:hover {
  554. background: var(--Farbe2);
  555. }
  556.  
  557. .mainMenu .boxMenu .boxMenuDepth1 > li > a, .mainMenu .boxMenu .boxMenuDepth1 > li > span,
  558. .mainMenu .boxMenu .boxMenuDepth2 > li > a, .mainMenu .boxMenu .boxMenuDepth2 > li > span,
  559. .mainMenu .boxMenu .boxMenuDepth3 > li > a, .mainMenu .boxMenu .boxMenuDepth3 > li > span {
  560. padding: 7px 0px !important;
  561. }
  562.  
  563. .mainMenu .boxMenu .boxMenuDepth1 > li > a,
  564. .mainMenu .boxMenu .boxMenuDepth2 > li > a,
  565. .mainMenu .boxMenu .boxMenuDepth3 > li > a {
  566. color: rgba(255, 255, 255, 1);
  567. font-size: 12px;
  568. text-align: center;
  569. }
  570.  
  571. .mainMenu .boxMenu > .boxMenuHasChildren > a::after {
  572. content: "\f107";
  573. display: block;
  574. font-family: 'FontAwesome';
  575. font-size: 14px;
  576. height: 16px;
  577. line-height: 16px;
  578. margin-left: -3px;
  579. width: 16px;
  580. background: var(--Dunkel4);
  581. }
  582.  
  583. .mainMenu .mainMenuShowPrevious {
  584. background: linear-gradient(to left, transparent 30%, #fff 0%);
  585. left: 0;
  586. }
  587.  
  588. .mainMenu .mainMenuShowPrevious > span, .mainMenu .mainMenuShowNext > span {
  589. color: #2d2d2d;
  590. }
  591.  
  592. .mainMenu .mainMenuShowNext {
  593. background: linear-gradient(to right, transparent 30%, #fff 0%);
  594. justify-content: flex-end;
  595. right: 0;
  596. }
  597.  
  598. /* =================================================================== */
  599. /* =============================== MAIN ============================== */
  600. /* =================================================================== */
  601.  
  602. .main {
  603. padding: 40px 0px;
  604. }
  605.  
  606. .main > .layoutBoundary {
  607. width: 100%;
  608. padding: 0px 5%;
  609. }
  610.  
  611. .pageNavigation {
  612. background-color: var(--Dunkel2);
  613. color: var(--Hell2);
  614. flex: 0 0 auto;
  615. padding: 10px 0;
  616. height: 40px;
  617. line-height: 20px;
  618. }
  619.  
  620. .pageNavigationIcons > li {
  621. margin-left: 0px;
  622. padding: 10px;
  623. margin-top: -10px;
  624. }
  625.  
  626. .pageNavigationIcons > li:not(:last-child) {
  627. margin-left: 0px;
  628. }
  629.  
  630. .pageNavigation > div {
  631. align-items: center;
  632. display: flex;
  633. justify-content: flex-end;
  634. min-height: 20px;
  635. width: 100%;
  636. }
  637.  
  638. .breadcrumbs > ol > li {
  639. font-size: 13px;
  640. padding: 10px;
  641. background: var(--Dunkel1);
  642. margin-top: -10px;
  643. }
  644.  
  645. .breadcrumbs > ol > li:not(:last-child) {
  646. margin-right: 0px;
  647. }
  648.  
  649. .breadcrumbs > ol > li > a, .pageNavigation .icon {
  650. color: var(--Hell2);
  651. }
  652.  
  653. .breadcrumbs > ol > li:hover > a, .pageNavigation .icon:hover {
  654. color: #fff;
  655. }
  656.  
  657. .breadcrumbs > ol > li:not(:last-child)::after {
  658. content: "++";
  659. color: var(--Farbe2);
  660. }
  661.  
  662. .breadcrumbs > ol > li > a:hover {
  663. color: #fff;
  664. text-decoration: none;
  665. }
  666.  
  667. .tabularBoxTitle > header {
  668. color: var(--Hell2);
  669. margin-top: 15px;
  670. border-radius: 0px;
  671. border-bottom: solid 2px var(--Farbe1);
  672. padding: 15px 0px;
  673. background: var(--Dunkel3);
  674. }
  675.  
  676. .tabularBoxTitle > header a, .tabularBoxTitle > header .icon,
  677. .tabularBoxTitle > header a:hover, .tabularBoxTitle > header .icon:hover {
  678. color: var(--Hell1);
  679. }
  680.  
  681. .wbbBoardList .wbbCollapsibleCategory h2 + small {
  682. color: var(--Hell2);
  683. margin-left: 0px !important;
  684. margin-top: 10px;
  685. background: var(--Dunkel2);
  686. padding: 5px 10px;
  687. margin-bottom: -15px;
  688. text-transform: uppercase;
  689. }
  690.  
  691. .wbbBoardList .wbbCollapsibleCategory h2, .tabularBoxTitle > header > h2 {
  692. align-items: center;
  693. display: flex;
  694. background: var(--Dunkel2);
  695. padding: 10px 30px 10px 10px;
  696. position: absolute;
  697. margin-top: -25px;
  698. height: 40px;
  699. }
  700.  
  701. .wbbBoardList .wbbCollapsibleCategory h2::after, .tabularBoxTitle > header > h2::after {
  702. content: "";
  703. width: 0px;
  704. height: 0px;
  705. border-style: solid;
  706. border-width: 0 50px 40px 0px;
  707. border-color: transparent transparent var(--Dunkel2) transparent;
  708. -webkit-transform: rotate(0deg);
  709. -moz-transform: rotate(0deg);
  710. -o-transform: rotate(0deg);
  711. -ms-transform: rotate(0deg);
  712. transform: rotate(0deg);
  713. position: absolute;
  714. top: 0px;
  715. margin-left: calc(100% - 10px);
  716. }
  717.  
  718. .wbbBoardList .wbbBoardContainer {
  719. border-bottom: solid 1px rgba(224, 224, 224, 1);
  720. background: var(--Hell2);
  721. border-top: 0px;
  722. border-left: solid 1px rgba(224, 224, 224, 1);
  723. border-right: solid 1px rgba(224, 224, 224, 1);
  724. box-shadow: inset 0px 1px 0px var(--Hell1);
  725. }
  726.  
  727. .section > .wbbBoardList > .wbbCategory:last-child > ul > li:last-child {
  728. border-bottom-width: 1px;
  729. }
  730.  
  731. .wbbBoardList .wbbBoardContainer > .wbbBoard > .icon {
  732. margin-left: 20px;
  733. width: 46px;
  734. padding-top: 5px;
  735. padding-bottom: 5px;
  736. background: var(--Farbe2);
  737. color: var(--Hell1);
  738. border-radius: 0px;
  739. }
  740.  
  741. .fa-folder-open-o::before, .fa-folder-o::before {
  742. content: "\f0e5";
  743. }
  744.  
  745. .fa-folder-open::before, .fa-folder::before {
  746. content: "\f075";
  747. }
  748.  
  749. .wbbBoardList .wbbLastPost > .box32 {
  750. border: solid 1px #ddd;
  751. background: #f7f7f7;
  752. border-radius: 0px;
  753. padding: 3px 0px 3px 10px;
  754. box-shadow: inset 0px 1px 0px #fff;
  755. }
  756.  
  757. .content > .section, .content > form, .sectionContainer {
  758. border: solid 1px #eee;
  759. background-color: #f7f7f7;
  760. padding: 20px;
  761. border-radius: 0px;
  762. }
  763.  
  764. .dialogContainer > header {
  765. padding: 12px 20px;
  766. background: var(--Dunkel2);
  767. border-radius: 0px;
  768. }
  769.  
  770. .section.sectionContainerList > .sectionHeader, .section.sectionContainerList > .sectionTitle {
  771. margin-bottom: 10px;
  772. color: var(--Dunkel2);
  773. border-bottom: solid 2px var(--Dunkel2);
  774. padding-bottom: 10px;
  775. }
  776.  
  777. .containerList > li:last-child {
  778. border-bottom: 0px;
  779. }
  780.  
  781. .tabularListRowHead {
  782. background: var(--Dunkel2);
  783. border-radius: 0px;
  784. padding: 8px 20px;
  785. border-bottom: solid 2px var(--Farbe1);
  786. }
  787.  
  788. .tabularListRowHead button.small {
  789. background: var(--Dunkel1);
  790. }
  791.  
  792. .section .sectionTitle, .tabularBoxTitle > header a, .tabularBoxTitle > header > h1, .tabularBoxTitle > header > h2, .tabularBoxTitle > header > h3 {
  793. color: var(--Hell1);
  794. font-size: 15px;
  795. text-transform: uppercase;
  796. font-weight: 700;
  797. }
  798.  
  799. .section:not(.sectionContainerList) > .sectionHeader > .sectionTitle {
  800. color: #2d2d2d !important;
  801. font-size: 15px;
  802. text-transform: uppercase;
  803. font-weight: 700;
  804. }
  805.  
  806. .tabularListRowHead > .tabularListColumns > li, .tabularListRowHead > .tabularListColumns > li .icon {
  807. color: #fff;
  808. }
  809.  
  810. .section.sectionContainerList > .sectionHeader {
  811. padding: 15px 20px;
  812. background: var(--Dunkel2);
  813. border-radius: 0px;
  814. margin-bottom: 0px !important;
  815. border-bottom: solid 2px var(--Farbe1);
  816. }
  817.  
  818. .containerList > li:first-child {
  819. border-top: 0px;
  820. }
  821.  
  822. .containerList > li {
  823. border-bottom: solid 1px rgba(224, 224, 224, 1);
  824. background: #f7f7f7;
  825. }
  826.  
  827. .containerList.recentActivityList > li .containerHeadline {
  828. position: relative;
  829. background: #f7f7f7;
  830. padding: 2px 15px;
  831. height: 48px;
  832. border: solid 1px #ddd;
  833. }
  834.  
  835. html body#tpl_wcf_cms div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content div.boxesContentBottom div.boxContainer div.box div.boxContent section#boxRecentActivity4.section.sectionContainerList.dashboardBoxRecentActivity ul.containerList.recentActivityList li div.box48 div div.containerHeadline {
  836. position: relative;
  837. background: #eee;
  838. padding: 2px 15px;
  839. height: 48px;
  840. border: solid 1px #ddd;
  841. }
  842.  
  843. .containerList > li .containerHeadline > .containerContentType {
  844. color: #999;
  845. position: absolute;
  846. top: 5px;
  847. right: 10px;
  848. background: #fff;
  849. padding: 2px 5px;
  850. border: solid 1px #ddd;
  851. border-radius: 0px;
  852. }
  853.  
  854. .userAvatarImage {
  855. border-radius: 0%;
  856. }
  857.  
  858. .containerList > li:hover {
  859. background-color: #f7f7f7;
  860. }
  861.  
  862. a.loginLink {
  863. background: var(--Dunkel2) !important;
  864. }
  865.  
  866. .dialogContainer > .dialogContent .section .sectionTitle {
  867. font-size: 15px;
  868. color: var(--Dunkel2);
  869. font-weight: 700;
  870. }
  871.  
  872. .section:not(.sectionContainerList) > .sectionHeader, .section:not(.sectionContainerList) > .sectionTitle {
  873. border-bottom: solid 2px var(--Dunkel2);
  874. padding-bottom: 5px;
  875. font-size: 15px;
  876. color: var(--Dunkel2);
  877. font-weight: 700;
  878. }
  879.  
  880. .content > .section .section + .section {
  881. margin-top: 40px;
  882. background: #f7f7f7;
  883. padding: 20px;
  884. }
  885.  
  886. .content > .section .tabMenuContent > .section:first-child, .content > .section .tabMenuContent > form > .section:first-child {
  887. background: #f7f7f7;
  888. padding: 20px;
  889. }
  890.  
  891. .containerListButtonGroup.likeTypeSelection, .containerList > li.showMore {
  892. background: var(--Hell5) !important;
  893. padding: 5px;
  894. }
  895.  
  896. .containerListButtonGroup.likeTypeSelection:hover, .containerList > li.showMore:hover {
  897. background: var(--Hell5) !important;
  898. }
  899.  
  900. .tabMenuContent > .containerList > li {
  901. background: var(--Hell2);
  902. border: solid 1px var(--Hell3);
  903. border-top-width: 0px !important;
  904. }
  905.  
  906. .tabMenuContent > .containerList > li:hover {
  907. background: var(--Hell2);
  908. border: solid 1px var(--Hell3);
  909. border-top-width: 0px !important;
  910. }
  911.  
  912. .tabMenuContent > .containerList > li:last-child {
  913. border-bottom: solid 1px var(--Hell3) !important;
  914. }
  915.  
  916. .commentListAddComment.collapsed {
  917. padding: 8px 20px;
  918. position: relative;
  919. max-width: 400px !important;
  920. min-width: 1px;
  921. background-color: var(--Hell3) !important;
  922. text-transform: uppercase;
  923. }
  924.  
  925. .commentList .commentResponseList > li:first-child, .commentList .commentResponseList > li:last-child {
  926. border-color: var(--Hell5);
  927. }
  928.  
  929. .commentList .commentResponseList > li:first-child, .commentList .commentResponseList > li:last-child {
  930. border-color: var(--Hell5);
  931. background: #f7f7f7;
  932. }
  933.  
  934. .commentOptionContainer > ul > li {
  935. background: var(--Farbe2);
  936. color: #fff !important;
  937. padding: 6px 12px;
  938. text-transform: uppercase;
  939. font-weight: 700;
  940. font-size: 12px;
  941. }
  942.  
  943. .commentOptionContainer > ul > li > a {
  944. color: var(--Hell1) !important;
  945. }
  946.  
  947. #about {
  948. padding: 20px;
  949. background: var(--Hell2);
  950. border: solid 1px var(--Hell3);
  951. }
  952.  
  953. .userProfilePreviewAvatar .badgeOnline, .userProfileUser .contentHeaderIcon .badgeOnline {
  954. padding: 0px !important;
  955. background: #4B8A08;
  956. width: 128px;
  957. }
  958.  
  959. .containerHeadline > h3 {
  960. font-weight: 600;
  961. }
  962.  
  963. .wbbBoardList .wbbSubBoards > li {
  964. align-items: center;
  965. background: var(--Farbe2);
  966. padding: 2px 8px;
  967. font-size: 12px;
  968. margin-bottom: 2px;
  969. }
  970.  
  971. .wbbBoardList .wbbSubBoards > li:hover {
  972. background: var(--Farbe3);
  973. }
  974.  
  975. .wbbBoardList .wbbSubBoards > li > div > a {
  976. color: var(--Hell1) !important;
  977. font-weight: 700;
  978. text-transform: uppercase;
  979. }
  980.  
  981. .wbbBoardList .wbbSubBoards > li > span {
  982. color: var(--Hell1);
  983. }
  984.  
  985. li.wbbBoardContainer > div > div > div > h3 > a {
  986. text-transform: uppercase;
  987. font-weight: 700;
  988. }
  989.  
  990. .wbbBoardList .wbbBoard:hover {
  991. background-color: rgba(242, 242, 242, 1);
  992. box-shadow: inset 0px 1px 0px var(--Hell1);
  993. }
  994.  
  995. .wbbBoardList > li.wbbBoardContainer:first-child {
  996. border-top: 1px solid rgba(224, 224, 224, 1) !important;
  997. }
  998.  
  999. .section > .wbbBoardList > .wbbBoardContainer:last-child {
  1000. border-bottom-width: 1px !important;
  1001. }
  1002.  
  1003. div.box16.wbbUsersOnline ul.inlineList.commaSeparated.small li a#wcf1.userLink {
  1004. font-weight: 700;
  1005. text-transform: uppercase;
  1006. margin-top: 5px;
  1007. }
  1008.  
  1009. .wbbBoardList .wbbBoard dl.statsDataList > dd:first-of-type::before {
  1010. content: "\f0e5";
  1011. font-family: Fontawesome;
  1012. margin-right: 8px;
  1013. font-size: 13px;
  1014. color: rgba(125, 130, 135, 1);
  1015. }
  1016.  
  1017. .wbbBoardList .wbbBoard dl.statsDataList:last-of-type > dd::before {
  1018. content: "\f040";
  1019. font-family: Fontawesome;
  1020. margin-right: 8px;
  1021. font-size: 13px;
  1022. color: rgba(125, 130, 135, 1);
  1023. }
  1024.  
  1025. .messageGroupListStatsSimple {
  1026. display: none;
  1027. }
  1028.  
  1029. .wbbBoardList .wbbStats > dl {
  1030. visibility: visible;
  1031. }
  1032.  
  1033. .wbbBoardList .wbbCollapsibleCategory.jsCollapsed h2 > .collapsibleButton::before {
  1034. content: "\f0fe";
  1035. color: #fff;
  1036. font-family: FontAwesome;
  1037. vertical-align: 1px;
  1038. }
  1039.  
  1040. .tabularBoxTitle > header .fa-chevron-down::before {
  1041. content: "\f146";
  1042. color: #fff;
  1043. font-family: FontAwesome;
  1044. }
  1045.  
  1046. /* =================================================================== */
  1047. /* ============================== BUTTONS ============================ */
  1048. /* =================================================================== */
  1049.  
  1050. .contentHeader .contentHeaderNavigation > ul .button .icon, .contentFooter > .contentFooterNavigation > ul .button .icon {
  1051. margin-left: -7px;
  1052. margin-right: 22px;
  1053. }
  1054.  
  1055. .contentHeader .contentHeaderNavigation > ul .button, .contentFooter .contentFooterNavigation > ul .button {
  1056. box-shadow: inset 36px 0px 0px var(--Farbe3);
  1057. border-radius: 0px;
  1058. font-size: 12px;
  1059. font-style: normal;
  1060. text-transform: uppercase;
  1061. font-weight: 700;
  1062. padding: 10px 17px;
  1063. background: var(--Dunkel2);
  1064. }
  1065.  
  1066. .contentHeader .contentHeaderNavigation > ul .button > span:not(.icon), .contentFooter .contentFooterNavigation > ul .button > span:not(.icon) {
  1067. display: inline;
  1068. }
  1069.  
  1070. .contentHeader .contentHeaderNavigation > ul .button.buttonPrimary, .contentFooter .contentFooterNavigation > ul .button.buttonPrimary {
  1071. background: var(--Farbe2);
  1072. box-shadow: inset 36px 0px 0px var(--Farbe3);
  1073. padding: 10px 17px;
  1074. }
  1075.  
  1076. .contentHeader .contentHeaderNavigation > ul .button:hover, .contentFooter .contentFooterNavigation > ul .button:hover {
  1077. background: var(--Dunkel3) !important;
  1078. }
  1079.  
  1080. .contentHeader .contentHeaderNavigation > ul .button.buttonPrimary:hover, .contentFooter .contentFooterNavigation > ul .button.buttonPrimary:hover {
  1081. background: var(--Farbe1) !important;
  1082. }
  1083.  
  1084. button, input[type="button"], input[type="reset"], input[type="submit"], .button, a.button {
  1085. border-radius: 0px;
  1086. font-size: 12px;
  1087. font-style: normal;
  1088. text-transform: uppercase;
  1089. font-weight: 700;
  1090. }
  1091.  
  1092. button.small, input[type="button"].small, input[type="reset"].small, input[type="submit"].small, .button.small, a.button.small {
  1093. padding: 8px 12px;
  1094. text-transform: uppercase;
  1095. font-weight: 400;
  1096. height: 36px;
  1097. }
  1098.  
  1099. .userProfileButtonContainer .button {
  1100. box-shadow: none !important;
  1101. padding: 5px 10px !important;
  1102. }
  1103.  
  1104. .userProfileButtonContainer .button .icon {
  1105. margin: 0px !important;
  1106. }
  1107.  
  1108. .boxesContentTop .boxTitle, .boxesContentBottom .boxTitle {
  1109. border-bottom: 0px;
  1110. font-weight: 700;
  1111. }
  1112.  
  1113. .containerList > li .buttonGroupNavigation > ul {
  1114. background-color: #fff;
  1115. border: solid 1px #ddd;
  1116. border-radius: 0px;
  1117. }
  1118.  
  1119. .containerList > li .buttonGroupNavigation > ul > li > a:hover {
  1120. background: var(--Farbe2);
  1121. }
  1122.  
  1123. .containerList > li .buttonGroupNavigation > ul > li:hover > a > .icon {
  1124. color: #fff;
  1125. }
  1126.  
  1127. .tabularListRow:not(.tabularListRowHead) {
  1128. border-top: solid 1px #ddd;
  1129. background: #eee;
  1130. }
  1131.  
  1132. .messageGroupList .tabularListRowHead .columnMark > label::before {
  1133. color: #fff;
  1134. }
  1135.  
  1136. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  1137. border: 0px;
  1138. box-sizing: content-box;
  1139. padding: 4px;
  1140. right: -5px;
  1141. top: -5px;
  1142. border-radius: 0px;
  1143. }
  1144.  
  1145. .messageGroupList .tabularList .tabularListRow:not(.tabularListRowHead) .columnStats > dl {
  1146. visibility: visible;
  1147. }
  1148.  
  1149. .commentListAddComment.collapsed::after, .commentListAddComment.collapsed::before {
  1150. color: var(--Farbe3);
  1151. }
  1152.  
  1153. .commentListAddComment.collapsed::before {
  1154. font-size: 22px;
  1155. }
  1156.  
  1157. .contentHeader .contentTitle, .boxHeadline .contentTitle, .contentHeader > h1, .boxHeadline > h1 {
  1158. color: var(--Dunkel2);
  1159. text-transform: uppercase;
  1160. font-weight: 700;
  1161. }
  1162.  
  1163. .tabularListRow.divider + li:not(.divider) {
  1164. border-top-color: var(--Farbe2);
  1165. border-top-width: 2px;
  1166. }
  1167.  
  1168. .tabularListRowHead > .tabularListColumns > li > a {
  1169. color: #fff;
  1170. }
  1171.  
  1172. /* =================================================================== */
  1173. /* ============================== SIDEBAR ============================ */
  1174. /* =================================================================== */
  1175.  
  1176. .boxesSidebarRight {
  1177. background: var(--Dunkel2);
  1178. margin-top: -40px;
  1179. margin-bottom: -40px;
  1180. right: -5%;
  1181. position: relative;
  1182. width: 310px;
  1183. overflow: visible;
  1184. box-shadow: 50px 0px 0px var(--Dunkel2);
  1185. padding: 10px 0px;
  1186. }
  1187.  
  1188. .boxesSidebarRight::before {
  1189. content: "";
  1190. width: 0px;
  1191. height: 0px;
  1192. border-style: solid;
  1193. border-width: 0 12px 10px 0px;
  1194. border-color: transparent transparent var(--Dunkel2) transparent;
  1195. margin-left: -10px;
  1196. top: 0px;
  1197. position: absolute;
  1198. -webkit-transform: rotate(180deg);
  1199. -moz-transform: rotate(180deg);
  1200. -o-transform: rotate(180deg);
  1201. -ms-transform: rotate(180deg);
  1202. transform: rotate(180deg);
  1203. }
  1204.  
  1205. .boxesSidebarLeft {
  1206. background: var(--Dunkel2);
  1207. margin-top: -40px;
  1208. margin-bottom: -40px;
  1209. left: -5%;
  1210. position: relative;
  1211. width: 310px;
  1212. overflow: visible;
  1213. box-shadow: -50px 0px 0px var(--Dunkel2);
  1214. padding: 10px 0px;
  1215. }
  1216.  
  1217. .boxesSidebarLeft::before {
  1218. content: "";
  1219. width: 0px;
  1220. height: 0px;
  1221. border-style: solid;
  1222. border-width: 0 10px 12px 0px;
  1223. border-color: transparent transparent var(--Dunkel2) transparent;
  1224. margin-left: 310px;
  1225. top: -2px;
  1226. position: absolute;
  1227. -webkit-transform: rotate(90deg);
  1228. -moz-transform: rotate(90deg);
  1229. -o-transform: rotate(90deg);
  1230. -ms-transform: rotate(90deg);
  1231. transform: rotate(90deg);
  1232. }
  1233.  
  1234. .boxesSidebarLeft .boxTitle, .boxesSidebarRight .boxTitle {
  1235. color: var(--Hell1);
  1236. text-transform: uppercase;
  1237. font-size: 14px;
  1238. font-weight: 700;
  1239. border-bottom: 0px;
  1240. background: var(--Dunkel4);
  1241. padding: 8px 10px;
  1242. }
  1243.  
  1244. .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink:hover, .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink:hover {
  1245. color: #fff;
  1246. }
  1247.  
  1248. .boxesSidebarRight .box:not(.boxBorderless) {
  1249. background-color: transparent;
  1250. border-radius: 0px;
  1251. padding-left: 20px;
  1252. padding-right: 10px;
  1253. }
  1254.  
  1255. .boxesSidebarLeft .box:not(.boxBorderless) {
  1256. background-color: transparent;
  1257. border-radius: 0px;
  1258. padding-left: 0px;
  1259. padding-right: 20px;
  1260. }
  1261.  
  1262. .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink {
  1263. border-left: solid 5px var(--Farbe1);
  1264. color: var(--Hell1);
  1265. background: transparent;
  1266. }
  1267.  
  1268. .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink {
  1269. border-left: solid 5px var(--Farbe1);
  1270. color: var(--Hell1);
  1271. background: transparent;
  1272. }
  1273.  
  1274. .sidebar .boxTitle .badge {
  1275. top: 0px;
  1276. padding: 2px 6px;
  1277. font-size: 10px;
  1278. text-align: left !important;
  1279. position: relative;
  1280. box-shadow: none;
  1281. background-color: var(--Hell2);
  1282. color: var(--Dunkel1);
  1283. font-weight: 700;
  1284. text-shadow: none;
  1285. }
  1286.  
  1287. .boxesSidebarLeft .box .boxMenu .boxMenuLink .badge, .boxesSidebarRight .box .boxMenu .boxMenuLink .badge {
  1288. flex: 0 0 auto;
  1289. background: var(--Hell1);
  1290. color: var(--Dunkel2);
  1291. }
  1292.  
  1293. .sidebar .button {
  1294. background: var(--Farbe2);
  1295. }
  1296.  
  1297. .sidebar .button:hover {
  1298. background: var(--Farbe1);
  1299. }
  1300.  
  1301. .boxesSidebarLeft .box.boxInfo, .boxesSidebarRight .box.boxInfo {
  1302. background-color: var(--Farbe3) !important;
  1303. color: #eee;
  1304. box-shadow: 10px 0px 0px var(--Farbe3);
  1305. }
  1306.  
  1307. .boxesSidebarLeft .box.boxInfo a:not(.button), .boxesSidebarRight .box.boxInfo a:not(.button) {
  1308. color: #fff;
  1309. }
  1310.  
  1311. .boxesSidebarLeft .box.boxError .boxTitle, .boxesSidebarRight .box.boxError .boxTitle, .boxesSidebarLeft .box.boxInfo .boxTitle, .boxesSidebarRight .box.boxInfo
  1312. .boxTitle, .boxesSidebarLeft .box.boxSuccess .boxTitle, .boxesSidebarRight .box.boxSuccess .boxTitle, .boxesSidebarLeft .box.boxWarning .boxTitle,
  1313. .boxesSidebarRight .box.boxWarning .boxTitle {
  1314. background: var(--Farbe2);
  1315. }
  1316.  
  1317. .sidebar .sidebarItemList > li:not(:last-child), .sidebar .sidebarBoxList > li:not(:last-child) {
  1318. margin-bottom: 10px;
  1319. border-bottom: solid 1px var(--Dunkel3);
  1320. padding-bottom: 10px;
  1321. }
  1322.  
  1323. .sidebar .boxContainer > div:not(.box), .sidebar .boxContainer > fieldset, .sidebar .boxContainer > section:not(.box) {
  1324. background-color: var(--Dunkel2);
  1325. }
  1326.  
  1327. /* =================================================================== */
  1328. /* ============================= MESSAGE ============================= */
  1329. /* =================================================================== */
  1330.  
  1331. .messageSidebar .badgeOnline {
  1332. bottom: 0;
  1333. border-radius: 0px;
  1334. height: 6px;
  1335. left: 6px;
  1336. bottom: 5px;
  1337. font-size: 0px !important;
  1338. width: 50px !important;
  1339. padding: 0px !important;
  1340. }
  1341.  
  1342. .messageSidebar .userAvatar > a {
  1343. display: inline-block;
  1344. border-style: solid;
  1345. border-color: var(--Hell1);
  1346. border-width: 6px 6px 16px 6px;
  1347. outline: solid 5px var(--Dunkel1);
  1348. margin-top: 5px;
  1349. }
  1350.  
  1351. .messageSidebar .badge {
  1352. width: 150px;
  1353. padding: 5px 0px;
  1354. font-weight: 600;
  1355. text-transform: uppercase;
  1356. border-radius: 0px;
  1357. }
  1358.  
  1359. .messageSidebar .userAvatar {
  1360. display: inline-block;
  1361. position: relative;
  1362. margin-bottom: 10px;
  1363. top: 25px;
  1364. }
  1365.  
  1366. .messageAuthorContainer {
  1367. position: relative;
  1368. top: -175px;
  1369. background: var(--Dunkel1);
  1370. padding: 4px 0px;
  1371. width: 150px;
  1372. margin: 0 auto;
  1373. }
  1374.  
  1375. .messageSidebar .username {
  1376. font-size: 15px;
  1377. font-style: normal;
  1378. font-weight: 400;
  1379. letter-spacing: 1px;
  1380. }
  1381.  
  1382. .messageSidebar {
  1383. background-color: var(--Dunkel2);
  1384. color: var(--Hell1);
  1385. position: relative;
  1386. min-height: 350px;
  1387. border: solid 1px #000;
  1388. border-radius: 0px;
  1389. align-self: stretch;
  1390. }
  1391.  
  1392. .messageSidebar a, .message dl.dataList > dt, .message dl.dataList > dd, .message dl.dataList > dl {
  1393. color: var(--Hell1);
  1394. }
  1395.  
  1396. .messageContent {
  1397. background: #f7f7f7;
  1398. padding: 20px;
  1399. border-radius: 0px;
  1400. border: solid 1px #ddd;
  1401. }
  1402.  
  1403. .messageFooterGroup > .likesSummary {
  1404. font-size: 12px;
  1405. background: rgba(217, 237, 247, 1);
  1406. border-left: solid 5px rgba(188, 223, 241, 1);
  1407. padding: 6px 10px 6px 10px;
  1408. width: calc(100% - 320px);
  1409. color: rgba(49, 112, 143, 1);
  1410. }
  1411.  
  1412. .messageSignature {
  1413. border: solid 1px #ddd;
  1414. margin-top: 50px;
  1415. opacity: 0.6;
  1416. padding: 10px;
  1417. transition: opacity 0.12s linear;
  1418. transform: translateZ(0);
  1419. background: #fff;
  1420. }
  1421.  
  1422. .messageSignatureEdit {
  1423. display: table;
  1424. content: "Signatur";
  1425. font-size: 14px;
  1426. font-style: normal;
  1427. text-transform: uppercase;
  1428. font-weight: 400;
  1429. letter-spacing: 1px;
  1430. text-align: center;
  1431. margin: 0 auto;
  1432. position: relative;
  1433. top: -26px;
  1434. background: #2d2d2d;
  1435. padding: 5px 10px 5px 10px;
  1436. color: #fff;
  1437. }
  1438.  
  1439. .messageHeader > .messageQuickOptions {
  1440. flex: 0 0 auto;
  1441. background: #2d2d2d;
  1442. padding: 6px 7px 6px 7px;
  1443. margin-right: -5px;
  1444. box-shadow: inset 0px 1px 0px #666;
  1445. border: solid 1px #000;
  1446. position: relative;
  1447. top: -1px;
  1448. height: 35px;
  1449. border-left-width: 0px;
  1450. right: -2px;
  1451. border-radius: 0px;
  1452. }
  1453.  
  1454. .messageHeaderMetaData > li {
  1455. background: #2d2d2d;
  1456. padding: 8px 15px 8px 15px;
  1457. margin-right: -5px;
  1458. box-shadow: inset 0px 1px 0px #666;
  1459. border: solid 1px #000;
  1460. border-left-width: 1px;
  1461. position: relative;
  1462. top: -1px;
  1463. height: 35px;
  1464. border-right-width: 0px;
  1465. left: -22px;
  1466. border-radius: 0px;
  1467. }
  1468.  
  1469. .messageHeaderMetaData .messagePublicationTime {
  1470. color: #fff;
  1471. }
  1472.  
  1473. .messageHeader {
  1474. flex: 0 0 auto;
  1475. padding: 0px 5px 0px 20px;
  1476. background: #f0f0f0;
  1477. border: solid 1px #ddd;
  1478. box-shadow: inset 0px 1px 0px #fff;
  1479. position: relative;
  1480. height: 35px;
  1481. width: calc(100% + 40px);
  1482. left: -20px;
  1483. top: -21px;
  1484. border-radius: 0px;
  1485. }
  1486.  
  1487. .message .messageClipboardCheckbox::before {
  1488. font-size: 22px;
  1489. left: 2px;
  1490. top: -5px;
  1491. color: #fff;
  1492. }
  1493.  
  1494. .message .messageClipboardCheckbox {
  1495. height: 21px;
  1496. width: 21px;
  1497. }
  1498.  
  1499. .messageQuickOptions > li > a {
  1500. color: #fff;
  1501. }
  1502.  
  1503. .messageSignature a.externalURL::after {
  1504. display: none;
  1505. }
  1506.  
  1507. .messageSignature {
  1508. opacity: 1;
  1509. }
  1510.  
  1511. .messageFooterNote {
  1512. font-size: 12px;
  1513. background: #eee;
  1514. border-left: solid 5px #ddd;
  1515. }
  1516.  
  1517. .message .userAvatarImage {
  1518. border-radius: 0%;
  1519. }
  1520.  
  1521. .message .wcfLikeCounter {
  1522. flex: 0 1 auto;
  1523. background: #ddd;
  1524. padding: 8px 10px 6px 10px;
  1525. box-shadow: inset 0px 1px 0px #f7f7f7;
  1526. border: solid 1px #bbb;
  1527. border-left-width: 0px;
  1528. position: absolute;
  1529. top: -1px;
  1530. height: 35px !important;
  1531. margin-left: -22px;
  1532. }
  1533.  
  1534. .wcfLikeCounter.likeCounterLiked, .wcfLikeCounter.likeCounterLiked .icon {
  1535. color: rgba(49, 112, 143, 1) !important;
  1536. }
  1537.  
  1538. .message .wcfLikeCounter.likeCounterLiked {
  1539. background: rgba(217, 237, 247, 1);
  1540. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
  1541. border: solid 1px rgba(188, 223, 241, 1);
  1542. border-left-width: 0px;
  1543. color: rgba(49, 112, 143, 1) !important;
  1544. }
  1545.  
  1546. .message .wcfLikeCounter.likeCounterDisliked {
  1547. background: #be4545;
  1548. box-shadow: inset 0px 1px 0px #e29494;
  1549. border: solid 1px #9b2626;
  1550. border-left-width: 0px;
  1551. }
  1552.  
  1553. .buttonGroup > li:not(:last-child), .messageFooterButtons > li:not(:last-child), .messageFooterButtonsExtra > li:not(:last-child) {
  1554. margin-right: 0px;
  1555. border-right: solid 1px var(--Dunkel1);
  1556. }
  1557.  
  1558. .badge, a.badge {
  1559. border-radius: 0px;
  1560. color: rgba(250, 250, 250, 1);
  1561. display: inline-block;
  1562. line-height: 1.28;
  1563. padding: 2px 6px;
  1564. position: relative;
  1565. vertical-align: middle;
  1566. white-space: nowrap;
  1567. word-wrap: normal;
  1568. font-weight: 400;
  1569. }
  1570.  
  1571. .messageTabMenuNavigation > ul {
  1572. background: var(--Dunkel1) !important;
  1573. border: none;
  1574. }
  1575.  
  1576. .messageTabMenuNavigation > ul > li > a {
  1577. font-weight: 400;
  1578. font-size: 12px;
  1579. padding: 10px 18px 10px;
  1580. }
  1581.  
  1582. .messageTabMenuNavigation > ul > li {
  1583. border-right: 0px !important;
  1584. }
  1585.  
  1586. .messageTabMenuNavigation > ul > li.active > a {
  1587. background: var(--Farbe2) !important;
  1588. color: #fff;
  1589. }
  1590.  
  1591. .messageTabMenuNavigation > ul > li > a {
  1592. color: #fff !important;
  1593. }
  1594.  
  1595. .messageTabMenuNavigation > ul > li:hover > a {
  1596. background-color: #2d2d2d;
  1597. }
  1598.  
  1599. .messageTabMenu:not(.messageTabMenuContent) > .messageTabMenuContent.active {
  1600. background-color: #eee;
  1601. border-color: #ddd !important;
  1602. }
  1603.  
  1604. .messageTabMenuNavigation > ul > li.active > a::after {
  1605. border-bottom: 0px !important;
  1606. }
  1607.  
  1608. .messageReduced .messageHeader, .messageCollapsed .messageHeader {
  1609. padding: 10px 20px;
  1610. background: var(--Dunkel2);
  1611. top: 0px !important;
  1612. box-shadow: none !important;
  1613. border: solid 1px var(--Dunkel1);
  1614. height: auto !important;
  1615. }
  1616.  
  1617. .messageReduced .messageHeader > .messageQuickOptions, .messageCollapsed .messageHeader > .messageQuickOptions {
  1618. display: none;
  1619. }
  1620.  
  1621. .messageReduced .messageHeader, .messageCollapsed .messageHeader, .messageReduced .messageHeader h2, .messageCollapsed .messageHeader h2 {
  1622. color: #fff;
  1623. }
  1624.  
  1625. .messageReduced .messageHeader a, .messageCollapsed .messageHeader a,
  1626. .wbbPost.wbbPostDeleted.messageCollapsedExpandable .messageHeaderWrapper > :first-child::before {
  1627. color: #eee !important;
  1628. }
  1629.  
  1630. .jsModificationLogEntryHideButton {
  1631. color: #fff !important;
  1632. }
  1633.  
  1634. .message.messageReduced > .messageContent, .message.messageCollapsed > .messageContent {
  1635. background: none;
  1636. border: none;
  1637. box-shadow: none;
  1638. }
  1639.  
  1640. .message.messageReduced > .messageContent > .messageHeader, .message.messageCollapsed > .messageContent > . messageHeader {
  1641. border: none;
  1642. box-shadow: none;
  1643. }
  1644.  
  1645. #messageQuickReply .messageSidebar {
  1646. display: none;
  1647. }
  1648.  
  1649. #messageQuickReply .messageSidebar + .messageContent {
  1650. background-image: none;
  1651. border-left: none;
  1652. padding: 14px;
  1653. flex-basis: calc(100% - 0px);
  1654. max-width: calc(100% - 0px);
  1655. margin-left: 0px;
  1656. }
  1657.  
  1658. /* =================================================================== */
  1659. /* =========================== USERPROFILE =========================== */
  1660. /* =================================================================== */
  1661.  
  1662. .tabMenu {
  1663. background-color: var(--Dunkel2);
  1664. color: #fff;
  1665. border-bottom: 2px solid var(--Farbe2);
  1666. }
  1667.  
  1668. .tabMenu > ul > li.active > a {
  1669. color: #fff;
  1670. background-color: var(--Farbe2);
  1671. }
  1672.  
  1673. .tabMenu > ul > li > a {
  1674. text-transform: uppercase;
  1675. font-size: 12px;
  1676. color: #fff;
  1677. padding: 10px 14px 8px 14px;
  1678. letter-spacing: 1px;
  1679. height: 35px;
  1680. font-weight: 700;
  1681. }
  1682.  
  1683. .tabMenu > ul > li::before, .menu > ul > li::before {
  1684. bottom: -1px;
  1685. }
  1686.  
  1687. .tabMenu > ul, .menu > ul {
  1688. border-bottom: 0px;
  1689. height: 34px;
  1690. }
  1691.  
  1692. .tabMenu > ul > li:not(:last-child), .menu > ul > li:not(:last-child) {
  1693. margin-right: 0px;
  1694. }
  1695.  
  1696. .tabMenu > ul > li > a:hover {
  1697. background: var(--Dunkel3);
  1698. }
  1699.  
  1700. .tabMenu .badge {
  1701. padding: 0px 6px;
  1702. top: -2px;
  1703. }
  1704.  
  1705. .tabMenu > ul > li.active > a:hover {
  1706. background: var(--Farbe2) !important;
  1707. }
  1708.  
  1709. .userProfileUser .userAvatarImage {
  1710. border: solid 5px var(--Dunkel2);
  1711. margin-top: 5px;
  1712. }
  1713.  
  1714. .commentListAddComment.collapsed {
  1715. background-color: rgba(236, 241, 247, 1);
  1716. cursor: pointer;
  1717. overflow: hidden;
  1718. padding: 8px 20px;
  1719. position: relative;
  1720. }
  1721.  
  1722. .userProfilePreviewAvatar .badgeOnline, .userProfileUser .contentHeaderIcon .badgeOnline {
  1723. left: 0;
  1724. pointer-events: none;
  1725. position: absolute;
  1726. text-transform: uppercase;
  1727. font-weight: 700;
  1728. letter-spacing: 1px;
  1729. border-radius: 0px !important;
  1730. text-align: center !important;
  1731. margin: 0 auto;
  1732. width: 128px;
  1733. padding: 5px;
  1734. }
  1735.  
  1736. .userProfileUserWithCoverPhoto .contentHeaderDescription {
  1737. margin-top: 10px !important;
  1738. }
  1739.  
  1740. .userProfileUserWithCoverPhoto .userProfileCoverPhoto {
  1741. border-radius: 0px;
  1742. }
  1743.  
  1744. /* =================================================================== */
  1745. /* ============================== FOOTER ============================= */
  1746. /* =================================================================== */
  1747.  
  1748. .jsButtonStyleChanger::before {
  1749. display: none;
  1750. }
  1751.  
  1752. .boxesFooter a::before {
  1753. content: "■";
  1754. position: relative;
  1755. top: -1px;
  1756. }
  1757.  
  1758. .boxesFooter {
  1759. background-color: var(--Dunkel2);
  1760. color: var(--Hell1);
  1761. padding: 14px 0;
  1762. height: 50px;
  1763. min-height: 50px;
  1764. max-height: 50px;
  1765. }
  1766.  
  1767. .boxesFooter a {
  1768. color: #eee;
  1769. text-transform: uppercase;
  1770. font-weight: 700;
  1771. font-size: 13px;
  1772. }
  1773.  
  1774. .boxesFooter a:hover {
  1775. color: #fff;
  1776. }
  1777.  
  1778. .boxesFooterBoxes {
  1779. background: var(--Hell5);
  1780. border-top: solid 1px #ddd;
  1781. box-shadow: inset 0px 1px 0px #fff;
  1782. }
  1783.  
  1784. .boxesFooterBoxes .boxTitle, .boxesFooterBoxes .boxTitle a {
  1785. font-weight: 700;
  1786. }
  1787.  
  1788. .boxesFooterBoxes .box {
  1789. border: solid 1px #e5e5e5;
  1790. background: #f7f7f7;
  1791. border-radius: 0px;
  1792. flex: 0 0 48%;
  1793. margin: 0 1% 50px;
  1794. max-width: 48%;
  1795. padding: 30px 20px;
  1796. -webkit-transition: all 0.4s ease-in-out;
  1797. -moz-transition: all 0.4s ease-in-out;
  1798. -o-transition: all 0.4s ease-in-out;
  1799. -ms-transition: all 0.4s ease-in-out;
  1800. transition: all 0.4s ease-in-out;
  1801. }
  1802.  
  1803. .boxesFooterBoxes .box.boxFullWidth {
  1804. flex-basis: 98%;
  1805. max-width: 98%;
  1806. border: solid 1px #e5e5e5;
  1807. background: #f7f7f7;
  1808. }
  1809.  
  1810. .boxTitle {
  1811. font-size: 15px;
  1812. text-transform: uppercase;
  1813. border-bottom: solid 2px var(--Dunkel2);
  1814. color: var(--Dunkel2);
  1815. }
  1816.  
  1817. .pageFooterCopyright .layoutBoundary {
  1818. padding: 0px 20px;
  1819. width: 90% !important;
  1820. }
  1821.  
  1822. .copyright:nth-child(4) {
  1823. background: transparent !important;
  1824. margin-top: 0px !important;
  1825. }
  1826.  
  1827. .copyright {
  1828. width: 600px;
  1829. padding: 10px 0px;
  1830. height: 40px;
  1831. background-image: url('#{$style_image_path}copyright_left.png');
  1832. background-position-x: right;
  1833. background-position-y: center;
  1834. margin-top: -20px;
  1835. text-align: center;
  1836. }
  1837.  
  1838. .pageFooterCopyright > .layoutBoundary > div:nth-child(2), .pageFooterCopyright > .layoutBoundary > div:nth-child(3),
  1839. .pageFooterCopyright > .layoutBoundary > div:nth-child(5), .pageFooterCopyright > .layoutBoundary > div:nth-child(6) {
  1840. margin-top: -40px !important;
  1841. background: #333;
  1842. margin: 0 auto;
  1843. }
  1844.  
  1845. .copyright:nth-child(2), .copyright:nth-child(5) {
  1846. width: 600px;
  1847. padding: 10px 0px;
  1848. height: 40px;
  1849. background-image: url('#{$style_image_path}copyright_right.png') !important;
  1850. background-color: transparent !important;
  1851. background-position-x: left;
  1852. background-position-y: center;
  1853. margin-top: -20px !important;
  1854. text-align: center;
  1855. float: right;
  1856. }
  1857.  
  1858. .boxesFooter {
  1859. overflow: visible;
  1860. }
  1861.  
  1862. .boxesFooter::before {
  1863. background-image: url('#{$style_image_path}footer_left.png');
  1864. content: "";
  1865. position: absolute;
  1866. width: 10%;
  1867. height: 130px;
  1868. margin-top: -54px;
  1869. background-position-x: right;
  1870. background-position-y: center;
  1871. left: 0%;
  1872. z-index: 100;
  1873. }
  1874.  
  1875. .boxesFooter::after {
  1876. background-image: url('#{$style_image_path}footer_right.png');
  1877. content: "";
  1878. position: absolute;
  1879. width: 10%;
  1880. height: 130px;
  1881. margin-top: -76px;
  1882. background-position-x: left;
  1883. background-position-y: center;
  1884. left: 90%;
  1885. z-index: 100;
  1886. }
  1887.  
  1888. .pageFooterCopyright {
  1889. background-color: var(--Dunkel4);
  1890. min-height: 80px;
  1891. }
  1892.  
  1893. .pageAction > li.toTop > a {
  1894. padding: 0px;
  1895. width: 100px;
  1896. text-align: center;
  1897. background-color: transparent !important;
  1898. }
  1899.  
  1900. .pageAction .toTop {
  1901. left: 50%;
  1902. bottom: -28px;
  1903. position: fixed;
  1904. margin-left: -30px;
  1905. width: 60px;
  1906. background-color: var(--Farbe2);
  1907. box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.4);
  1908. height: 60px;
  1909. border-radius: 0px;
  1910. }
  1911.  
  1912. .pageAction > li.toTop > a .fa-angle-up::before {
  1913. content: "\f102";
  1914. font-size: 22px;
  1915. }
  1916.  
  1917. .boxesFooterBoxes .layoutBoundary {
  1918. width: 100%;
  1919. min-width: 100%;
  1920. padding-bottom: 10px;
  1921. padding-top: 0px;
  1922. padding-left: 20px;
  1923. padding-right: 20px;
  1924. }
  1925.  
  1926. .boxesFooter .layoutBoundary {
  1927. width: 80%;
  1928. min-width: 80%;
  1929. max-width: 80%;
  1930. margin: 0 auto;
  1931. }
  1932.  
  1933. .boxesFooterBoxes .boxContainer {
  1934. padding: 30px 0px;
  1935. }
  1936.  
  1937. .boxesFooterBoxes .boxContainer {
  1938. margin-left: -20px;
  1939. margin-right: -20px;
  1940. }
  1941.  
  1942. /* =================================================================== */
  1943. /* ========================= ADDITIONAL FOOTER ======================= */
  1944. /* =================================================================== */
  1945.  
  1946. .addfooter a, .addfooter p {
  1947. color: #fff;
  1948. font-size: 13px;
  1949. }
  1950.  
  1951. .addfooter a:hover {
  1952. color: #eee;
  1953. }
  1954.  
  1955. .addfooter {
  1956. display: inline-block;
  1957. padding: 0px 0px 0px 20px;
  1958. width: 100%;
  1959. background: var(--Farbe2);
  1960. height: 237px;
  1961. }
  1962.  
  1963. .addfooter_title {
  1964. text-align: center;
  1965. text-transform: uppercase;
  1966. padding: 5px 0px;
  1967. background: #2D2D2D;
  1968. color: #fff;
  1969. margin: 0px 0px 0px -20px;
  1970. }
  1971.  
  1972. .addfooter_title > h2 {
  1973. font-weight: 700;
  1974. }
  1975.  
  1976. .addfooter_boxcenter, .addfooter_boxright {
  1977. float: left;
  1978. width: 24%;
  1979. margin-left: 0.5%;
  1980. margin-right: 0.5%;
  1981. min-height: 195px;
  1982. height: 195px;
  1983. max-height: 195px;
  1984. overflow: hidden;
  1985. padding-top: 20px;
  1986. }
  1987.  
  1988. .addfooter_boxleft {
  1989. float: left;
  1990. width: 24%;
  1991. margin-right: 0.5%;
  1992. min-height: 195px;
  1993. height: 195px;
  1994. max-height: 195px;
  1995. overflow: hidden;
  1996. padding-top: 20px;
  1997. }
  1998.  
  1999. .addfooter_boxinfo {
  2000. float: left;
  2001. width: 25%;
  2002. margin-left: 0.5%;
  2003. min-height: 205px;
  2004. height: 205px;
  2005. max-height: 205px;
  2006. overflow: hidden;
  2007. background: var(--Farbe1);
  2008. padding: 20px 20px;
  2009. }
  2010.  
  2011. .addfooter_boxleft > h1, .addfooter_boxcenter > h1, .addfooter_boxright > h1 {
  2012. font-weight: 700;
  2013. font-size: 14px;
  2014. text-transform: uppercase;
  2015. padding: 4px 10px;
  2016. background: var(--Farbe1);
  2017. color: #fff;
  2018. margin-bottom: 10px;
  2019. }
  2020.  
  2021. .addfooter_boxinfo > h1 {
  2022. font-weight: 700;
  2023. font-size: 14px;
  2024. text-transform: uppercase;
  2025. padding: 4px 10px;
  2026. background: var(--Farbe2);
  2027. color: #fff;
  2028. margin-bottom: 10px;
  2029. }
  2030.  
  2031. .addfooter_boxright > p {
  2032. min-height: 42px;
  2033. height: 42px;
  2034. max-height: 42px;
  2035. overflow: hidden;
  2036. }
  2037.  
  2038. .addfooter_boxsocial {
  2039. height: 90px;
  2040. display: flex;
  2041. flex-wrap: wrap-reverse;
  2042. justify-content: space-between;
  2043. }
  2044.  
  2045. .addfooter_boxright, .addfooter_boxinfo {
  2046. text-align: justify;
  2047. }
  2048.  
  2049. .addfooter_boxsocial > a {
  2050. display: flex;
  2051. color: #fff;
  2052. height: 44px;
  2053. width: 44px;
  2054. padding-bottom: 3px;
  2055. margin-top: 5px;
  2056. margin-left: 3px;
  2057. margin-right: 3px;
  2058. text-align: center;
  2059. background: var(--Farbe1);
  2060. }
  2061.  
  2062. .addfooter_boxsocial > a:hover {
  2063. background: var(--Farbe3);
  2064. }
  2065.  
  2066. .addfooter_boxsocial > a::before {
  2067. font-family: FontAwesome;
  2068. position: absolute;
  2069. font-size: 30px;
  2070. font-weight: normal;
  2071. z-index: 1;
  2072. text-align: center;
  2073. height: 44px;
  2074. width: 44px;
  2075. }
  2076.  
  2077. .addfooter_facebook::before {
  2078. content: "\f09a" !important;
  2079. }
  2080.  
  2081. .addfooter_twitter::before {
  2082. content: "\f099" !important;
  2083. }
  2084.  
  2085. .addfooter_google::before {
  2086. content: "\f1a0" !important;
  2087. }
  2088.  
  2089. .addfooter_youtube::before {
  2090. content: "\f16a" !important;
  2091. }
  2092.  
  2093. .addfooter_steam::before {
  2094. content: "\f1b6" !important;
  2095. }
  2096.  
  2097. .addfooter_twitch::before {
  2098. content: "\f1e8" !important;
  2099. }
  2100.  
  2101. .addfooter_instagram::before {
  2102. content: "\f16d" !important;
  2103. }
  2104.  
  2105. .addfooter_reddit::before {
  2106. content: "\f1a1" !important;
  2107. }
  2108.  
  2109. .addfooter_boxleft a::before, .addfooter_boxcenter a::before {
  2110. display: inline-block;
  2111. height: 4px;
  2112. width: 4px;
  2113. background: #fff;
  2114. content: "";
  2115. margin-right: 5px;
  2116. top: -3px;
  2117. position: relative;
  2118. }
  2119.  
  2120. /* =================================================================== */
  2121. /* ======================== ADDITIONAL PARTNER ======================= */
  2122. /* =================================================================== */
  2123.  
  2124. .additional_partner {
  2125. width: calc(80% + 100px);
  2126. padding: 2px 50px;
  2127. background: var(--Farbe3);
  2128. display: flex;
  2129. justify-content: space-between;
  2130. margin: 0 auto;
  2131. }
  2132.  
  2133. .additional_partner1 {
  2134. background-image: url('#{$style_image_path}partner1.png');
  2135. background-position: center center;
  2136. background-repeat: no-repeat;
  2137. background-size: contain;
  2138. width: 115px;
  2139. height: 36px;
  2140. }
  2141.  
  2142. .additional_partner2 {
  2143. background-image: url('#{$style_image_path}partner2.png');
  2144. background-position: center center;
  2145. background-repeat: no-repeat;
  2146. background-size: contain;
  2147. width: 115px;
  2148. height: 36px;
  2149. }
  2150.  
  2151. .additional_partner3 {
  2152. background-image: url('#{$style_image_path}partner3.png');
  2153. background-position: center center;
  2154. background-repeat: no-repeat;
  2155. background-size: contain;
  2156. width: 115px;
  2157. height: 36px;
  2158. }
  2159.  
  2160. .additional_partner4 {
  2161. background-image: url('#{$style_image_path}partner4.png');
  2162. background-position: center center;
  2163. background-repeat: no-repeat;
  2164. background-size: contain;
  2165. background-color: var(--Dunkel4);
  2166. width: 115px;
  2167. height: 40px;
  2168. margin-top: -2px;
  2169. margin-bottom: -4px;
  2170. }
  2171.  
  2172. .additional_partner5 {
  2173. background-image: url('#{$style_image_path}partner5.png');
  2174. background-position: center center;
  2175. background-repeat: no-repeat;
  2176. background-size: contain;
  2177. width: 115px;
  2178. height: 36px;
  2179. }
  2180.  
  2181. .additional_partner6 {
  2182. background-image: url('#{$style_image_path}partner6.png');
  2183. background-position: center center;
  2184. background-repeat: no-repeat;
  2185. background-size: contain;
  2186. width: 115px;
  2187. height: 36px;
  2188. }
  2189.  
  2190. .additional_partner7 {
  2191. background-image: url('#{$style_image_path}partner7.png');
  2192. background-position: center center;
  2193. background-repeat: no-repeat;
  2194. background-size: contain;
  2195. width: 115px;
  2196. height: 36px;
  2197. }
  2198.  
  2199. .additional_partner4::before {
  2200. content: "";
  2201. width: 0px;
  2202. height: 0px;
  2203. border-style: solid;
  2204. border-width: 0 40px 40px 0px;
  2205. border-color: transparent transparent var(--Dunkel4) transparent;
  2206. position: absolute;
  2207. -webkit-transform: rotate(270deg);
  2208. -moz-transform: rotate(270deg);
  2209. -o-transform: rotate(270deg);
  2210. -ms-transform: rotate(270deg);
  2211. transform: rotate(270deg);
  2212. margin-left: -40px;
  2213. }
  2214.  
  2215. .additional_partner4::after {
  2216. content: "";
  2217. width: 0px;
  2218. height: 0px;
  2219. border-style: solid;
  2220. border-width: 0 40px 40px 0px;
  2221. border-color: transparent transparent var(--Dunkel4) transparent;
  2222. margin-left: 115px;
  2223. position: absolute;
  2224. -webkit-transform: rotate(0deg);
  2225. -moz-transform: rotate(0deg);
  2226. -o-transform: rotate(0deg);
  2227. -ms-transform: rotate(0deg);
  2228. transform: rotate(0deg);
  2229. }
  2230.  
  2231. .additional_partner1:hover, .additional_partner2:hover, .additional_partner3:hover,
  2232. .additional_partner5:hover, .additional_partner6:hover, .additional_partner7:hover {
  2233. opacity: 0.8;
  2234. }
  2235.  
  2236. /* =================================================================== */
  2237. /* =========================== KLEINIGKEITEN ========================= */
  2238. /* =================================================================== */
  2239.  
  2240. .messageHeaderWrapper > div > .messageHeaderMetaData > li {
  2241. border: 0 !important;
  2242. box-shadow: none !important;
  2243. padding: 0px !important;
  2244. top: 0px;
  2245. left: 0px;
  2246. right: 0px;
  2247. height: auto !important;
  2248. }
  2249.  
  2250. html body#tpl_blog_blogEntryList div.messageContent header.messageHeader ul.messageQuickOptions,
  2251. html body#tpl_blog_entryList div.messageContent header.messageHeader ul.messageQuickOptions {
  2252. display: none;
  2253. }
  2254.  
  2255. .blogEntryReadMoreButton {
  2256. padding: 5px 10px;
  2257. background: var(--Farbe2);
  2258. color: #fff;
  2259. position: absolute;
  2260. margin-top: 20px;
  2261. }
  2262.  
  2263. .blogEntryReadMoreButton:hover {
  2264. color: #eee;
  2265. background: var(--Farbe1);
  2266. }
  2267.  
  2268. .calendarMonthView .calendarWeeks .calendarWeekDays > li.calendarToday {
  2269. background-color: #ddd;
  2270. color: #2d2d2d;
  2271. }
  2272.  
  2273. html body#tpl_calendar_weekly div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2274. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button {
  2275. box-shadow: none !important;
  2276. }
  2277.  
  2278. html body#tpl_calendar_weekly div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2279. nav.contentHeaderNavigation ul li ul.buttonGroup li:not(:nth-child(2)) a.button span:not(.icon) {
  2280. display: none;
  2281. }
  2282.  
  2283. html body#tpl_calendar_weekly div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2284. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button span.icon {
  2285. margin-left: 0px;
  2286. margin-right: 0px;
  2287. }
  2288.  
  2289. html body#tpl_calendar_calendar div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2290. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button {
  2291. box-shadow: none !important;
  2292. }
  2293.  
  2294. html body#tpl_calendar_calendar div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2295. nav.contentHeaderNavigation ul li ul.buttonGroup li:not(:nth-child(2)) a.button span:not(.icon) {
  2296. display: none;
  2297. }
  2298.  
  2299. html body#tpl_calendar_calendar div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2300. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button span.icon {
  2301. margin-left: 0px;
  2302. margin-right: 0px;
  2303. }
  2304.  
  2305. html body#tpl_calendar_daily div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2306. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button {
  2307. box-shadow: none !important;
  2308. }
  2309.  
  2310. html body#tpl_calendar_daily div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2311. nav.contentHeaderNavigation ul li ul.buttonGroup li:not(:nth-child(2)) a.button span:not(.icon) {
  2312. display: none;
  2313. }
  2314.  
  2315. html body#tpl_calendar_daily div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content header.contentHeader
  2316. nav.contentHeaderNavigation ul li ul.buttonGroup li a.button span.icon {
  2317. margin-left: 0px;
  2318. margin-right: 0px;
  2319. }
  2320.  
  2321. html body#tpl_filebase_file div#pageContainer.pageContainer section#main.main div.layoutBoundary div#content.content
  2322. header.contentHeader.messageGroupContentHeader.filebaseFile nav.contentHeaderNavigation ul li a.button.buttonPrimary {
  2323. box-shadow: none !important;
  2324. }
  2325.  
  2326. /* =================================================================== */
  2327. /* =========================== PLUGIN EDITS ========================== */
  2328. /* =================================================================== */
  2329.  
  2330. #shoutbox .shoutboxEntry {
  2331. color: #222;
  2332. }
  2333.  
  2334. #shoutbox #shoutboxEntryAddForm .shoutboxExtend {
  2335. right: 3px;
  2336. opacity: 1;
  2337. }
  2338.  
  2339. #shoutbox #shoutboxEntryAddForm .shoutboxExtend .shoutboxButton {
  2340. margin: -2px;
  2341. margin-top: 8px;
  2342. height: 45px;
  2343. line-height: 45px;
  2344. background: #2d2d2d;
  2345. color: #fff;
  2346. }
  2347.  
  2348. #shoutbox #shoutboxEntryAddForm .shoutboxExtend .shoutboxButton:hover {
  2349. background: #222;
  2350. }
  2351.  
  2352. #shoutbox .shoutboxEntry small a, #shoutbox .shoutboxEntry time, #shoutbox .shoutboxEntry .shoutboxOptions {
  2353. color: #2d2d2d;
  2354. }
  2355.  
  2356. #shoutbox .shoutboxContent.asc::after, #shoutbox .shoutboxContent.asc::before {
  2357. background: none !important;
  2358. }
  2359.  
  2360. #shoutbox .shoutboxContent.desc::after {
  2361. display: none;
  2362. }
  2363.  
  2364. #shoutbox #shoutboxEntryAddForm .shoutboxExtend .shoutboxButton:not(:first-child) {
  2365. border-left: solid 1px #111;
  2366. padding: 0 18px !important;
  2367. }
  2368.  
  2369. #shoutbox #shoutboxMessage {
  2370. height: 45px;
  2371. }
  2372.  
  2373. #shoutbox {
  2374. background: #f7f7f7;
  2375. }
  2376.  
  2377. #shoutbox > div > ul > li:hover {
  2378. background: #f1f1f1;
  2379. }
  2380.  
  2381. #shoutbox .shoutboxEntry > .userAvatar {
  2382. float: left;
  2383. margin: 0px;
  2384. padding: 5px;
  2385. background: rgba(0, 0, 0, 0.03);
  2386. margin-right: 10px !important;
  2387. }
  2388.  
  2389. #shoutbox .shoutboxEntry {
  2390. color: #222;
  2391. background: #fff;
  2392. margin-bottom: 5px;
  2393. }
  2394.  
  2395. .news .messageContent {
  2396. padding: 0px;
  2397. }
  2398.  
  2399. .news .messageContent > div {
  2400. background: #f7f7f7;
  2401. padding: 10px;
  2402. }
  2403.  
  2404. .news.message .messageClipboardCheckbox::before {
  2405. top: -2px;
  2406. color: #2d2d2d;
  2407. }
  2408.  
  2409. .news .messageContent .containerHeadline {
  2410. background-color: #eee;
  2411. border: 1px solid rgba(224, 224, 224, 1);
  2412. padding: 7px;
  2413. border-radius: 0px;
  2414. height: 62px;
  2415. }
  2416.  
  2417. .newsDateBadge > div {
  2418. border-radius: 0px;
  2419. background-color: #eee;
  2420. height: 62px;
  2421. }
  2422.  
  2423. .newsList div.messageBody .messageText.newsImage {
  2424. display: none;
  2425. }
  2426.  
  2427. .newsList.messageList:not(.messageReducedList) > li {
  2428. border-bottom: 1px solid var(--Farbe1);
  2429. padding: 10px 0;
  2430. background: #fff;
  2431. }
  2432.  
  2433. .newsList.messageList:not(.messageReducedList) > li {
  2434. border-bottom: 0px;
  2435. padding: 30px 0;
  2436. background: transparent;
  2437. }
  2438.  
  2439. .news .messageContent {
  2440. border: 0px;
  2441. }
  2442.  
  2443. .messageList:not(.messageReducedList) {
  2444. border-top: 0px;
  2445. }
  2446.  
  2447. .gamificationMeter .meter {
  2448. height: 20px;
  2449. position: relative;
  2450. background: var(--Dunkel3);
  2451. border-radius: 0px;
  2452. box-sizing: content-box;
  2453. box-shadow: none;
  2454. }
  2455.  
  2456. .gamificationMeter .meter > span {
  2457. display: block;
  2458. height: 100%;
  2459. border-radius: 0px;
  2460. background-color: var(--Farbe2);
  2461. position: relative;
  2462. overflow: hidden;
  2463. }
  2464.  
  2465. #tpl_ticketsystem_ticket li#messageQuickReply.simpleView {
  2466. padding: 0px;
  2467. border-top: solid 10px var(--Dunkel2);
  2468. border-left: 0px !important;
  2469. }
  2470.  
  2471. #tpl_ticketsystem_ticket li#messageQuickReply.simpleView div.message.jsInvalidQuoteTarget div.messageContent {
  2472. padding: 0px !important;
  2473. border: 0px !important;
  2474. margin-top: 10px !important;
  2475. }
  2476.  
  2477. #tpl_ticketsystem_ticket li#messageQuickReply.simpleView div.message.jsInvalidQuoteTarget div.messageContent div.box48 img.userAvatarImage {
  2478. display: none;
  2479. }
  2480.  
  2481. html body#tpl_ticketsystem_ticket ul.ticketAnswerList.containerList.jsClipboardContainer li div.ticketAnswer.message.box48 div.messageBody
  2482. div.commentContent nav.jsMobileNavigation.buttonGroupNavigation ul.buttonList.iconList li a.button {
  2483. background: var(--Farbe2) !important;
  2484. }
  2485.  
  2486. html body#tpl_ticketsystem_ticket ul.ticketAnswerList.containerList.jsClipboardContainer li div.ticketAnswer.message.box48 div.messageBody
  2487. div.commentContent nav.jsMobileNavigation.buttonGroupNavigation ul.buttonList.iconList li a.button span {
  2488. color: #fff;
  2489. }
  2490.  
  2491. #argumentContainer > div#argumentNegativContainer > h3 {
  2492. background: #900;
  2493. color: #fff;
  2494. text-shadow: none !important;
  2495. border-bottom: 0px;
  2496. }
  2497.  
  2498. #argumentContainer > div#argumentPositivContainer > h3 {
  2499. background: #060;
  2500. color: #fff;
  2501. text-shadow: none;
  2502. border-bottom: 0px;
  2503. }
  2504.  
  2505. html body#tpl_easyrating_review div.section.reviewContent ul.messageList.messageReducedList.easyratingReviewList li article#reviewMessage.message.userOnlineGroupMarking4 div.messageContent {
  2506. padding: 0px;
  2507. border: 0px;
  2508. }
  2509.  
  2510. span.reviewRecommendationPercent {
  2511. padding: 8px 18px;
  2512. position: absolute;
  2513. top: 25px;
  2514. border-radius: 0px;
  2515. font-size: 12px;
  2516. }
  2517.  
  2518. .reviewNoteBoxSidebar {
  2519. position: relative;
  2520. background-color: var(--Dunkel3);
  2521. border: 0px;
  2522. border-radius: 0;
  2523. }
  2524.  
  2525. .easyratingReviewRecommendationList > li > article > .messageContent > header {
  2526. height: 50px;
  2527. border-left: 0px;
  2528. border-right: 0px;
  2529. }
  2530.  
  2531. .easyratingEntryList .messageHeaderMetaData .messagePublicationTime, .easyratingReviewRecommendationList .messageHeaderMetaData .messagePublicationTime {
  2532. color: #999 !important;
  2533. }
  2534.  
  2535. .easyratingEntryList .messageHeaderMetaData > li, .easyratingReviewRecommendationList .messageHeaderMetaData > li {
  2536. background: transparent !important;
  2537. }
  2538.  
  2539. .recommendationIconDetail > span.fa-thumbs-o-up {
  2540. font-size: 28px;
  2541. height: 50px;
  2542. margin-top: 5px;
  2543. }
  2544.  
  2545. .recommendationIconDetail > span.fa-thumbs-o-down {
  2546. font-size: 28px;
  2547. height: 50px;
  2548. margin-top: 5px;
  2549. }
  2550.  
  2551. .easyratingReviewMessage .messageContent {
  2552. position: relative !important;
  2553. padding: 0px !important;
  2554. background: #fff !important;
  2555. }
  2556.  
  2557. .easyratingReviewMessage .messageContent .messageBody {
  2558. padding: 20px;
  2559. margin-top: 0px;
  2560. }
  2561.  
  2562. .easyratingReviewList .message .messageContent .messageHeader {
  2563. margin-top: 0px;
  2564. justify-content: flex-start;
  2565. width: 100%;
  2566. left: 0px !important;
  2567. top: 0px !important;
  2568. border-left: 0px !important;
  2569. border-right: 0px !important;
  2570. padding: 0px 20px;
  2571. }
  2572.  
  2573. .reviewNoteBox {
  2574. position: absolute;
  2575. top: 0;
  2576. right: 0;
  2577. min-width: 220px;
  2578. background-color: #eee;
  2579. border-left: solid 1px #ddd;
  2580. border-radius: 0px;
  2581. font-family: Verdana, Geneva, sans-serif;
  2582. height: 150px;
  2583. box-shadow: inset 0px 1px 0px #fff, inset 1px 0px 0px #fff;
  2584. border-right: 0px;
  2585. border-top: 0px;
  2586. border-bottom: 0px;
  2587. width: 220px;
  2588. max-width: 220px;
  2589. z-index: 1;
  2590. }
  2591.  
  2592. ul.easyratingReviewList.easyratingReviewListDoubleColumns > li div.reviewImage img {
  2593. height: 150px;
  2594. width: calc(100% - 220px);
  2595. border-radius: 0;
  2596. border-top: solid 1px #ddd;
  2597. border-left: solid 1px #ddd;
  2598. }
  2599.  
  2600. .easyratingReviewList .message .messageContent .messageHeader img.userAvatarImage {
  2601. box-shadow: none !important;
  2602. }
  2603.  
  2604. .easyratingReviewList .message .messageContent .messageHeader .box96 > a {
  2605. margin-top: -55px;
  2606. z-index: 1;
  2607. box-shadow: none !important;
  2608. }
  2609.  
  2610. .easyratingReviewList .message .messageContent .messageHeader .box96 > h2.messageTitle {
  2611. margin-top: -99px;
  2612. font-weight: 700;
  2613. font-size: 20px;
  2614. text-transform: uppercase;
  2615. background: rgba(0, 0, 0, 0.5);
  2616. z-index: 0;
  2617. margin-left: -19px;
  2618. padding-left: 120px;
  2619. }
  2620.  
  2621. .easyratingReviewList .message .messageContent .messageHeader .box96 > h2.messageTitle a {
  2622. color: #fff;
  2623. }
  2624.  
  2625. .easyratingReviewList .message .messageContent .messageHeader .box96 ul.messageHeaderMetaData {
  2626. margin-top: -34px;
  2627. padding-left: 120px;
  2628. }
  2629.  
  2630. .easyratingReviewList .message .messageContent .messageHeader .box96 ul.messageHeaderMetaData > li {
  2631. background: transparent !important;
  2632. box-shadow: none;
  2633. border: 0px;
  2634. }
  2635.  
  2636. .easyratingReviewList .message .messageContent .messageHeader .box96 ul.messageHeaderMetaData > li:not(:last-child)::after {
  2637. display: none;
  2638. }
  2639.  
  2640. .easyratingReviewList .message .messageContent .messageHeader .box96 ul.messageHeaderMetaData .messagePublicationTime,
  2641. .easyratingReviewList .message .messageContent .messageHeader .box96 ul.messageHeaderMetaData > li > a {
  2642. color: #2d2d2d;
  2643. text-transform: uppercase;
  2644. }
  2645.  
  2646. .easyratingReviewReadMoreButton {
  2647. background: var(--Farbe2);
  2648. color: #fff;
  2649. padding: 3px 10px;
  2650. text-transform: uppercase;
  2651. font-weight: 700;
  2652. font-size: 12px;
  2653. }
  2654.  
  2655. .content > .section > .messageList.easyratingReviewListDoubleColumns > :last-child {
  2656. border-bottom-width: 0px;
  2657. }
  2658.  
  2659. #review_recommendations {
  2660. position: relative;
  2661. padding: 20px;
  2662. background: #eee;
  2663. }
  2664.  
  2665. .easyratingEntryNavigation .easyratingNextEntryButton, .easyratingTableNavigation .easyratingNextEntryButton, .easyratingReviewNavigation
  2666. .easyratingNextEntryButton, .easyratingEntryNavigation .easyratingNextTableButton, .easyratingTableNavigation .easyratingNextTableButton,
  2667. .easyratingReviewNavigation .easyratingNextTableButton, .easyratingEntryNavigation .easyratingNextReviewButton, .easyratingTableNavigation
  2668. .easyratingNextReviewButton, .easyratingReviewNavigation .easyratingNextReviewButton {
  2669. background: #f7f7f7;
  2670. padding: 10px;
  2671. }
  2672.  
  2673. .easyratingEntryNavigation .easyratingPreviousEntryButton, .easyratingTableNavigation .easyratingPreviousEntryButton, .easyratingReviewNavigation
  2674. .easyratingPreviousEntryButton, .easyratingEntryNavigation .easyratingPreviousTableButton, .easyratingTableNavigation .easyratingPreviousTableButton,
  2675. .easyratingReviewNavigation .easyratingPreviousTableButton, .easyratingEntryNavigation .easyratingPreviousReviewButton, .easyratingTableNavigation
  2676. .easyratingPreviousReviewButton, .easyratingReviewNavigation .easyratingPreviousReviewButton {
  2677. background: #f7f7f7;
  2678. padding: 10px;
  2679. }
  2680.  
  2681. .messageList:not(.messageReducedList).easyratingReviewListDoubleColumns > li {
  2682. border-bottom: 0px;
  2683. }
  2684.  
  2685. .timelineActivityItem {
  2686. margin-bottom: 0px !important;
  2687. margin-top: 0px;
  2688. }
  2689.  
  2690. .jsHasShare > div > h3 {
  2691. background: #eee;
  2692. padding: 2px 15px;
  2693. height: 48px;
  2694. border: solid 1px #ddd;
  2695. }
  2696.  
  2697. .jsHasShare > div > h3 > small:not(:first-child) {
  2698. font-size: 15px;
  2699. }
  2700.  
  2701. .jsHasShare .entryActionDropdown {
  2702. width: 20px;
  2703. text-align: center;
  2704. background: #2d2d2d;
  2705. height: 48px;
  2706. }
  2707.  
  2708. .jsHasShare .entryActionDropdown .icon, .jsHasShare .entryActionDropdown .fa {
  2709. color: #fff;
  2710. }
  2711.  
  2712. .socialShare {
  2713. display: flex;
  2714. background: var(--Hell5) !important;
  2715. padding: 10px;
  2716. }
  2717.  
  2718. .socialShare .shareContainer .actionArea {
  2719. background: var(--Dunkel3);
  2720. height: 36px;
  2721. }
  2722.  
  2723. #socialShare #sharePicture i {
  2724. color: #fff;
  2725. }
  2726.  
  2727. #boxTimelineActivity {
  2728. margin-top: -40px !important;
  2729. }
  2730.  
  2731. .socialShare .shareContainer #shareMessage, .socialShare .shareContainer #shareMessagePlaceholder {
  2732. border: 0;
  2733. background: #fff;
  2734. color: #2d2d2d;
  2735. }
  2736.  
  2737. .socialShare .shareContainer::before, .socialShare .shareContainer::after {
  2738. display: none;
  2739. }
  2740.  
  2741. .socialShare .shareContainer {
  2742. background-color: #fff;
  2743. border: solid 1px #ddd;
  2744. }
  2745.  
  2746. .socialShare .userAvatarImage {
  2747. height: 42px;
  2748. width: 42px;
  2749. border: solid 1px #ddd;
  2750. }
  2751.  
  2752. #timeline {
  2753. padding: 20px;
  2754. background: var(--Hell2);
  2755. border: solid 1px var(--Hell3);
  2756. }
  2757.  
  2758. .tabMenuContent#timeline #socialShare {
  2759. margin-top: 0px;
  2760. margin-bottom: 40px;
  2761. }
  2762.  
  2763. .easyratingReviewList .message .messageContent .messageHeader .box96 > ul.messageStatus {
  2764. margin-top: -34px;
  2765. }
  2766.  
  2767. .jsSuggestion.suggestionListItem {
  2768. background: #fff;
  2769. border-bottom: solid 1px #ddd !important;
  2770. }
  2771.  
  2772. .notifybox {
  2773. width: 350px !important;
  2774. position: fixed !important;
  2775. left: 30px;
  2776. padding: 10px 10px !important;
  2777. z-index: 500;
  2778. opacity: 0.9;
  2779. text-decoration: none !important;
  2780. background: #fff;
  2781. box-shadow: none !important;
  2782. max-width: 350px !important;
  2783. margin-left: 0px !important;
  2784. bottom: 30px !important;
  2785. }
  2786.  
  2787. .notifybox::before {
  2788. display: none;
  2789. }
  2790.  
  2791. .notifybox small {
  2792. padding: 5px;
  2793. background: #eee;
  2794. width: 330px;
  2795. margin-top: 5px;
  2796. display: flex;
  2797. }
  2798.  
  2799. .notifybox .notifyboxAuthor {
  2800. font-weight: 700;
  2801. font-size: 1.2rem;
  2802. display: block;
  2803. text-transform: uppercase;
  2804. }
  2805.  
  2806. .notifybox .notifyboxAuthor .userAvatarImage {
  2807. margin-right: 5px;
  2808. }
  2809.  
  2810. /* =================================================================== */
  2811. /* ========================= ISK-MEDIA STUFF ========================= */
  2812. /* =================================================================== */
  2813.  
  2814. @media all and (min-width: 2000px) {
  2815. .pageFooterCopyright .layoutBoundary {
  2816. padding: 0 20px;
  2817. width: calc(90% - 50px) !important;
  2818. }
  2819.  
  2820. .pageHeaderContainer {
  2821. height: 400px;
  2822. background-image: url('#{$style_image_path}header.jpg');
  2823. background-size: 100% 100%;
  2824. }
  2825. }
  2826.  
  2827. /* =================================================================== */
  2828. /* ====================== MICROSOFT EDGE HOTFIX ====================== */
  2829. /* =================================================================== */
  2830.  
  2831.  
  2832.  
  2833. /* =================================================================== */
  2834. /* ======================== MOBILE ANPASSUNGEN ======================= */
  2835. /* =================================================================== */
  2836.  
  2837. @include screen-md-down {
  2838. .boxesSidebarLeft::before, .boxesSidebarRight::before {
  2839. content: attr(data-show-sidebar) !important;
  2840. display: block !important;
  2841. }
  2842.  
  2843. .boxesSidebarLeft.open::before, .boxesSidebarRight.open::before {
  2844. content: attr(data-hide-sidebar) !important;
  2845. }
  2846.  
  2847. .boxesSidebarLeft.boxesSidebarLeftHasMenu.open::before {
  2848. content: attr(data-hide-navigation) !important;
  2849. }
  2850.  
  2851. .boxesSidebarLeft.boxesSidebarLeftHasMenu::before {
  2852. content: attr(data-show-navigation) !important;
  2853. }
  2854.  
  2855. .boxesSidebarLeft::before {
  2856. top: 0px !important;
  2857. }
  2858.  
  2859. .pageHeaderSearch, .slider-container-wrapper, .additional_partner {
  2860. display: none !important;
  2861. }
  2862.  
  2863. .messageReduced .messageHeader {
  2864. margin: 0px 0px;
  2865. }
  2866.  
  2867. .copyright:nth-child(2), .copyright:nth-child(5), .copyright {
  2868. background: none !important;
  2869. text-align: center !important;
  2870. float: none !important;
  2871. margin: 0 auto;
  2872. width: 100% !important;
  2873. }
  2874.  
  2875. .contentHeader .contentHeaderNavigation > ul .button, .contentFooter .contentFooterNavigation > ul .button {
  2876. box-shadow: none !important;
  2877. }
  2878.  
  2879. .boxesFooter::before, .boxesFooter::after {
  2880. background: none !important;
  2881. }
  2882.  
  2883. .boxesFooterBoxes {
  2884. display: none;
  2885. }
  2886.  
  2887. .message .wcfLikeCounter {
  2888. display: none;
  2889. }
  2890.  
  2891. .contentHeader .contentHeaderNavigation > ul .button .icon, .contentFooter > .contentFooterNavigation > ul .button .icon {
  2892. margin-left: 0px;
  2893. margin-right: 3px;
  2894. }
  2895.  
  2896. .contentHeader > .contentHeaderNavigation > ul > li > .button, .contentFooter > .contentFooterNavigation > ul > li > .button {
  2897. font-size: 14px;
  2898. }
  2899.  
  2900. .news .messageContent .containerHeadline {
  2901. height: auto !important;
  2902. }
  2903.  
  2904. .pageHeaderSearch:not(.open) {
  2905. display: none !important;
  2906. }
  2907.  
  2908. .slider-container {
  2909. width: 100% !important;
  2910. }
  2911.  
  2912. .breadcrumbs > ol > li:last-child > a {
  2913. color: #fff !important;
  2914. }
  2915.  
  2916. .breadcrumbs {
  2917. margin-bottom: 0px;
  2918. margin-top: -5px;
  2919. }
  2920.  
  2921. .main {
  2922. padding: 10px 0px;
  2923. }
  2924.  
  2925. .messageTabMenuNavigation > ul > li > a > .icon, .messageHeader > .messageQuickOptions {
  2926. color: #fff !important;
  2927. }
  2928.  
  2929. .messageSidebar {
  2930. min-height: 50px !important;
  2931. margin-left: 0px !important;
  2932. margin-right: 0px !important;
  2933. }
  2934.  
  2935. .messageSidebar .userAvatar > a {
  2936. border-width: 0px !important;
  2937. }
  2938.  
  2939. .messageContent {
  2940. position: relative;
  2941. }
  2942.  
  2943. .pageHeaderFacade > .layoutBoundary {
  2944. z-index: 401 !important;
  2945. position: absolute !important;
  2946. width: 200px;
  2947. }
  2948.  
  2949. .mainMenu .boxMenu {
  2950. justify-content: flex-start !important;
  2951. }
  2952.  
  2953. .userPanel {
  2954. position: absolute;
  2955. background: none;
  2956. box-shadow: none;
  2957. margin-right: 0px !important;
  2958. margin-top: 0px !important;
  2959. width: auto !important;
  2960. height: auto !important;
  2961. display: block;
  2962. top: 0px !important;
  2963. }
  2964.  
  2965. .mainMenu, .userPanel {
  2966. position: relative !important;
  2967. }
  2968.  
  2969. .mainMenu {
  2970. margin-left: 0px !important;
  2971. margin-top: 0px !important;
  2972. left: 0% !important;
  2973. }
  2974.  
  2975. .mainMenu.pageMenuMobileButtonHasContent::after, .userPanel.pageMenuMobileButtonHasContent::after {
  2976. background-color: var(--Farbe1);
  2977. border: 2px solid var(--Farbe3);
  2978. border-radius: 50%;
  2979. content: "";
  2980. height: 14px;
  2981. position: absolute;
  2982. right: -3px;
  2983. top: -3px;
  2984. width: 14px;
  2985. }
  2986.  
  2987. .pageHeaderPanel {
  2988. height: 53px !important;
  2989. padding-top: 0px !important;
  2990. padding-bottom: 0px !important;
  2991. }
  2992.  
  2993. .pageHeaderPanel > .layoutBoundary {
  2994. flex-direction: row !important;
  2995. height: 53px;
  2996. padding: 10px 0px;
  2997. }
  2998.  
  2999. .pageHeaderContainer {
  3000. height: 200px !important;
  3001. background-position-y: top !important;
  3002. box-shadow: none;
  3003. }
  3004.  
  3005. .messageSidebar .badgeOnline {
  3006. display: none !important;
  3007. }
  3008.  
  3009. .messageFooterGroup > .likesSummary {
  3010. width: 100% !important;
  3011. }
  3012.  
  3013. .message .messageClipboardCheckbox::before {
  3014. color: #2d2d2d !important;
  3015. left: 0px !important;
  3016. top: -4px !important;
  3017. }
  3018.  
  3019. .messageQuickOptions::before {
  3020. left: 0px !important;
  3021. top: 3px !important;
  3022. }
  3023.  
  3024. .containerList.recentActivityList > li .containerHeadline {
  3025. height: auto !important;
  3026. }
  3027.  
  3028. .pageFooterCopyright .layoutBoundary {
  3029. margin-top: -20px;
  3030. }
  3031.  
  3032. .pageHeaderLogo {
  3033. padding: 5px !important;
  3034. background: var(--Dunkel3) !important;
  3035. margin-top: 3px !important;
  3036. }
  3037.  
  3038. .boxesSidebarLeft::before, .boxesSidebarRight::before {
  3039. background-color: #fff;
  3040. }
  3041.  
  3042. .menuOverlayItemList {
  3043. background: var(--Farbe1);
  3044. }
  3045.  
  3046. .menuOverlayItemLink {
  3047. background: var(--Farbe2);
  3048. }
  3049.  
  3050. .menuOverlayItemLinkIcon {
  3051. background: var(--Farbe2);
  3052. }
  3053.  
  3054. .menuOverlayItemLink.active, .menuOverlayItemLinkIcon.active {
  3055. background: var(--Farbe3);
  3056. }
  3057.  
  3058. .menuOverlayLogoWrapper {
  3059. flex: 1 1 auto;
  3060. padding: 5px;
  3061. display: flex;
  3062. background: var(--Farbe2);
  3063. }
  3064.  
  3065. .pageFooterCopyright > .layoutBoundary > div:not(:first-child) {
  3066. margin-top: -20px !important;
  3067. }
  3068.  
  3069. .pageAction .toTop {
  3070. display: none;
  3071. }
  3072.  
  3073. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  3074. border: 0px;
  3075. box-sizing: content-box;
  3076. padding: 4px;
  3077. right: 0px;
  3078. top: 0px;
  3079. border-radius: 0px;
  3080. height: 24px !important;
  3081. width: 24px !important;
  3082. }
  3083.  
  3084. .wbbAnnouncementIcon, .wbbStickyIcon, .wbbMovedIcon {
  3085. font-size: 18px;
  3086. line-height: 24px;
  3087. }
  3088.  
  3089. .wbbBoardList .wbbBoardContainer, .containerList > li, .tabularListRow:not(.tabularListRowHead) {
  3090. padding-left: 10px;
  3091. padding-right: 10px;
  3092. }
  3093.  
  3094. .wbbBoardList .wbbLastPost > .box32 {
  3095. padding: 3px 10px 3px 10px;
  3096. }
  3097.  
  3098. .messageAuthorContainer {
  3099. text-align: center;
  3100. margin-right: 10px;
  3101. float: right;
  3102. position: absolute;
  3103. top: -2px;
  3104. }
  3105.  
  3106. .messageSidebar .messageAuthor .messageAuthorContainer:last-child {
  3107. align-items: center;
  3108. display: inline;
  3109. height: auto;
  3110. position: absolute;
  3111. text-align: center;
  3112. }
  3113.  
  3114. .messageSidebar .badge {
  3115. width: 150px;
  3116. padding: 5px 0px;
  3117. font-weight: 600;
  3118. text-transform: uppercase;
  3119. border-radius: 0px;
  3120. text-align: center;
  3121. top: 29px;
  3122. }
  3123.  
  3124. .userProfilePreviewAvatar .badgeOnline, .userProfileUser .contentHeaderIcon .badgeOnline {
  3125. color: transparent;
  3126. padding: 0;
  3127. top: 35px;
  3128. width: 0 !important;
  3129. left: 5px !important;
  3130. }
  3131.  
  3132. .userProfileUser .contentHeaderIcon a {
  3133. display: block;
  3134. border: 0px;
  3135. width: auto !important;
  3136. margin-top: 0px;
  3137. }
  3138.  
  3139. .addfooter {
  3140. padding: 0px 20px 20px 20px;
  3141. }
  3142.  
  3143. .addfooter_title {
  3144. margin: 0px -20px 0px -20px;
  3145. }
  3146.  
  3147. .addfooter_boxinfo {
  3148. display: none;
  3149. }
  3150.  
  3151. .addfooter_boxleft {
  3152. width: 47.5%;
  3153. margin-right: 2.5%;
  3154. margin-left: 0px;
  3155. }
  3156.  
  3157. .addfooter_boxcenter {
  3158. width: 47.5%;
  3159. margin-left: 2.5%;
  3160. margin-right: 0px;
  3161. }
  3162.  
  3163. .addfooter_boxright {
  3164. display: none;
  3165. }
  3166.  
  3167. .addfooter_boxright h1, .addfooter_boxright p {
  3168. display: none;
  3169. }
  3170.  
  3171. .tabMenuOverlayRight {
  3172. background: #111;
  3173. padding-right: 10px;
  3174. }
  3175.  
  3176. .tabMenuOverlayLeft {
  3177. background: #111;
  3178. padding-left: 10px;
  3179. }
  3180.  
  3181. .blogEntryReadMoreButton {
  3182. margin-top: 0px !important;
  3183. }
  3184.  
  3185. .boxesSidebarRight {
  3186. right: 0% !important;
  3187. box-shadow: none !important;
  3188. padding: 0px !important;
  3189. width: 100% !important;
  3190. margin-bottom: 50px;
  3191. }
  3192.  
  3193. .boxesSidebarLeft {
  3194. left: 0% !important;
  3195. box-shadow: none !important;
  3196. padding: 0px !important;
  3197. width: 100% !important;
  3198. margin-bottom: 50px;
  3199. margin-top: 0px !important;
  3200. top: 0px !important;
  3201. }
  3202.  
  3203. .boxesSidebarLeft::before, .boxesSidebarRight::before {
  3204. width: 100% !important;
  3205. background-color: var(--Farbe2);
  3206. transform: none !important;
  3207. height: 40px !important;
  3208. margin-left: 0px !important;
  3209. padding: 10px !important;
  3210. position: relative !important;
  3211. text-transform: uppercase;
  3212. border: 0 !important;
  3213. font-weight: 700;
  3214. }
  3215.  
  3216. .content > .section, .content > form, .sectionContainer {
  3217. margin-left: 0px !important;
  3218. margin-right: 0px !important;
  3219. }
  3220.  
  3221. .messageContent {
  3222. margin-left: 0px !important;
  3223. margin-right: 0px !important;
  3224. }
  3225.  
  3226. .boxesSidebarLeft .box.boxInfo, .boxesSidebarRight .box.boxInfo {
  3227. box-shadow: none !important;
  3228. }
  3229.  
  3230. .boxesSidebarLeft .box:not(.boxBorderless), .boxesSidebarRight .box:not(.boxBorderless) {
  3231. padding: 20px !important;
  3232. }
  3233.  
  3234. .breadcrumbs > ol > li {
  3235. background: var(--Dunkel2) !important;
  3236. padding: 0px !important;
  3237. margin-left: 10px;
  3238. margin-right: 10px;
  3239. margin-top: 0px !important;
  3240. }
  3241.  
  3242. .messageReduced .messageHeader, .messageCollapsed .messageHeader {
  3243. padding: 10px 10px !important;
  3244. height: auto !important;
  3245. }
  3246. }
  3247.  
  3248. /* =================================================================== */
  3249. /* ============================ SONSTIGES ============================ */
  3250. /* =================================================================== */
  3251.  
  3252. .messageSignature a.externalURL::after {
  3253. display: none;
  3254. }
  3255.  
  3256. .messageSignature {
  3257. opacity: 1;
  3258. }
  3259.  
  3260. /* =================================================================== */
  3261. /* ========================== ÜBERSCHRIFTEN ========================== */
  3262. /* =================================================================== */
  3263.  
  3264. .htmlContent h2, .messageBody > .messageText h2, .messageSignature > div h2, .redactor-layer h2 {
  3265. font-size: 22px;
  3266. font-style: normal;
  3267. text-transform: uppercase;
  3268. font-weight: 400;
  3269. letter-spacing: 1px;
  3270. border-bottom: solid 2px #2d2d2d;
  3271. }
  3272.  
  3273. .htmlContent h3, .messageBody > .messageText h3, .messageSignature > div h3, .redactor-layer h3 {
  3274. font-size: 18px;
  3275. font-style: normal;
  3276. text-transform: uppercase;
  3277. font-weight: 400;
  3278. letter-spacing: 1px;
  3279. border-bottom: solid 2px #2d2d2d;
  3280. }
  3281.  
  3282. .htmlContent h4, .messageBody > .messageText h4, .messageSignature > div h4, .redactor-layer h4 {
  3283. font-size: 14px;
  3284. font-style: normal;
  3285. text-transform: uppercase;
  3286. font-weight: 400;
  3287. letter-spacing: 1px;
  3288. border-bottom: solid 2px #2d2d2d;
  3289. }
  3290.  
  3291. /* =================================================================== */
  3292. /* ============================ CODE BOXEN =========================== */
  3293. /* =================================================================== */
  3294.  
  3295. .inlineCode, kbd {
  3296. background-color: #f7f7f7 !important;
  3297. border: solid 1px #ddd !important;
  3298. border-radius: 0px !important;
  3299. color: #2d2d2d !important;
  3300. padding: 10px !important;
  3301. box-shadow: inset 0px 1px 0px #fff !important;
  3302. }
  3303.  
  3304. .inlineCode, kbd {
  3305. display: inline-block;
  3306. font-family: Consolas, 'Courier New', monospace;
  3307. font-style: normal;
  3308. font-weight: normal;
  3309. margin: 1px 2px;
  3310. overflow: auto;
  3311. padding: 0 4px;
  3312. text-decoration: none;
  3313. vertical-align: middle;
  3314. word-break: break-all;
  3315. word-wrap: break-word;
  3316. }
  3317.  
  3318. .codeBox {
  3319. box-shadow: none;
  3320. border-radius: 0px;
  3321. padding: 0px;
  3322. }
  3323.  
  3324. .codeBox > .toggleButton {
  3325. box-shadow: none;
  3326. padding-bottom: 10px;
  3327. font-size: 10px;
  3328. font-style: normal;
  3329. text-transform: uppercase;
  3330. font-weight: 400;
  3331. letter-spacing: 1px;
  3332. background: #2d2d2d;
  3333. border: solid 1px #000;
  3334. box-shadow: none;
  3335. color: #fff;
  3336. }
  3337.  
  3338. .codeBox.collapsed > .toggleButton {
  3339. background: #2d2d2d;
  3340. margin: 0 auto;
  3341. color: #fff;
  3342. padding: 10px 10px;
  3343. border: solid 1px #000;
  3344. box-shadow: none;
  3345. }
  3346.  
  3347. .codeBox > div {
  3348. background-color: #eee;
  3349. color: #2d2d2d;
  3350. padding: 14px;
  3351. border: solid 1px #ddd;
  3352. box-shadow: inset 0px 1px 0px #fff;
  3353. }
  3354.  
  3355. .codeBox > div > ol::before {
  3356. border-right: 2px solid #2d2d2d;
  3357. opacity: 1.0;
  3358. }
  3359.  
  3360. /* =================================================================== */
  3361. /* ============================ INFO BOXEN =========================== */
  3362. /* =================================================================== */
  3363.  
  3364. .info, .error, .success, .warning {
  3365. padding: 12px 22px;
  3366. margin-left: 55px;
  3367. position: relative;
  3368. min-height: 45px;
  3369. border: solid 1px rgba(0, 0, 0, 0.1);
  3370. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
  3371. }
  3372.  
  3373. .info a, .error a, .success a, .warning a {
  3374. font-weight: 600;
  3375. }
  3376.  
  3377. .info::before, .error::before, .success::before, .warning::before {
  3378. font-family: FontAwesome;
  3379. font-size: 28px;
  3380. position: absolute;
  3381. top: -1px;
  3382. left: -55px;
  3383. line-height: 48px;
  3384. width: 48px;
  3385. height: 48px;
  3386. text-align: center;
  3387. color: #707275;
  3388. border: solid 1px rgba(0, 0, 0, 0.1);
  3389. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5);
  3390. }
  3391.  
  3392. .success::before {
  3393. background-color: $wcfStatusSuccessBackground;
  3394. content: "\f00c";
  3395. color: $wcfStatusSuccessText;
  3396. }
  3397.  
  3398. .warning::before {
  3399. background-color: $wcfStatusWarningBackground;
  3400. content: "\f12a";
  3401. color: $wcfStatusWarningText;
  3402. }
  3403.  
  3404. .info::before {
  3405. background-color: $wcfStatusInfoBackground;
  3406. content: "\f129";
  3407. color: $wcfStatusInfoText;
  3408. }
  3409.  
  3410. .error::before {
  3411. background-color: $wcfStatusErrorBackground;
  3412. content: "\f05e";
  3413. color: $wcfStatusErrorText;
  3414. }
  3415.  
  3416. .info.notice.noticeDismissible.active, .success.notice.noticeDismissible.active, .error.notice.noticeDismissible.active, .warning.notice.noticeDismissible.active {
  3417. padding: 12px 22px 12px 22px;
  3418. margin-left: 50px;
  3419. }
  3420.  
  3421. .info.notice.noticeDismissible.active .icon, .success.notice.noticeDismissible.active .icon, .error.notice.noticeDismissible.active .icon, .warning.notice.noticeDismissible.active .icon {
  3422. float: right;
  3423. margin-right: -15px;
  3424. margin-top: -5px;
  3425. }
  3426.  
  3427. #systemNotification {
  3428. margin: 0 auto;
  3429. }
  3430.  
  3431. #systemNotification > p::before {
  3432. display: none;
  3433. }
  3434.  
  3435. .pageFooterStickyNotice .error, .pageFooterStickyNotice .info, .pageFooterStickyNotice .success, .pageFooterStickyNotice .warning {
  3436. min-height: auto;
  3437. padding: 10px 10px;
  3438. margin: 0px;
  3439. }
  3440.  
  3441. .pageFooterStickyNotice .info::before, .pageFooterStickyNotice .error::before, .pageFooterStickyNotice .success::before, .pageFooterStickyNotice .warning::before {
  3442. display: none;
  3443. }
  3444.  
  3445. .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeMoreInformation, .pageFooterStickyNotice .cookiePolicyNotice .cookiePolicyNoticeDismiss {
  3446. padding: 4px 10px;
  3447. border-bottom: none;
  3448. }
  3449.  
  3450. /* =================================================================== */
  3451. /* ============================= SPOILER ============================= */
  3452. /* =================================================================== */
  3453.  
  3454. .spoilerBoxHeader {
  3455. border-bottom: solid 2px #2d2d2d;
  3456. padding-bottom: 0px;
  3457. }
  3458.  
  3459. .spoilerBox > .spoilerBoxContent {
  3460. background-color: #fff;
  3461. box-shadow: none;
  3462. margin-top: 0px;
  3463. border: solid 1px #ddd;
  3464. }
  3465.  
  3466. .button.jsSpoilerToggle::before {
  3467. content: "\f0dc";
  3468. font-family: FontAwesome;
  3469. font-size: 14px;
  3470. margin-left: 2px;
  3471. margin-right: 6px;
  3472. text-shadow: none !important;
  3473. font-weight: normal;
  3474. vertical-align: -1px;
  3475. }
  3476.  
  3477. .button.jsSpoilerToggle {
  3478. margin: 0 auto;
  3479. text-align: center;
  3480. width: 200px;
  3481. border-radius: 0px;
  3482. background: #2d2d2d;
  3483. color: #fff;
  3484. font-size: 10px;
  3485. font-style: normal;
  3486. text-transform: uppercase;
  3487. font-weight: 400;
  3488. letter-spacing: 1px;
  3489. }
  3490.  
  3491. .button.jsSpoilerToggle:hover, .button.jsSpoilerToggle.active {
  3492. background: #2d2d2d;
  3493. color: #fff;
  3494. }
  3495.  
  3496. /* =================================================================== */
  3497. /* =============================== TAGS ============================== */
  3498. /* =================================================================== */
  3499.  
  3500. .tagList .tagWeight1, .tagList .tagWeight2, .tagList .tagWeight3, .tagList .tagWeight4, .tagList .tagWeight5, .tagList .tagWeight6, .tagList .tagWeight7 {
  3501. font-size: 14px !important;
  3502. }
  3503.  
  3504. .boxesSidebarLeft .tagList li a, .boxesSidebarRight .tagList li a {
  3505. margin: 1px 0px 1px 0px;
  3506. display: inline-block;
  3507. padding: 0px 8px 1px;
  3508. color: #fff;
  3509. font-weight: 700;
  3510. border-radius: 0px !important;
  3511. background-color: #222;
  3512. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 0px 2px #151515;
  3513. border: 0;
  3514. line-height: 1.7;
  3515. }
  3516.  
  3517. .boxesSidebarLeft .tagList li:hover a, .boxesSidebarRight .tagList li:hover a {
  3518. background-color: #353535;
  3519. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 0px 2px #2d2d2d;
  3520. border: 0;
  3521. text-shadow: 0px 0px 2px #fff;
  3522. }
  3523.  
  3524. .tagList .tag {
  3525. display: inline-block;
  3526. padding: 0px 8px 0px 25px;
  3527. color: #fff;
  3528. font-weight: 700;
  3529. border-radius: 0px !important;
  3530. background-color: #222;
  3531. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 0px 2px #151515;
  3532. border: 0;
  3533. line-height: 1.7;
  3534. margin-left: 0px;
  3535. }
  3536.  
  3537. .tagList .tag:hover {
  3538. background-color: #353535;
  3539. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 0px 2px #2d2d2d;
  3540. border: 0;
  3541. text-shadow: 0px 0px 2px #fff;
  3542. }
  3543.  
  3544. .tagList .tag::before {
  3545. content: "\f02c";
  3546. font-family: FontAwesome;
  3547. font-weight: 400;
  3548. padding: 1px 5px;
  3549. margin: -1px 3px -1px -5px;
  3550. border: 0 !important;
  3551. left: 6px;
  3552. }
  3553.  
  3554. #tpl_blog_entry .tagList li a, #tpl_gallery_image .tagList li a, #tpl_calendar_event .tagList li a, #tpl_easyrating_review .tagList li a,
  3555. #tpl_easyrating_entry .tagList li a.tag {
  3556. margin: 1px 0px 1px 0px;
  3557. padding: 0px 7px 1px 24px;
  3558. line-height: 2;
  3559. }
  3560.  
  3561. .boxesSidebarLeft .tagList li a::before, .boxesSidebarRight .tagList li a::before {
  3562. content: "\f02c";
  3563. font-family: FontAwesome;
  3564. font-weight: 400;
  3565. padding: 2px 5px;
  3566. margin: -1px 3px -1px -5px;
  3567. border: 0 !important;
  3568. }
  3569.  
  3570. /* =================================================================== */
  3571. /* ========================== TEILEN BUTTON ========================== */
  3572. /* =================================================================== */
  3573.  
  3574. .messageShareButtons .button > :not(.icon) {
  3575. display: inline-block;
  3576. }
  3577.  
  3578. .messageShareButtons .button {
  3579. padding: 6px 12px 6px 7px;
  3580. text-transform: uppercase;
  3581. font-weight: 600;
  3582. text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  3583. border-radius: 0 !important;
  3584. }
  3585.  
  3586. .messageShareButtons ul > li > a {
  3587. color: #fff;
  3588. box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.2), 0px 0px 2px rgba(0, 0, 0, 0.3);
  3589. border: solid 1px rgba(0, 0, 0, 0.2);
  3590. }
  3591.  
  3592. /* =================================================================== */
  3593. /* ============================= UMFRAGE ============================= */
  3594. /* =================================================================== */
  3595.  
  3596. button.small.jsButtonPollShowResult, button.small.jsButtonPollVote, button.small.jsButtonPollShowVote {
  3597. background: #2d2d2d;
  3598. color: #fff;
  3599. padding: 8px 12px;
  3600. border-radius: 0px;
  3601. font-size: 10px;
  3602. font-style: normal;
  3603. text-transform: uppercase;
  3604. font-weight: 400;
  3605. letter-spacing: 1px;
  3606. }
  3607.  
  3608. button:disabled.small.jsButtonPollVote {
  3609. background: #ccc !important;
  3610. }
  3611.  
  3612. .pollContainer .badge {
  3613. background: #f7f7f7;
  3614. border: solid 1px #ddd;
  3615. color: #2d2d2d;
  3616. padding-right: 4px;
  3617. }
  3618.  
  3619. .pollContainer {
  3620. margin-right: 0px !important;
  3621. max-width: 100% !important;
  3622. width: 100%;
  3623. float: none !important;
  3624. background: #eee;
  3625. border: solid 1px #ddd;
  3626. box-shadow: inset 0px 1px 0px #fff;
  3627. padding: 10px;
  3628. min-width: 1px;
  3629. }
  3630.  
  3631. .pollContainer .pollInnerContainer {
  3632. background-color: rgba(0, 0, 0, 0.03);
  3633. padding: 20px 14px;
  3634. margin-top: 10px;
  3635. }
  3636.  
  3637. .pollContainer .formSubmit:not(:first-child) {
  3638. margin-top: 10px;
  3639. }
  3640.  
  3641. .pollContainer .formSubmit {
  3642. border-top: solid 2px #2d2d2d;
  3643. }
  3644.  
  3645. .pollContainer h2 {
  3646. font-size: 14px;
  3647. font-style: normal;
  3648. text-transform: uppercase;
  3649. font-weight: 400;
  3650. letter-spacing: 1px;
  3651. background: #2d2d2d;
  3652. padding: 7px 10px;
  3653. color: #fff;
  3654. }
  3655.  
  3656. /* =================================================================== */
  3657. /* ============================== ZITATE ============================= */
  3658. /* =================================================================== */
  3659.  
  3660. woltlab-quote {
  3661. background-color: transparent;
  3662. box-shadow: none;
  3663. border-radius: 0px;
  3664. padding: 10px 10px;
  3665. }
  3666.  
  3667. .quoteBox {
  3668. background-color: #eee;
  3669. box-shadow: none;
  3670. border-radius: 0px;
  3671. padding: 10px;
  3672. border: solid 1px #ddd;
  3673. box-shadow: inset 0px 1px 0px #fff;
  3674. }
  3675.  
  3676. .quoteBoxIcon {
  3677. float: left;
  3678. margin: 0px 10px 0px 0px;
  3679. }
  3680.  
  3681. .quoteBoxTitle {
  3682. color: #fff;
  3683. border-bottom: 2px solid #2d2d2d;
  3684. padding-bottom: 3px;
  3685. margin-right: 0px;
  3686. margin-left: 80px;
  3687. margin-bottom: 10px;
  3688. }
  3689.  
  3690. span.quoteBoxTitle {
  3691. border-bottom: none;
  3692. background: #2d2d2d;
  3693. padding: 3px 10px;
  3694. margin-left: 0px;
  3695. font-size: 14px;
  3696. font-style: normal;
  3697. text-transform: uppercase;
  3698. font-weight: 400;
  3699. letter-spacing: 1px;
  3700. }
  3701.  
  3702. .quoteBoxContent {
  3703. margin-left: 80px;
  3704. }
  3705.  
  3706. .quoteBoxIcon > .quoteBoxQuoteSymbol::before {
  3707. content: "\f10d";
  3708. position: relative;
  3709. font-family: FontAwesome;
  3710. font-size: 50px;
  3711. line-height: 50px;
  3712. height: 50px;
  3713. vertical-align: top;
  3714. color: #2d2d2d;
  3715. }
  3716.  
  3717. .message .quoteBox > .toggleButton, .message .quoteBox.collapsed > .toggleButton, .message.messageSidebarOrientationLeft .quoteBox > .toggleButton, .message.messageSidebarOrientationLeft .quoteBox.collapsed > .toggleButton {
  3718. background: #2d2d2d;
  3719. color: #fff;
  3720. padding: 10px 10px;
  3721. border: solid 1px #000;
  3722. box-shadow: none;
  3723. border: 0px;
  3724. width: 150px;
  3725. margin: 0 auto;
  3726. }
  3727.  
  3728. .quoteBox > .toggleButton {
  3729. font-size: 10px;
  3730. font-style: normal;
  3731. text-transform: uppercase;
  3732. font-weight: 400;
  3733. letter-spacing: 1px;
  3734. margin-right: 6px;
  3735. }
  3736.  
  3737. .messageReduced .messageBody .quoteBox > .toggleButton, .quoteBox.collapsed > .toggleButton {
  3738. border-top: 10px solid $wcfContentBackground;
  3739. background-color: $wcfContentBackground;
  3740. }
  3741.  
  3742. span.quoteBoxTitle > a {
  3743. color: #fff;
  3744. }/* =================================================================== */
  3745. /* ============================== DESIGN ============================= */
  3746. /* =================================================================== */
  3747.  
  3748. body {
  3749. background-color: #202020;
  3750. }
  3751.  
  3752. .contentHeader .contentTitle, .boxHeadline .contentTitle, .contentHeader > h1, .boxHeadline > h1 {
  3753. color:var(--Hell1);
  3754. text-transform:uppercase;
  3755. font-weight:700
  3756. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement