/* stylesheet for 'الأزرق الإفتراضي', generated on Sun, 13 Sep 2026 18:57:53 +0000 -- DO NOT EDIT */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;}
h1, h2, h3, h4, h5, h6 {font-weight: normal;}
article, aside, details, figcaption, figure, footer, header, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote::before, blockquote::after, q::before, q::after {content: '';content: none;}
.clearfix::before, .clearfix::after {display: table;content: "";}
.clearfix::after {clear: both;}
.userSelectNone {-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.aclList, .aclPermissionList {margin-top: 0;min-height: 100px;}
.aclList > li, .aclPermissionList > li {display: block;padding: 4px;}
.aclList > li:first-child, .aclPermissionList > li:first-child {border-top-right-radius: 6px;border-top-left-radius: 6px;}
.aclList > li:last-child:not(:first-child), .aclPermissionList > li:last-child:not(:first-child) {border-bottom-right-radius: 6px;border-bottom-left-radius: 6px;}
.aclList {margin-bottom: 7px;}
.aclList > li {cursor: pointer;}
.aclList > li:hover, .aclList > li.active:hover {background-color: #ffe5c8;}
.aclList > li.active {background-color: #f1f5fa;}
.aclList > li > span:last-child {float:left;margin-left: 7px;}
.aclPermissionList {margin-top: 7px;min-height: 200px;text-align:left;}
.aclPermissionList > li:hover {background-color: #ffe5c8;}
.aclPermissionList > li.aclCategory {background-color: #d8e7f5;padding: 4px 11px;text-align:right;}
.aclPermissionList > li.aclFullAccess {background-color: #f1f5fa;}
.aclPermissionList > li > span {float:right;padding-right: 7px;}
.aclPermissionList > li > label {cursor: pointer;margin: 0 7px;padding: 0 21px;}
.info, .error, .success, .warning {border-width: 1px;border-style: solid;line-height: 1.5;margin-top: 14px;padding:11px 48px 11px 14px;position: relative;}
.info::after, .error::after, .success::after, .warning::after {font-family: FontAwesome;font-size: 28px;display: block;height: 32px;right: 13px;margin-top: -19px;position: absolute;top: 50%;width: 32px;}
.info a, .error a, .success a, .warning a {text-decoration: underline;}
@media only screen and (max-width: 800px) {
.info, .error, .success, .warning {margin-right: 7px;margin-left: 7px;padding: 4px 7px;}
.info::after, .error::after, .success::after, .warning::after {display: none;}
}
.error > .fa-times, .notice > .fa-times {float:left;}
.info {background-color: #4674a4;border-color: #304d77;color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.info::after {content: "\f05a";}
.info a, .info a:hover {color: #ffffff;}
.info .icon {color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.success {background-color: #74a446;border-color: #4d7730;color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.success::after {content: "\f058";}
.success a, .success a:hover {color: #ffffff;}
.success .icon {color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.warning {background-color: #efcb50;border-color: #e9bf2b;color: #000000;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.warning::after {content: "\f071";}
.warning a, .warning a:hover {color: #000000;}
.warning .icon {color: #000000;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.error {background-color: #c95145;border-color: #913d37;color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.error::after {content: "\f05e";}
.error a, .error a:hover {color: #ffffff;}
.error .icon {color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.innerError {background-color: #c95145;border: 1px solid #913d37;color: #ffffff;display: table;line-height: 1.5;margin-top: 8px;padding: 2px 10px;position: relative;}
.innerError::after {border: 7px solid transparent;border-bottom-color: #913d37;border-top-width: 0;content: "";display: inline-block;right: 9px;position: absolute;top: -7px;z-index: 100;}
.innerError::before {border: 6px solid transparent;border-bottom-color: #c95145;border-top-width: 0;content: "";display: inline-block;right: 10px;position: absolute;top: -6px;z-index: 101;}
.attachmentThumbnailList, .attachmentFileList {padding-top: 7px !important;}
.attachmentThumbnailList > fieldset, .attachmentFileList > fieldset {padding: 0;}
.attachmentThumbnailList > fieldset > legend, .attachmentFileList > fieldset > legend {border-bottom: 0;font-size: 1.2rem;padding-bottom: 7px;}
.attachmentThumbnailList {padding-bottom: 7px !important;}
.attachmentThumbnailList > fieldset > ul {padding:0 4px 0 11px;}
.attachmentThumbnailList > fieldset > ul > li {margin:0 7px 14px 0;vertical-align: top;}
.attachmentFileList > fieldset > ul > li:not(:first-child) {margin-top: 4px;}
.attachmentThumbnail {background-color: white;display: inline-block;min-height: 210px;min-width: 280px;position: relative;}
.attachmentThumbnail > a {display: inline-block;min-height: 210px;min-width: 280px;}
.attachmentThumbnail > div {background-color: rgba(0,0,0,0.6);bottom: 0;color: #fff;position: absolute;width: 100%;padding: 7px 0;}
.attachmentThumbnail > div > p, .attachmentThumbnail > div > small {margin: 0 7px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.attachmentThumbnail > div > small {display: block;height: 0;-webkit-transition-property: height;transition-property: height;-webkit-transition-duration: .25s;transition-duration: .25s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.attachmentThumbnail:hover > div > small {height: 1.27em;}
.formAttachmentList {border-bottom: 1px solid #cccccc;margin-bottom: 7px;padding-bottom: 7px;}
.formAttachmentList > li {margin-bottom: 7px;}
.formAttachmentList > li > div > div {margin-left: 7px;}
.formAttachmentList > li > div > div > p {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.formAttachmentList > li > div > div > p > a {display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.formAttachmentList > li > div > ul {margin-top: 7px;}
.formAttachmentList > li > div > ul > li {display: inline-block;}
.formAttachmentList.sortableList {list-style-type: none;margin-right: 0;}
.formAttachmentContent .jsButtonAttachmentInsertAll {vertical-align: baseline;}
.formAttachmentContent .uploadButton {vertical-align: bottom;}
.formAttachmentContent > dl div + small {margin-top: 7px !important;}
@media only screen and (min-width: 801px) {
.formAttachmentList > li {float:right;width: 50%;}
}
.box48 .attachmentTinyThumbnail {max-height: 48px;max-width: 48px;}
.box64 .attachmentTinyThumbnail {max-height: 64px;max-width: 64px;}
.embeddedAttachmentLink, .embeddedImageLink {display: inline-block;max-width: 100%;min-height: 48px;position: relative;}
.embeddedAttachmentLink::after, .embeddedImageLink::after {background-color: rgba(0,0,0,0.8);border-radius: 2px;bottom: 7px;color: white;content: "\f002";display: block;font-family: FontAwesome;font-size: 21px;opacity: .5;padding: 2px 8px;position: absolute;left: 7px;text-decoration: none;box-shadow:  -0 0 0 3px rgba(0,0,0,0.15);-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.embeddedAttachmentLink:hover::after, .embeddedImageLink:hover::after {opacity: .8;}
.codeBox {background-color: #ffffff;clear: both;margin: 11px 0;}
.codeBox > div {padding:14px 14px 14px 21px;box-shadow: inset -4em 0 0  #fcfdfe , inset 4.1em 0 0 #e6e6e6;}
.codeBox > div > div {margin:0 3.4em 7px 0;}
.codeBox > div > div > h3 {font-size: 1.2rem;font-weight: bold;padding-right: 7px;position: relative;}
.codeBox > div > div > h3 > span.icon {position: absolute;left: 0;top: 3px;}
.codeBox > div > ol {list-style-type: decimal;margin-right: 3.4em;}
.codeBox > div > ol > li {font-family: Consolas, 'Courier New', monospace;margin: 0;padding-right: 7px;position: relative;white-space: pre-wrap;word-break: break-all;word-wrap: break-word;}
.codeBox > div > ol > li > .lineAnchor {display: block;height: 1.4em;right: -3.6em;position: absolute;top: 0;width: 3.0em;}
.codeBox > div > ol > li:target {background-color: #ffff66;}
.codeBox.minimized {max-height: 200px;overflow: hidden;position: relative;}
.codeBox.minimized > .codeBoxExpand {background-color: #fcfdfe;border-top: 1px solid #cccccc;bottom: 0;cursor: pointer;display: block;height: 20px;right: 0;padding: 4px;position: absolute;left: 0;text-align: center;box-shadow:  -0 -10px 25px 5px #fcfdfe;}
html[dir='rtl'] .codeBox > div {box-shadow: inset 4em 0 0  #fcfdfe , inset -4.1em 0 0 #e6e6e6;}
@media only screen and (max-width: 800px) {
.codeBox > div {padding: 7px;box-shadow:  -0 0 5px 0 transparent;}
.codeBox > div > div {margin-right: 0;}
.codeBox > div > div > h3 {padding-right: 0;}
.codeBox > div > ol {list-style-type: none;margin-right: 0;overflow: auto;}
.codeBox > div > ol > li {padding-right: 0;white-space: pre;word-wrap: normal;}
}
.codeBox .hlQuotes {color: red;}
.codeBox .hlComments, .codeBox .hlOperators {color: green;}
.codeBox .hlKeywords1 {color: blue;}
.codeBox .hlKeywords2 {color: darkred;}
.codeBox .hlKeywords3 {color: darkviolet;}
.codeBox .hlKeywords4 {color: darkgoldenrod;}
.codeBox .hlKeywords5 {color: crimson;}
.codeBox .hlNumbers {color: darkorange;}
.diffHighlighter .hlComments {color: darkviolet;}
.diffHighlighter .hlRemoved {color: red;}
.diffHighlighter .hlAdded {color: green;}
.phpHighlighter .hlKeywords2 {color: green;}
.phpHighlighter .hlComments {color: darkgoldenrod;}
.cssHighlighter .hlComments {color: #236e26;}
.cssHighlighter .hlColors {color: #751116;}
.cssHighlighter .hlNumbers, .sqlHighlighter .hlNumbers {color: #1906fd;}
.cssHighlighter .hlKeywords1 {color: #87154f;}
.cssHighlighter .hlKeywords2 {color: #994509;}
.cssHighlighter .hlKeywords3, .cssHighlighter .hlKeywords4 {color: inherit;}
.sqlHighlighter .hlKeywords1 {color: #663821;}
.sqlHighlighter .hlKeywords2 {color: #871550;}
.quoteBox {min-height: 28px;position: relative;}
.quoteBox::before, .quoteBox::after {display: table;content: "";}
.quoteBox::after {clear: both;}
.quoteBox.quoteBoxSimple {clear: both;margin: 11px 0;padding-right: 54px;}
.quoteBox.container {background-color: #ffffff;}
.quoteBox > header {padding-bottom: 4px;border-bottom: 1px dotted #cccccc;margin-bottom: 7px;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.quoteBox > header > h3 {font-weight: bold;}
.quoteBox > div:first-of-type::before {content: "\f10d";color: #808080;font-family: FontAwesome;font-size: 28px;position: absolute;right: 14px;top: 7px;}
.quoteBox .quoteBox {margin-right: 0;padding-right: 21px;min-height: 0;}
.quoteBox .quoteBox > div:first-of-type::before {display: none;}
.quoteBoxAuthor {clear: both;margin: 11px 0;position: relative;}
.quoteBoxAuthor::before, .quoteBoxAuthor::after {display: table;content: "";}
.quoteBoxAuthor::after {clear: both;}
.quoteBoxAuthor > .quoteAuthorAvatar {float:right;}
.quoteBoxAuthor > .quoteAuthorAvatar::before, .quoteBoxAuthor > .quoteAuthorAvatar::after {border-style:inset none inset solid;border-width: 15px;content: "";display: block;height: 0;position: absolute;top: 15px;width: 0;}
.quoteBoxAuthor > .quoteAuthorAvatar::before {border-color:transparent transparent transparent #cccccc;right: 75px;z-index: 100;}
.quoteBoxAuthor > .quoteAuthorAvatar::after {border-color:transparent transparent transparent #ffffff;right: 76px;z-index: 101;}
.quoteBoxAuthor > .quoteAuthorAvatar + .quoteBox {margin-right: 90px;padding-right: 21px;}
.quoteBoxAuthor > .quoteAuthorAvatar + .quoteBox > div:first-of-type::before {display: none;}
.quoteBoxAuthor > .quoteAuthorAvatar > a {display: inline-block;}
.quoteBoxAuthor .quoteBoxAuthor > .quoteAuthorAvatar {display: none;}
.quoteBoxAuthor .quoteBoxAuthor > .quoteAuthorAvatar + .quoteBox {margin-right: 0;}
@media only screen and (max-width: 800px) {
.quoteBoxAuthor > .quoteAuthorAvatar {display: none;}
.quoteBox {margin-right: 0 !important;padding-right: 28px !important;}
.quoteBox > div:first-of-type::before {display: block !important;font-size: 14px;right: 7px;}
.quoteBox .quoteBox {padding-right: 7px !important;}
.quoteBox .quoteBox > div:first-of-type::before {display: none !important;}
}
.spoilerBox {background-color: #ffffff;clear: both;font-size: 1rem;padding-bottom: 7px;}
.spoilerBox > header {margin-bottom: 7px;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.spoilerBox > div {overflow: hidden;padding-bottom: 7px;}
.inlineCode {background-color: #ffffff;border: 1px solid #cccccc;border-radius: 3px;display: inline-block;font-family: Consolas, 'Courier New', monospace;margin: 0 2px;padding: 0 5px;word-break: break-all;word-wrap: break-word;}
ul.smileyList > li {display: inline;}
.bbcodeTable {display: inline-block;}
@media screen and (max-width: 800px) {
.bbcodeTable {display: block;}
}
.gist .highlight {background-color: inherit;}
button, input[type='reset'], input[type='submit'], input[type='button'], .button {border-radius: 15px;border-style: solid;border-width: 1px;cursor: pointer;display: inline-block;margin: 0 4px;padding: 5px 13px;position: relative;}
.button, input[type='reset']:not([disabled]), input[type='submit']:not([disabled]), input[type='button']:not([disabled]), button:not([disabled]) {background-color: #e3e3e3;border-color: #bbbbbb;color: #999999;text-decoration: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button.buttonPrimary, input[type='submit']:not([disabled]), input[type='button']:not([disabled]).buttonPrimary, button:not([disabled]).buttonPrimary {background-color: #d8e7f5;border-color: #6699cc;color: #6699cc;font-weight: bold;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button.buttonPrimary .icon, input[type='submit']:not([disabled]) .icon, input[type='button']:not([disabled]).buttonPrimary .icon, button:not([disabled]).buttonPrimary .icon {color: #6699cc;}
.button:hover, input[type='reset']:not([disabled]):hover, input[type='submit']:not([disabled]):hover, input[type='button']:not([disabled]):hover, button:not([disabled]):hover {background-color: #ffe5c8;border-color: #ffaa22;color: #666666;text-decoration: none;z-index: 100;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button:hover .icon, input[type='reset']:not([disabled]):hover .icon, input[type='submit']:not([disabled]):hover .icon, input[type='button']:not([disabled]):hover .icon, button:not([disabled]):hover .icon {color: #666666;}
.button.buttonPrimary:hover, input[type='submit']:not([disabled]):hover, input[type='button']:not([disabled]).buttonPrimary:hover, button:not([disabled]).buttonPrimary:hover {background-color: #cce0f2;border-color: #407fbf;color: #6699cc;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button.buttonPrimary:hover .icon, input[type='submit']:not([disabled]):hover .icon, input[type='button']:not([disabled]).buttonPrimary:hover .icon, button:not([disabled]).buttonPrimary:hover .icon {color: #6699cc;}
input[type='reset']:disabled, input[type='submit']:disabled, input[type='button']:disabled, button:disabled {background-color: #e3e3e3;border-color: #bbbbbb;color: #b3b3b3;cursor: not-allowed;text-decoration: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button.active, input[type='button'].active, button.active, .button.active:hover, input[type='button'].active:hover, button.active:hover {background-color: #999999;border-color: #8c8c8c;color: #e3e3e3;box-shadow: inset -0 1px 1px 0 rgba(0,0,0,0.1);text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.button.active .icon, input[type='button'].active .icon, button.active .icon, .button.active:hover .icon, input[type='button'].active:hover .icon, button.active:hover .icon {color: #e3e3e3;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
button.small, .button.small {border-radius: 3px;font-size: .85rem;min-height: 13px;padding: 4px 9px;margin: 0 2px;}
.buttonList {font-size: 0;margin-bottom: -7px;}
.buttonList > li {display: inline-block;font-size: 1rem;margin-bottom: 7px;}
.buttonList > li:not(:last-child) {margin-left: 8px;}
.buttonList > li .button {margin-right: 0;margin-left: 0;}
.buttonList.smallButtons > li:not(:last-child) {margin-left: 4px;}
.buttonList.iconList > li:not(:last-child) {margin-left: 2px;}
.buttonGroup {font-size: 0;}
.buttonGroup > li {font-size: 1rem;display: inline-block;}
.buttonGroup > li.likeButton {display: inline-block !important;}
.buttonGroup > li > .button {border-radius: 0;margin:0 -1px 0 0;}
.buttonGroup > li:first-child > .button:not(.small) {border-top-right-radius: 15px;border-bottom-right-radius: 15px;}
.buttonGroup > li:first-child > .button.small {border-top-right-radius: 3px;border-bottom-right-radius: 3px;}
.buttonGroup > li:last-child > .button:not(.small) {border-top-left-radius: 15px;border-bottom-left-radius: 15px;}
.buttonGroup > li:last-child > .button.small {border-top-left-radius: 3px;border-bottom-left-radius: 3px;}
.smallButtons > li {font-size: .85rem;}
nav.buttonGroupNavigation > a.dropdownLabel {display: none;}
@media only screen and (max-width: 800px) {
nav.buttonGroupNavigation > a.dropdownLabel {display: inline-block;outline: 0;}
nav.buttonGroupNavigation > a.dropdownLabel span.icon {font-size: 21px;height: 24px;width: 24px;}
nav.buttonGroupNavigation > ul {display: none;font-size: 0;position: absolute;left: -3px;top: 24px;z-index: 450;}
nav.buttonGroupNavigation > ul.open {display: block;}
nav.buttonGroupNavigation > ul.buttonGroup > li > .button {margin: 0;}
nav.buttonGroupNavigation > ul > li {display: block;float: none;font-size: 0 !important;margin-bottom: 0;opacity: 1 !important;overflow: hidden;}
nav.buttonGroupNavigation > ul > li:not(:last-child) > a {border-bottom-width: 0;}
nav.buttonGroupNavigation > ul > li > a {font-weight: bold;border-color: #cdcdcd #bbbbbb #a9a9a9;box-shadow:  -0 1px 3px 0 rgba(0,0,0,0.1);background-color: #f0f0f0;background-image: -webkit-linear-gradient(90deg,#fcfcfc,#f0f0f0 2px,#e3e3e3);background-image: linear-gradient(180deg,#fcfcfc,#f0f0f0 2px,#e3e3e3);-webkit-transition-property: background-color, background-image, border, box-shadow, color;transition-property: background-color, background-image, border, box-shadow, color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;border-radius: 15px;border-style: solid;border-width: 1px;cursor: pointer;display: inline-block;margin: 0 4px;padding: 5px 13px;position: relative;background-color: #e3e3e3;border-color: #bbbbbb;color: #999999;text-decoration: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);border-radius: 0 !important;font-size: .85rem;overflow: hidden;text-overflow: ellipsis;width: 124px;white-space: nowrap;word-wrap: normal;}
nav.buttonGroupNavigation > ul > li > a .icon {-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
nav.buttonGroupNavigation > ul > li > a > span.invisible {display: inline;}
}
.sidebar button, .sidebar input[type='reset'], .sidebar input[type='submit'], .sidebar input[type='button'], .sidebar .button {font-size: .85rem;padding: 5px 11px;}
.button > .icon {margin: -1px -5px;}
.button > .icon + span {margin-right: 6px;}
#colorPickerGradient {background-color: #f00;background-image: url('../images/colorPickerGradient.png');background-repeat: no-repeat;border: 1px solid #000000;cursor: default;display: inline-block;height: 256px;overflow: hidden;position: relative;width: 256px;}
#colorPickerGradient > span {border: 1px solid #000000;border-radius: 10px;display: block;height: 10px;right: -4px;position: absolute;top: -4px;width: 10px;}
#colorPickerGradient > span > span {border: 1px solid #ffffff;border-radius: 10px;display: block;height: 8px;width: 8px;}
#colorPickerBar {background-image: url('../images/colorPickerBar.png');background-repeat: repeat-x;border: 1px solid #000000;cursor: default;display: inline-block;height: 256px;margin-right: 10px;position: relative;width: 16px;}
#colorPickerBar > span {display: inline-block;height: 1px;right: 0;position: absolute;top: 27px;width: 16px;}
#colorPickerBar > span::after, #colorPickerBar > span::before {content: "";display: block;height: 0;position: absolute;top: 0;width: 0;}
#colorPickerBar > span::after {border-bottom: 5px solid transparent;border-left: 5px solid #000000;border-top: 5px solid transparent;left: -7px;top: -5px;}
#colorPickerBar > span::before {border-bottom: 5px solid transparent;border-right: 5px solid #000000;border-top: 5px solid transparent;right: -7px;top: -5px;}
#colorPickerForm {display: inline-block;margin-right: 20px;position: relative;text-align: center;width: 100px;}
#colorPickerForm > .colors {margin-right: 2px;}
#colorPickerForm > .colors > .new, #colorPickerForm > .colors > .old {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC);border: 1px solid #000000;display: block;height: 24px;}
#colorPickerForm > .colors > .new > span, #colorPickerForm > .colors > .old > span {display: block;height: 24px;}
#colorPickerForm > .colors > .old {background-position: 8px 0;border-top-width: 0;}
#colorPickerForm > .hex {margin-top: 21px;}
#colorPickerForm > .rgba {margin-top: 21px;}
#colorPickerForm > .rgba > li.a {margin-top: 7px;}
#colorPickerForm > .rgba > li.g, #colorPickerForm > .rgba > li.b {margin-top: 2px;}
#colorPickerForm > .rgba > li, #colorPickerForm > .hex > li {text-align:left;}
#colorPickerForm > .rgba > li input, #colorPickerForm > .hex > li input {margin-right: 7px;width: 80px;}
.comment, .commentResponse {position: relative;}
.commentList .buttonGroupNavigation {position: absolute;top: 4px;left: 14px;}
.commentList .buttonGroupNavigation > ul > li {float:right;opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.commentList .buttonGroupNavigation > ul > li > a {padding: 4px;}
.commentResponseList .buttonGroupNavigation {left: 7px;}
.commentContent:hover > .buttonGroupNavigation > ul > li {opacity: 1;}
.commentList textarea {line-height: 1.2em;min-height: 11px;max-height: 110px;}
.commentList textarea + button {margin-top: 4px;}
.commentResponse {border-top: 1px solid #cccccc;padding: 7px;}
.commentOptionContainer > ul {font-size: 0;}
.commentOptionContainer > ul > li {display: inline-block;font-size: .85rem;padding-left: 3px;}
.commentOptionContainer > ul > li:not(:last-child)::after {content: " - ";}
.commentOptionContainer.jsAddResponseActive, .commentResponseList:not(:empty) + .commentOptionContainer {border-top: 1px solid #cccccc;padding: 7px 7px 0;}
.commentResponseList:empty, .commentContent + .commentOptionContainer:not(.jsAddResponseActive) {margin-top: 4px;}
.commentContent + .commentOptionContainer.jsAddResponseActive {margin-top: 14px;}
.commentResponseList:not(:empty) {margin-top: 14px;}
.commentList > li:nth-child(2n) .commentResponseList .commentResponse:nth-child(2n+1) {background-color: #fcfdfe;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.commentList > li:nth-child(2n+1) .commentResponseList .commentResponse:nth-child(2n+1) {background-color: #f1f5fa;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.commentResponseList > li:hover {background-color: #d8e7f5 !important;}
.commentList > li:not(.commentAdd):hover {background-color: #fcfdfe;}
.commentList > li:not(.commentAdd):hover:nth-child(2n) {background-color: #f1f5fa;}
.commentList > .commentLoadNext {text-align: center;}
.commentList > .commentLoadNext > button {padding-right: 30px;padding-left: 30px;}
.commentList .userMessage {margin-top: 0;}
.commentResponseContent {position: relative;}
.commentList .likesBadge {display: inline-block;margin:-2px 4px -2px 0;}
@media only screen and (max-width: 800px) {
.commentList .buttonGroupNavigation {top: 1px;left: 7px;}
.commentResponseList .buttonGroupNavigation {left: 0;}
.commentList .containerHeadline > h3 {padding-left: 35px;}
.commentResponseContent > .containerHeadline > h3 {padding-left: 28px;}
}
.ui-datepicker {background-color: #ffffff;border: 1px solid #cccccc;color: #666666;margin-top: 7px;z-index: 450 !important;box-shadow:  -2px 2px 10px 0 rgba(0,0,0,0.2);}
.ui-datepicker::after {border: 7px solid transparent;border-bottom-color: #cccccc;border-top-width: 0;content: "";display: inline-block;right: 9px;position: absolute;top: -7px;z-index: 100;}
.ui-datepicker::before {border: 6px solid transparent;border-bottom-color: #ffffff;border-top-width: 0;content: "";display: inline-block;right: 10px;position: absolute;top: -6px;z-index: 101;}
.ui-datepicker a:hover {text-decoration: none;}
.ui-datepicker > .ui-datepicker-header {padding: 4px;text-align: center;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev, .ui-datepicker > .ui-datepicker-header > .ui-datepicker-next {display: inline-block;margin:2px 2px 0 2px;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev > span, .ui-datepicker > .ui-datepicker-header > .ui-datepicker-next > span {display: none;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev {float:right;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-prev::before {content: "\f060";font-family: FontAwesome;font-size: 14px;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-next {float:left;}
.ui-datepicker > .ui-datepicker-header > .ui-datepicker-next::before {content: "\f061";font-family: FontAwesome;font-size: 14px;}
.ui-datepicker > table {border-collapse: collapse;border-spacing: 0;width: 100%;}
.ui-datepicker > table > thead {background-color: #336699;}
.ui-datepicker > table > thead > tr > th {color: #ffffff;font-size: .85rem;padding: 5px 0;text-transform: uppercase;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.ui-datepicker > table > tbody > tr {border-bottom: 1px solid #cccccc;}
.ui-datepicker > table > tbody > tr:last-child {border-bottom: 0;}
.ui-datepicker > table > tbody > tr > td {border-left: 1px solid #cccccc;}
.ui-datepicker > table > tbody > tr > td:last-child {border-left: 0;}
.ui-datepicker > table > tbody > tr > td > span, .ui-datepicker > table > tbody > tr > td > a {display: inline-block;color: #666666;font-weight: bold;height: 30px;line-height: 30px;text-align: center;width: 30px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.ui-datepicker .ui-datepicker-calendar .ui-state-default {background-color: #f1f5fa;}
.ui-datepicker .ui-datepicker-unselectable .ui-state-default {background-color: #fcfdfe;color: #808080;}
.ui-datepicker .ui-datepicker-calendar .ui-state-hover {background-color: #d8e7f5;}
.ui-datepicker .ui-datepicker-calendar .ui-state-active {background-color: #d8e7f5;}
.ui-datepicker .ui-timepicker-div {border-top: 1px solid #cccccc;}
.ui-datepicker .ui-timepicker-div > dl > dt {margin-top: 4px !important;width: 100px;}
.ui-datepicker .ui-timepicker-div > dl > dd {margin-right: 120px;margin-top: 4px !important;}
.ui-datepicker.timeOnlyPicker .ui-timepicker-div {border-top: none;}
.ui-datepicker.timeOnlyPicker .ui-timepicker-div > .ui-widget-header {display: none;}
.ui-datepicker.timeOnlyPicker .ui-timepicker-div > dl {margin-left: 4px;}
.ui-datepicker.timeOnlyPicker .ui-timepicker-div > dl > dt {width: 70px;}
.ui-datepicker.timeOnlyPicker .ui-timepicker-div > dl > dd {margin-right: 90px;}
.dialogContainer {background: rgba(0,0,0,0.4);border: 14px solid transparent;border-radius: 15px;margin-right: auto;margin-left: auto;max-width: 90%;min-width: 500px;position: fixed;box-shadow:  -0 1px 23px 0 rgba(0,0,0,0.3);}
@media only screen and (max-width: 800px) {
.dialogContainer {border: 0;border-radius: 0;right: 0 !important;max-width: none;min-width: 0;position: absolute;top: 0 !important;width: 100%;}
}
.dialogTitlebar {background-color: #336699;border-bottom: 1px solid rgba(0,0,0,0.1);border-top-right-radius: 7px;border-top-left-radius: 7px;display: block;padding: 10px 20px;min-height: 27px;position: relative;}
.dialogTitlebar .dialogTitle {color: #ffffff;display: block;font-size: 1.7rem;font-weight: bold;margin-left: 28px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.dialogTitlebar .dialogCloseButton {color: #ffffff;cursor: pointer;display: inline-block;font-family: FontAwesome;font-size: 28px;height: 32px;position: absolute;left: 10px;text-align: center;text-decoration: none;top: 7px;width: 32px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.dialogTitlebar .dialogCloseButton::before {content: "\f057";}
.dialogTitlebar .dialogCloseButton span {display: none;}
@media only screen and (max-width: 800px) {
.dialogTitlebar {border-radius: 0;}
}
.dialogContent {background-color: #fcfdfe;color: #666666;padding: 10px 20px 20px;}
.dialogContent:not(.dialogForm) {border-bottom-right-radius: 7px;border-bottom-left-radius: 7px;}
.dialogContent > .icon-spinner {right: 50%;margin:-21px 0 0 -21px;padding:0 21px 0 21px;position: absolute;top: 50%;}
.dialogContent dl:not(.plain) > dt {width: 170px;}
.dialogContent dl:not(.plain) > dd {margin-right: 190px;}
.dialogContent .formSubmit {background-color: #f1f5fa;border-bottom-right-radius: 7px;border-bottom-left-radius: 7px;border-top: 1px solid #cccccc;bottom: 0;right: 0;padding: 10px 0;position: absolute;width: 100%;}
@media only screen and (max-width: 800px) {
.dialogContent {max-height: none !important;max-width: none !important;}
.dialogContent:not(.dialogForm) {border-radius: 0;}
.dialogContent .formSubmit {border-radius: 0;}
}
.dialogOverlay {background-color: rgba(0,0,0,0.5);bottom: 0;right: 0;position: fixed;left: 0;top: 0;}
#packageInstallationDialogContainer > .boxHeadline {margin-top: 0;}
.spinner {border: 1px solid rgba(0,0,0,0.3);border-radius: 6px;box-sizing: border-box;-moz-box-sizing: border-box;color: #fff;right: 50%;padding: 7px 0;position: fixed;text-align: center;top: 200px;z-index: 401;box-shadow:  -0 1px 7px 0 rgba(0,0,0,0.5);background-color: rgba(0,0,0,0.5);background-image: -webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.7));background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.7));}
.spinner > .icon {color: #fff;}
.spinner > span:not(.icon) {display: block;margin-top: 7px;}
.systemConfirmation p {padding-top: 7px;}
#systemNotification {right: 0;pointer-events: none;position: fixed;top: 0;width: 100%;z-index: 460;}
#systemNotification > p {border-top-right-radius: 0;border-top-left-radius: 0;border-top-width: 0;cursor: pointer;display: table;margin: 0 auto;max-width: 80%;pointer-events: auto;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.dropdown .dropdownToggle:active, .dropdown.dropdownOpen .dropdownToggle {outline: 0;}
.dropdown.preInput {display: table;width: 100%;}
.dropdown.preInput input {border-radius:3px 0 0 3px;display: table-cell;margin: 0;width: 99%;}
.dropdown.preInput textarea {border-radius: 0 3px 3px;display: block;margin-top: 0;}
.dropdown.preInput .dropdownCaption {cursor: pointer;display: table-cell;letter-spacing: -1px;padding:0 4px 0 7px;vertical-align: middle;width: 1%;}
.dropdown.preInput .dropdownCaption.button {border-left-width: 0;border-radius:0 3px 3px 0;}
.dropdown.preInput .dropdownCaption span {margin-left: -1px;padding-right: 4px;white-space: nowrap;word-wrap: normal;}
.dropdown.preInput .dropdownCaption span.active::after {content: "\f0d7";font-family: FontAwesome;font-size: 14px;margin-right: 7px;}
.dropdown.preInput .dropdownCaptionTextarea {cursor: pointer;margin:0 0 -1px 0;padding-right: 7px;padding-left: 7px;}
.dropdown.preInput .dropdownCaptionTextarea.button {border-radius:3px 3px 0 0;}
.dropdown.preInput .dropdownCaptionTextarea~ .dropdownMenu {top: 10%;}
.dropdown.preInput .dropdownCaptionTextarea span {white-space: nowrap;word-wrap: normal;}
.dropdown.preInput .dropdownCaptionTextarea span.active::after {content: "\f0d7";font-family: FontAwesome;font-size: 14px;margin-right: 7px;}
.dropdown.dropdownOpen .dropdownMenu {display: block;}
.dropdown .dropdownToggle {cursor: pointer;}
.dropdownMenu {background-color: #ffffff;border: 1px solid #cccccc;color: #666666;display: none;float:right;min-width: 160px;padding: 4px 0;position: absolute;text-align:right;z-index: 450;box-shadow:  -2px 2px 10px 0 rgba(0,0,0,0.2);}
.dropdownMenu::after {border: 7px solid transparent;border-bottom-color: #cccccc;border-top-width: 0;content: "";display: inline-block;right: 9px;position: absolute;top: -7px;z-index: 100;}
.dropdownMenu::before {border: 6px solid transparent;border-bottom-color: #ffffff;border-top-width: 0;content: "";display: inline-block;right: 10px;position: absolute;top: -6px;z-index: 101;}
.dropdownMenu.dropdownArrowRight::after {right: auto;left: 9px;}
.dropdownMenu.dropdownArrowRight::before {right: auto;left: 10px;}
.dropdownMenu.dropdownArrowBottom::after {border: 7px transparent solid;border-top-color: #cccccc;border-bottom-width: 0;bottom: -7px;top: auto;}
.dropdownMenu.dropdownArrowBottom::before {border: 6px transparent solid;border-top-color: #ffffff;border-bottom-width: 0;bottom: -6px;top: auto;}
.dropdownMenu.dropdownOpen {display: block;}
.dropdownMenu li {display: block;}
.dropdownMenu li:hover:not(.dropdownDivider):not(.dropdownList):not(.dropdownText), .dropdownMenu li.dropdownList > li:hover:not(.dropdownDivider), .dropdownMenu li.dropdownNavigationItem, .dropdownMenu li.active {background-color: #d8e7f5;}
.dropdownMenu li.dropdownDivider {border-top: 1px dotted #cccccc;margin: 4px;}
.dropdownMenu li.dropdownText {font-size: .85rem;padding: 4px 14px;}
.dropdownMenu li.boxFlag {padding-top: 2px;}
.dropdownMenu li > a, .dropdownMenu li > span {clear: both;color: #666666;cursor: pointer;display: block;max-width: 350px;overflow: hidden;padding: 4px 14px;text-decoration: none;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.dropdownMenu li > a:hover, .dropdownMenu li > span:hover {color: #666666;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.dropdownMenu li > a > div > h3, .dropdownMenu li > span > div > h3 {overflow: hidden;text-overflow: ellipsis;}
.dropdownMenu li > a > small {display: block;}
.dropdownMenu li > a + span.badge {display: none;}
.dropdownMenu li > .box16 {cursor: pointer;min-height: 0;padding:4px 7px 4px 4px;}
.dropdownMenu li > .box16 > div {margin-right: 21px;}
.dropdownMenu li > label {display: block;}
.dropdownMenu li .containerHeadline {margin-bottom: 0;}
.dropdownMenu li .containerHeadline > p {font-size: .85rem;}
.dropdownMenu .scrollableDropdownMenu {max-height: 300px;overflow: auto;}
.boxFlag > .box24, .boxFlag.box24 {min-height: 20px;}
@media only screen and (max-width: 800px) {
.dropdownMenu {right: 0 !important;left: 0 !important;}
.dropdownMenu li {overflow: hidden;}
.dropdownMenu li > a, .dropdownMenu li > span {max-width: none;white-space: normal;}
}
.interactiveDropdown {background-color: #f1f5fa;border: 1px solid #cccccc;color: #666666;display: block;position: absolute;z-index: 450;box-shadow:  -0 3px 8px 0 rgba(0,0,0,0.25);}
.interactiveDropdown:not(.open) {display: none !important;}
.interactiveDropdown > .interactiveDropdownHeader {padding: 7px 11px;}
.interactiveDropdown > .interactiveDropdownHeader > .interactiveDropdownTitle {font-weight: bold;}
.interactiveDropdown > .interactiveDropdownHeader > .interactiveDropdownLinks {float:left;}
.interactiveDropdown > .interactiveDropdownHeader > .interactiveDropdownLinks > li {display: inline-block;margin-right: 11px;}
.interactiveDropdown > .interactiveDropdownHeader:after {clear: both;}
.interactiveDropdown > .interactiveDropdownItemsContainer {border: 1px solid #cccccc;border-width: 1px 0;max-height: 300px;}
.interactiveDropdown > .interactiveDropdownItemsContainer.ps-container > .interactiveDropdownItems {position: relative;z-index: 100;}
.interactiveDropdown > .interactiveDropdownItemsContainer.ps-container > .ps-scrollbar-y-rail {z-index: 200;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li {background-color: #ffffff;-webkit-transition-property: background-color, background-position;transition-property: background-color, background-position;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.loading, .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.noItems {font-size: 1.2rem;padding: 21px 14px;text-align: center;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems) {overflow: hidden;padding: 7px 11px;position: relative;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems):not(:last-child) {border-bottom: 1px solid #cccccc;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems):hover {background-color: #d8e7f5;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemOutstanding {background-color: #d8e7f5;background-repeat: no-repeat;background-size: 200%;background-image: -webkit-linear-gradient(to left, #d8e7f5 50%, #ffffff 100%);background-image: linear-gradient(to left, #d8e7f5 50%, #ffffff 100%);}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemOutstanding:hover {background-position:0%;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemOutstandingIcon > div.box32 {padding-left: 27px;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).notificationItem .userLink {font-weight: bold;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .box32 {position: relative;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .box32, .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .interactiveDropdownItemMarkAsRead {pointer-events: none;z-index: 20;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .box32 a, .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .interactiveDropdownItemMarkAsRead a {pointer-events: all;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemShadow > .interactiveDropdownItemShadowLink {bottom: 0;right: 0;position: absolute;left: 0;top: 0;z-index: 10;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).groupedNotificationItem > .box32 > .framed > span.fa-users:before {position: relative;top: 3px;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li.dropdownDivider {padding: 0 !important;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li:not(.dropdownDivider) {border-bottom-width: 0 !important;padding: 11px;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li > .box32 > .containerHeadline > h3 {font-size: 1.1rem;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li > .box64 {position: relative;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li > .box64 > .containerHeadline > .interactiveDropdownUserMenuLinkList {bottom: 0;position: absolute;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li .interactiveDropdownUserMenuLinkList > li {display: inline-block;font-size: .85rem;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li .interactiveDropdownUserMenuLinkList > li:after {content: " \2013 ";}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems.interactiveDropdownItemsUserMenu > li .interactiveDropdownUserMenuLinkList > li:last-child:after {content: "";}
.interactiveDropdown > .interactiveDropdownShowAll {display: block;padding: 7px 11px;text-align: center;}
.interactiveDropdown > .pointer {border: 10px solid transparent;border-bottom-color: #cccccc;border-top-width: 0;content: "";display: inline-block;position: absolute;top: -10px;z-index: 100;}
.interactiveDropdown > .pointer > span {border: 8px solid transparent;border-bottom-color: #f1f5fa;border-top-width: 0;content: "";display: inline-block;right: -8px;position: absolute;top: 2px;z-index: 101;}
.interactiveDropdown.interactiveDropdownUserMenu > .interactiveDropdownItemsContainer {overflow: visible;max-height: none;}
.interactiveDropdown.interactiveDropdownUserMenu > .pointer {border-width:0 7px 7px 7px;top: -7px;}
.interactiveDropdown.interactiveDropdownUserMenu > .pointer > span {border-width:0 5px 5px 5px;right: -5px;}
@media only screen and (min-width: 801px) {
.interactiveDropdown {min-width: 350px;}
.interactiveDropdown > .interactiveDropdownItemsContainer {overflow: hidden;position: relative;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading) {max-width: 400px;box-sizing: border-box;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading).interactiveDropdownItemOutstandingIcon > div.interactiveDropdownItemMarkAsRead {opacity: .6;position: absolute;left: 11px;top: 50%;transform: translateY(-50%);-ms-transform: translateY(-50%);-webkit-transform: translateY(-50%);-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading).interactiveDropdownItemOutstandingIcon:hover > div.interactiveDropdownItemMarkAsRead {opacity: 1;}
}
@media only screen and (max-width: 800px) {
.interactiveDropdown {border-width: 1px 0;box-sizing: border-box;right: 0 !important;left: 0 !important;width: 100%;}
.interactiveDropdown > .interactiveDropdownItemsContainer {overflow-x: auto;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.interactiveDropdownItemOutstandingIcon > div.interactiveDropdownItemMarkAsRead {bottom: 0;position: absolute;left: 0;top: 0;width: 38px;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.interactiveDropdownItemOutstandingIcon > div.interactiveDropdownItemMarkAsRead > a {display: block;height: 100%;text-align: center;}
.interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.interactiveDropdownItemOutstandingIcon > div.interactiveDropdownItemMarkAsRead > a > .icon {position: relative;top: 50%;transform: translateY(-50%);-ms-transform: translateY(-50%);-webkit-transform: translateY(-50%);}
}
fieldset {padding-top: 14px;}
fieldset > legend {border-bottom: 1px solid #cccccc;color: #808080;font-family: "Trebuchet MS", Arial, sans-serif;font-size: 1.4rem;font-weight: bold;width: 100%;padding-bottom: 4px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
fieldset > legend + small {display: inline-block;margin-bottom: 4px;position: relative;top: -7px;}
fieldset > dl:not(:first-of-type) {margin-top: 11px;}
fieldset:not(:first-of-type) {margin-top: 14px;}
dl:not(.plain) {position: relative;}
dl:not(.plain)::before, dl:not(.plain)::after {display: table;content: "";}
dl:not(.plain)::after {clear: both;}
dl:not(.plain) > dd:not(:first-of-type), dl:not(.plain) > dt:not(:first-of-type) {margin-top: 11px;}
dl:not(.plain) > dt {color: #336699;float:right;text-align:left;width: 230px;}
dl:not(.plain) > dt > label {display: block;}
dl:not(.plain) > dt.reversed {right: 270px;margin-top: 2px;position: absolute;text-align:right;white-space: nowrap;width: auto;word-wrap: normal;left: 0;}
dl:not(.plain) > dt.reversed ~ dd > input[type='checkbox'], dl:not(.plain) > dt.reversed ~ dd > input[type='radio'] {margin-right: 0;}
dl:not(.plain) > dt.reversed > label {overflow: hidden;text-overflow: ellipsis;}
dl:not(.plain) > dd {margin-right: 250px;}
dl:not(.plain) > dd > small:not(.innerError) {color: #808080;display: block;margin-top: 3px;}
dl:not(.plain) > dd > label {color: #336699;display: block;}
dl:not(.plain) > dd > label > input[type='checkbox'], dl:not(.plain) > dd > label > input[type='radio'] {margin:2px 0 2px 2px;}
dl:not(.plain) > dd > input[type='checkbox'] ~ small, dl:not(.plain) > dd > input[type='radio'] ~ small {margin-right: 21px;margin-top: 2px;}
dl:not(.plain) > dd:not(.floated) > label ~ small {margin-right: 21px;}
dl:not(.plain) > dd.floated > label {display: inline-block;margin-left: 7px;}
dl:not(.plain) > dd > input + label, dl:not(.plain) > dd textarea + label, dl:not(.plain) > dd select + label {margin-top: 2px;}
dl:not(.plain) > dd > .innerError + label {margin-top: 2px;}
dl:not(.plain) > dd:after {clear:right;content: "";display: block;}
dl:not(.plain).wide > dt {display: none;}
dl:not(.plain).wide > dd {margin-right: 0;}
dl:not(.plain).disabled > dt, dl:not(.plain).disabled > dd > label {color: #808080;}
dl:not(.plain).condensed > dt {float: none;margin-bottom: 4px;text-align:right;width: auto !important;}
dl:not(.plain).condensed > dt:empty {margin-bottom: 0;}
dl:not(.plain).condensed > dd {margin-right: 0 !important;}
@media only screen and (max-width: 1024px) {
dl:not(.plain) > dt {float: none;margin-bottom: 4px;text-align:right;width: auto !important;}
dl:not(.plain) > dt.reversed {right: 20px;}
dl:not(.plain) > dd {margin-right: 0 !important;}
fieldset > dl:not(:first-of-type) {margin-top: 14px;}
}
.sidebar dl:not(.plain):not(:last-child) {margin-bottom: 14px;}
.sidebar dl:not(.plain) > dt {text-align:right;float: none;width: auto;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.sidebar dl:not(.plain) > dd {margin-top: 2px;margin-right: 0;}
.formSubmit {font-size: 0;margin-top: 14px;text-align: center;}
.formSubmit button, .formSubmit input[type='reset'], .formSubmit input[type='submit'], .formSubmit input[type='button'], .formSubmit .button {font-size: 1rem;}
button, input[type='reset'], input[type='submit'], input[type='button'], input[type='checkbox'], input[type='radio'], select:not([multiple]) {cursor: pointer;}
input[type='text'], input[type='search'], input[type='date'], input[type='email'], input[type='number'], input[type='url'], input[type='password'], textarea, select[multiple] {box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;border-radius: 3px;font-family: "Trebuchet MS", Arial, sans-serif;padding: 4px 3px;margin: 0;}
select {margin: 0;max-width: 100%;min-width: 1px;padding: 3px;}
input[type='number'] {text-align:left;}
textarea {font-size: 1rem;}
input[type='text'], input[type='search'], input[type='date'], input[type='datetime'], input[type='email'], input[type='number'], input[type='url'], input[type='password'], textarea, select[multiple] {background-color: #ffffff;border-color: #cccccc;border-style: solid;border-width: 1px;color: #666666;}
input[type='text']::-webkit-input-placeholder, input[type='search']::-webkit-input-placeholder, input[type='date']::-webkit-input-placeholder, input[type='datetime']::-webkit-input-placeholder, input[type='email']::-webkit-input-placeholder, input[type='number']::-webkit-input-placeholder, input[type='url']::-webkit-input-placeholder, input[type='password']::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select[multiple]::-webkit-input-placeholder {color: #999999;}
input[type='text']::-moz-placeholder, input[type='search']::-moz-placeholder, input[type='date']::-moz-placeholder, input[type='datetime']::-moz-placeholder, input[type='email']::-moz-placeholder, input[type='number']::-moz-placeholder, input[type='url']::-moz-placeholder, input[type='password']::-moz-placeholder, textarea::-moz-placeholder, select[multiple]::-moz-placeholder {color: #999999;}
input[type='text']:-ms-input-placeholder, input[type='search']:-ms-input-placeholder, input[type='date']:-ms-input-placeholder, input[type='datetime']:-ms-input-placeholder, input[type='email']:-ms-input-placeholder, input[type='number']:-ms-input-placeholder, input[type='url']:-ms-input-placeholder, input[type='password']:-ms-input-placeholder, textarea:-ms-input-placeholder, select[multiple]:-ms-input-placeholder {color: #999999;}
input[type='text']:hover, input[type='search']:hover, input[type='date']:hover, input[type='datetime']:hover, input[type='email']:hover, input[type='number']:hover, input[type='url']:hover, input[type='password']:hover, textarea:hover, select[multiple]:hover {background-color: #fff9f4;border-color: #ffaa22;}
input[type='text']:active, input[type='search']:active, input[type='date']:active, input[type='datetime']:active, input[type='email']:active, input[type='number']:active, input[type='url']:active, input[type='password']:active, textarea:active, select[multiple]:active, input[type='text']:focus, input[type='search']:focus, input[type='date']:focus, input[type='datetime']:focus, input[type='email']:focus, input[type='number']:focusinput[type='url']:focus, input[type='password']:focus, textarea:focus, select[multiple]:focus {background-color: #fff9f4;border-color: #ffaa22;outline: 0;}
input[type='text'][readonly], input[type='search'][readonly], input[type='email'][readonly], input[type='number'][readonly], input[type='date'][readonly], input[type='datetime'][readonly], input[type='url'][readonly], input[type='password'][readonly], textarea[readonly], select[multiple][readonly] {background-color: #f2f2f2;border-color: #cccccc;}
input[type='text'][disabled], input[type='search'][disabled], input[type='date'][disabled], input[type='datetime'][disabled], input[type='email'][disabled], input[type='number'][disabled], input[type='url'][disabled], input[type='password'][disabled], textarea[disabled], select[multiple][disabled] {background-color: #f2f2f2;border-color: #cccccc;color: #808080;cursor: not-allowed;opacity: 1;}
.formSuccess input[type='text'], .formSuccess input[type='search'], .formSuccess input[type='email'], .formSuccess input[type='number'], .formSuccess input[type='url'], .formSuccess input[type='password'], .formSuccess textarea {background-color: #74a446;border-color: #4d7730;}
.formError input[type='text'], .formError input[type='search'], .formError input[type='email'], .formError input[type='number'], .formError input[type='url'], .formError input[type='password'], .formError textarea {background-color: #c95145;border-color: #913d37;}
textarea {width: 100%;}
.tiny {width: 80px;}
.short {min-width: 80px;width: 10%;}
.medium {min-width: 150px;width: 30%;}
.long {min-width: 150px;width: 100%;}
@media only screen and (max-width: 800px) {
textarea {max-height: 160px;}
.medium {width: 100%;}
}
.uploadButton {cursor: pointer;display: inline-block;overflow: hidden;position: relative;}
.uploadButton input {cursor: pointer;left: 0;opacity: 0;padding: 4px 0;position: absolute;top: 0;}
.uploadButton, .uploadFallbackButton {margin-top: 7px;}
.structuredList {background-color: #fcfdfe;}
.structuredList li {padding: 4px 7px;text-align:left;}
.structuredList li:hover {background-color: #ffe5c8;}
.structuredList li:first-child {border-radius:6px 6px 0 0;}
.structuredList li:last-child {border-radius:0 0 6px 6px;}
.structuredList li.category {background-color: #e4eef8;}
.structuredList li.category:hover {background-color: #ffe5c8;}
.structuredList li span {float:right;}
.structuredList li label {cursor: pointer;margin: 0 7px;padding: 0 21px;}
.editableItemList ul li {cursor: pointer;margin-right: 4px;}
.editableItemList ul li:first-child {margin-right: 0;}
select > option {display: block !important;}
.reCaptcha input.marginTop {margin-top: 14px;}
@media only screen and (max-width: 800px) {
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .cke_editable, .redactor-editor {font-size: 16px;}
}
html, body {font-size: 11px;}
body {background-color: #254c73;color: #666666;font-family: "Trebuchet MS", Arial, sans-serif;line-height: 1.28;word-wrap: break-word;}
small {font-size: .85rem;}
img {vertical-align: middle;}
img.disabled {opacity: .3;}
a {color: #336699;cursor: pointer;text-decoration: none;}
a:hover {color: #003366;text-decoration: underline;}
a.externalURL::after {content: "\f08e";display: inline-block;font-family: FontAwesome !important;font-size: 14px !important;font-weight: normal !important;font-style: normal !important;margin-right: 4px;vertical-align: -1px;}
pre {word-wrap: normal;white-space: pre;}
.footerContent, .logo {color: #ffffff;}
.footerContent a, .logo a {color: #488ed4;}
.footerContent a:hover, .logo a:hover {color: #ffffff;}
.nativeList {margin: 1em 0;margin-right: 40px;}
.nativeList ul, .nativeList ol {margin-bottom: 0;margin-top: 0;}
.nativeList li {margin: 7px 0;}
ul.nativeList {list-style-type: disc;}
ol.nativeList {list-style-type: decimal;}
.htmlContent p {margin: 1em 0;}
.htmlContent h1 {font-size: 1.4rem;}
.htmlContent h2 {font-size: 1.2rem;}
.htmlContent h1, .htmlContent h2, .htmlContent h3, .htmlContent h4, .htmlContent h5, .htmlContent h6 {font-weight: bold;margin: 0.5em 0;}
.htmlContent ul, .htmlContent ol {margin: 1em 0;margin-right: 40px;}
.htmlContent ul ul, .htmlContent ul ol, .htmlContent ol ul, .htmlContent ol ol {margin-bottom: 0;margin-top: 0;}
.htmlContent ul li, .htmlContent ol li {margin: 7px 0;}
.htmlContent ul {list-style-type: disc;}
.htmlContent ol {list-style-type: decimal;}
.datetime {display: inline-block;}
body > iframe[src="about:blank"] {display: none;}
::selection {text-shadow:-0 1px 0 rgba(255,255,255,0.5) !important;color: #300;background-color: rgba(255,170,34,0.7);}
.invisible {display: none;}
.marginTopLarge {margin-top: 21px;}
.marginTop, .marginMedium {margin-top: 14px;}
.marginTopSmall {margin-top: 7px;}
.marginTopTiny {margin-top: 4px;}
.textLeft {text-align:right;}
.textCenter, .center {text-align: center;}
.textRight {text-align:left;}
.textJustify {text-align: justify;}
.pointer {cursor: pointer;}
.dimmed {color: #808080;}
.monospace {font-family: Consolas, 'Courier New', monospace !important;}
.iconFlag {background-color: #ffffff;border: 1px solid #cccccc;padding: 1px;height: 15px;width: 24px;}
.framed > canvas, .framed > img, .framed > .icon {background-color: #ffffff;border: 1px solid #cccccc;padding: 1px;}
.highlight {background-color: #ffff66;}
.grayscale {filter: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cfilter%20id%3D%22grayscale%22%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200%22%2F%3E%3C%2Ffilter%3E%3C%2Fsvg%3E#grayscale);filter: gray;-webkit-filter: grayscale(1);}
fieldset {min-width: 0;}
@-moz-document url-prefix() {fieldset {display: table-column;}
}
.balloonTooltip {background-color: rgba(0,0,0,0.8);border-radius: 6px;color: #ffffff;font-size: .85rem;max-width: 300px;padding: 5px 10px 7px;position: absolute;z-index: 800;box-shadow:  -0 3px 7px 0 rgba(0,0,0,0.3);}
.balloonTooltip .pointer {border-color: rgba(0,0,0,0.8) transparent;border-style: solid;border-width: 0 5px 5px;right: 50%;position: absolute;top: -5px;}
.balloonTooltip.inverse .pointer {border-width: 5px 5px 0;}
.popover {background-color: rgba(0,0,0,0.4);border-radius: 6px;padding: 7px;position: absolute;vertical-align: middle;width: 400px !important;z-index: 500;box-shadow:  -0 1px 7px 0 rgba(0,0,0,0.3);}
.popover > .icon-spinner {color: white;right: 50%;margin-right: -21px;margin-top: -21px;position: absolute;top: 50%;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.popover > .popoverContent {background-color: #fcfdfe;border-radius: 6px;color: #666666;max-height: 300px;min-height: 16px;opacity: 0;overflow: hidden;padding: 7px 14px;}
.popover::after {border: 10px solid transparent;content: "";display: inline-block;position: absolute;z-index: 100;}
.popover.top::after {border-bottom-width: 0;border-top-color: rgba(0,0,0,0.3);bottom: -10px;}
.popover.bottom::after {border-bottom-color: rgba(0,0,0,0.3);border-top-width: 0;top: -10px;}
.popover.left::after {right: 10px;}
.popover.right::after {left: 10px;}
.badge {background-color: #666666;border-radius: 9px;color: #ffffff;display: inline-block;font-size: .85rem;font-weight: bold;padding: 1px 6px 1px;position: relative;text-shadow: none !important;vertical-align: middle;white-space: nowrap;word-wrap: normal;}
.badge.label {border-radius: 4px;font-weight: normal;}
.badge.badgeUpdate {background-color: #336699;color: #ffffff;}
.badge.badgeInverse {background-color: #ffffff;color: #336699;}
.badge.green {background-color: #009900;color: #eeffee;}
.badge.red {background-color: #cc0000;color: #ffeeee;}
.badge.black {background-color: #333;color: #fff;}
.badge.brown {background-color: #c63;color: #fff;}
.badge.orange {background-color: #f90;color: #fff;}
.badge.yellow {background-color: #ff0;color: #333;}
.badge.blue {background-color: #369;color: #fff;}
.badge.purple {background-color: #c0f;color: #fff;}
.badge.pink {background-color: #f0c;color: #fff;}
a.badge:hover {color: #ffffff;text-decoration: none;}
a.badge:hover.black {background-color: #000;}
a.badge:hover.brown {background-color: #930;}
a.badge:hover.red {background-color: #900;}
a.badge:hover.orange {background-color: #f60;}
a.badge:hover.yellow {background-color: #cc0;}
a.badge:hover.green {background-color: #060;}
a.badge:hover.blue {background-color: #036;}
a.badge:hover.purple {background-color: #90c;}
a.badge:hover.pink {background-color: #c09;}
@media only screen and (max-width: 800px) {
html {caption-side: bottom;}
body {caption-side: top;}
}
@media only screen and (max-width: 800px) and (-webkit-min-device-pixel-ratio: 2) {
html {-webkit-text-size-adjust: 100%;}
}
.googleMap {height: 400px;}
.sidebarGoogleMap {height: 250px;}
.googleMapsCustomControlContainer {cursor: pointer !important;margin-top: 5px;}
.googleMapsCustomControlContainer .googleMapsCustomControl {-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;text-align: center;position: relative;color: #565656;font-size: 11px !important;background-color: #ffffff;padding: 1px 6px;border-radius: 3px;background-clip: padding-box;border: 1px solid rgba(0,0,0,0.14902);box-shadow: rgba(0,0,0,0.298039) 0px 1px 4px -1px;min-width: 29px;}
.googleMapsCustomControlContainer .googleMapsCustomControl:hover {background-color: #ebebeb;color: #000000;}
.googleMapsCustomControlContainer .googleMapsCustomControl.active {color: #000000;font-weight: 500;}
.googleMapsUseLocationSuggestionLink {font-size: .85rem;}
@font-face {font-family: 'FontAwesome';src: url('../font/getFont.php?type=eot&v=4.4.0');src: url('../font/getFont.php?type=eot&v=4.4.0#iefix') format('embedded-opentype'), url('../font/getFont.php?type=woff2&v=4.4.0') format('woff2'), url('../font/getFont.php?type=woff&v=4.4.0') format('woff'), url('../font/getFont.php?type=ttf&v=4.4.0') format('truetype');font-weight: normal;font-style: normal;}
.icon, .fa {color: #666666;display: inline-block;font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;line-height: 1em;text-align: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.icon.disabled, .fa.disabled {opacity: .3;}
.icon:hover, .fa:hover {text-decoration: none;}
.icon.green, .fa.green {color: #009900;}
.icon.red, .fa.red {color: #cc0000;}
.icon.black, .fa.black {color: #333;}
.icon.brown, .fa.brown {color: #c63;}
.icon.orange, .fa.orange {color: #f90;}
.icon.yellow, .fa.yellow {color: #ff0;}
.icon.blue, .fa.blue {color: #369;}
.icon.purple, .fa.purple {color: #c0f;}
.icon.pink, .fa.pink {color: #f0c;}
span.icon:not(.pointer):not(.disabled), span.fa:not(.pointer):not(.disabled) {cursor: default;}
a > span.icon:not(.pointer), a > span.fa:not(.pointer) {cursor: pointer !important;}
.icon16 {font-size: 14px;height: 16px;width: 16px;}
.icon24 {font-size: 18px;height: 24px;width: 24px;}
.icon32 {font-size: 28px;height: 32px;width: 32px;vertical-align: -5px;}
.icon48 {font-size: 42px;height: 48px;width: 48px;}
.icon96 {font-size: 84px;height: 96px;width: 96px;}
.icon-spinner, .fa-spinner {height: auto;-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
@-moz-keyframes spin {0% {-moz-transform: rotate(0deg);}
100% {-moz-transform: rotate(359deg);}
}
@-webkit-keyframes spin {0% {-webkit-transform: rotate(0deg);}
100% {-webkit-transform: rotate(359deg);}
}
@-o-keyframes spin {0% {-o-transform: rotate(0deg);}
100% {-o-transform: rotate(359deg);}
}
@-ms-keyframes spin {0% {-ms-transform: rotate(0deg);}
100% {-ms-transform: rotate(359deg);}
}
@keyframes spin {0% {transform: rotate(0deg);}
100% {transform: rotate(359deg);}
}
.icon-rotate-90:before, .fa-rotate-90:before {-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-ms-transform: rotate(90deg);-o-transform: rotate(90deg);transform: rotate(90deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);}
.icon-rotate-180:before, .fa-rotate-180:before {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);}
.icon-rotate-270:before, .fa-rotate-270:before {-webkit-transform: rotate(270deg);-moz-transform: rotate(270deg);-ms-transform: rotate(270deg);-o-transform: rotate(270deg);transform: rotate(270deg);filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);}
.icon-flip-horizontal:before, .fa-flip-horizontal:before {-webkit-transform: scale(-1,1);-moz-transform: scale(-1,1);-ms-transform: scale(-1,1);-o-transform: scale(-1,1);transform: scale(-1,1);}
.icon-flip-vertical:before, .fa-flip-vertical:before {-webkit-transform: scale(1,-1);-moz-transform: scale(1,-1);-ms-transform: scale(1,-1);-o-transform: scale(1,-1);transform: scale(1,-1);}
.icon-glass:before, .fa-glass:before {content: "\f000";}
.icon-music:before, .fa-music:before {content: "\f001";}
.icon-search:before, .fa-search:before {content: "\f002";}
.icon-envelope-alt:before, .fa-envelope-o:before {content: "\f003";}
.icon-heart:before, .fa-heart:before {content: "\f004";}
.icon-star:before, .fa-star:before {content: "\f005";}
.icon-star-empty:before, .fa-star-o:before {content: "\f006";}
.icon-user:before, .fa-user:before {content: "\f007";}
.icon-film:before, .fa-film:before {content: "\f008";}
.icon-th-large:before, .fa-th-large:before {content: "\f009";}
.icon-th:before, .fa-th:before {content: "\f00a";}
.icon-th-list:before, .fa-th-list:before {content: "\f00b";}
.icon-ok:before, .fa-check:before {content: "\f00c";}
.icon-remove:before, .fa-times:before {content: "\f00d";}
.icon-zoom-in:before, .fa-search-plus:before {content: "\f00e";}
.icon-zoom-out:before, .fa-search-minus:before {content: "\f010";}
.icon-power-off:before, .fa-power-off:before, .icon-off:before, .fa-power-off:before {content: "\f011";}
.icon-signal:before, .fa-signal:before {content: "\f012";}
.icon-gear:before, .fa-gear:before, .icon-cog:before, .fa-cog:before {content: "\f013";}
.icon-trash:before, .fa-trash-o:before {content: "\f014";}
.icon-home:before, .fa-home:before {content: "\f015";}
.icon-file-alt:before, .fa-file-o:before {content: "\f016";}
.icon-time:before, .fa-clock-o:before {content: "\f017";}
.icon-road:before, .fa-road:before {content: "\f018";}
.icon-download-alt:before, .fa-download:before {content: "\f019";}
.icon-download:before, .fa-arrow-circle-o-down:before {content: "\f01a";}
.icon-upload:before, .fa-arrow-circle-o-up:before {content: "\f01b";}
.icon-inbox:before, .fa-inbox:before {content: "\f01c";}
.icon-play-circle:before, .fa-play-circle-o:before {content: "\f01d";}
.icon-rotate-left:before, .fa-rotate-left:before, .icon-repeat:before, .fa-repeat:before {content: "\f01e";}
.icon-refresh:before, .fa-refresh:before {content: "\f021";}
.icon-list-alt:before, .fa-list-alt:before {content: "\f022";}
.icon-lock:before, .fa-lock:before {content: "\f023";}
.icon-flag:before, .fa-flag:before {content: "\f024";}
.icon-headphones:before, .fa-headphones:before {content: "\f025";}
.icon-volume-off:before, .fa-volume-off:before {content: "\f026";}
.icon-volume-down:before, .fa-volume-down:before {content: "\f027";}
.icon-volume-up:before, .fa-volume-up:before {content: "\f028";}
.icon-qrcode:before, .fa-qrcode:before {content: "\f029";}
.icon-barcode:before, .fa-barcode:before {content: "\f02a";}
.icon-tag:before, .fa-tag:before {content: "\f02b";}
.icon-tags:before, .fa-tags:before {content: "\f02c";}
.icon-book:before, .fa-book:before {content: "\f02d";}
.icon-bookmark:before, .fa-bookmark:before {content: "\f02e";}
.icon-print:before, .fa-print:before {content: "\f02f";}
.icon-camera:before, .fa-camera:before {content: "\f030";}
.icon-font:before, .fa-font:before {content: "\f031";}
.icon-bold:before, .fa-bold:before {content: "\f032";}
.icon-italic:before, .fa-italic:before {content: "\f033";}
.icon-text-height:before, .fa-text-height:before {content: "\f034";}
.icon-text-width:before, .fa-text-width:before {content: "\f035";}
.icon-align-right:before, .fa-align-right:before {content: "\f036";}
.icon-align-center:before, .fa-align-center:before {content: "\f037";}
.icon-align-left:before, .fa-align-left:before {content: "\f038";}
.icon-align-justify:before, .fa-align-justify:before {content: "\f039";}
.icon-list:before, .fa-list:before {content: "\f03a";}
.icon-indent-right:before, .fa-outdent:before {content: "\f03b";}
.icon-indent-left:before, .fa-indent:before {content: "\f03c";}
.icon-facetime-video:before, .fa-video-camera:before {content: "\f03d";}
.icon-picture:before, .fa-picture-o:before {content: "\f03e";}
.icon-pencil:before, .fa-pencil:before {content: "\f040";}
.icon-map-marker:before, .fa-map-marker:before {content: "\f041";}
.icon-adjust:before, .fa-adjust:before {content: "\f042";}
.icon-tint:before, .fa-tint:before {content: "\f043";}
.icon-edit:before, .fa-pencil-square-o:before {content: "\f044";}
.icon-share:before, .fa-share-square-o:before {content: "\f045";}
.icon-check:before, .fa-check-square-o:before {content: "\f046";}
.icon-move:before, .fa-arrows:before {content: "\f047";}
.icon-step-backward:before, .fa-step-backward:before {content: "\f048";}
.icon-fast-backward:before, .fa-fast-backward:before {content: "\f049";}
.icon-backward:before, .fa-backward:before {content: "\f04a";}
.icon-play:before, .fa-play:before {content: "\f04b";}
.icon-pause:before, .fa-pause:before {content: "\f04c";}
.icon-stop:before, .fa-stop:before {content: "\f04d";}
.icon-forward:before, .fa-forward:before {content: "\f04e";}
.icon-fast-forward:before, .fa-fast-forward:before {content: "\f050";}
.icon-step-forward:before, .fa-step-forward:before {content: "\f051";}
.icon-eject:before, .fa-eject:before {content: "\f052";}
.icon-chevron-right:before, .fa-chevron-right:before {content: "\f053";}
.icon-chevron-left:before, .fa-chevron-left:before {content: "\f054";}
.icon-plus-sign:before, .fa-plus-circle:before {content: "\f055";}
.icon-minus-sign:before, .fa-minus-circle:before {content: "\f056";}
.icon-remove-sign:before, .fa-times-circle:before {content: "\f057";}
.icon-ok-sign:before, .fa-check-circle:before {content: "\f058";}
.icon-question-sign:before, .fa-question-circle:before {content: "\f059";}
.icon-info-sign:before, .fa-info-circle:before {content: "\f05a";}
.icon-screenshot:before, .fa-crosshairs:before {content: "\f05b";}
.icon-remove-circle:before, .fa-times-circle-o:before {content: "\f05c";}
.icon-ok-circle:before, .fa-check-circle-o:before {content: "\f05d";}
.icon-ban-circle:before, .fa-ban:before {content: "\f05e";}
.icon-arrow-right:before, .fa-arrow-right:before {content: "\f060";}
.icon-arrow-left:before, .fa-arrow-left:before {content: "\f061";}
.icon-arrow-up:before, .fa-arrow-up:before {content: "\f062";}
.icon-arrow-down:before, .fa-arrow-down:before {content: "\f063";}
.icon-mail-forward:before, .fa-mail-forward:before, .icon-share-alt:before, .fa-share:before {content: "\f1e0";}
.icon-resize-full:before, .fa-expand:before {content: "\f065";}
.icon-resize-small:before, .fa-compress:before {content: "\f066";}
.icon-plus:before, .fa-plus:before {content: "\f067";}
.icon-minus:before, .fa-minus:before {content: "\f068";}
.icon-asterisk:before, .fa-asterisk:before {content: "\f069";}
.icon-exclamation-sign:before, .fa-exclamation-circle:before {content: "\f06a";}
.icon-gift:before, .fa-gift:before {content: "\f06b";}
.icon-leaf:before, .fa-leaf:before {content: "\f06c";}
.icon-fire:before, .fa-fire:before {content: "\f06d";}
.icon-eye-open:before, .fa-eye:before {content: "\f06e";}
.icon-eye-close:before, .fa-eye-slash:before {content: "\f070";}
.icon-warning-sign:before, .fa-exclamation-triangle:before {content: "\f071";}
.icon-plane:before, .fa-plane:before {content: "\f072";}
.icon-calendar:before, .fa-calendar:before {content: "\f073";}
.icon-random:before, .fa-random:before {content: "\f074";}
.icon-comment:before, .fa-comment:before {content: "\f075";}
.icon-magnet:before, .fa-magnet:before {content: "\f076";}
.icon-chevron-up:before, .fa-chevron-up:before {content: "\f077";}
.icon-chevron-down:before, .fa-chevron-down:before {content: "\f078";}
.icon-retweet:before, .fa-retweet:before {content: "\f079";}
.icon-shopping-cart:before, .fa-shopping-cart:before {content: "\f07a";}
.icon-folder-close:before, .fa-folder:before {content: "\f07b";}
.icon-folder-open:before, .fa-folder-open:before {content: "\f07c";}
.icon-resize-vertical:before, .fa-arrows-v:before {content: "\f07d";}
.icon-resize-horizontal:before, .fa-arrows-h:before {content: "\f07e";}
.icon-bar-chart:before, .fa-bar-chart:before, .fa-bar-chart-o:before {content: "\f080";}
.icon-twitter-sign:before, .fa-twitter-square:before {content: "\f081";}
.icon-facebook-sign:before, .fa-facebook-square:before {content: "\f082";}
.icon-camera-retro:before, .fa-camera-retro:before {content: "\f083";}
.icon-key:before, .fa-key:before {content: "\f084";}
.icon-gears:before, .fa-gears:before, .icon-cogs:before, .fa-cogs:before {content: "\f085";}
.icon-comments:before, .fa-comments:before {content: "\f086";}
.icon-thumbs-up-alt:before, .fa-thumbs-o-up:before {content: "\f087";}
.icon-thumbs-down-alt:before, .fa-thumbs-o-down:before {content: "\f088";}
.icon-star-half:before, .fa-star-half:before {content: "\f089";}
.icon-heart-empty:before, .fa-heart-o:before {content: "\f08a";}
.icon-signout:before, .fa-sign-out:before {content: "\f08b";}
.icon-linkedin-sign:before, .fa-linkedin-square:before {content: "\f08c";}
.icon-pushpin:before, .fa-thumb-tack:before {content: "\f08d";}
.icon-external-link:before, .fa-external-link:before {content: "\f08e";}
.icon-signin:before, .fa-sign-in:before {content: "\f090";}
.icon-trophy:before, .fa-trophy:before {content: "\f091";}
.icon-github-sign:before, .fa-github-square:before {content: "\f092";}
.icon-upload-alt:before, .fa-upload:before {content: "\f093";}
.icon-lemon:before, .fa-lemon-o:before {content: "\f094";}
.icon-phone:before, .fa-phone:before {content: "\f095";}
.icon-unchecked:before, .fa-unchecked:before, .icon-check-empty:before {content: "\f096";}
.icon-bookmark-empty:before, .fa-bookmark-o:before {content: "\f097";}
.icon-phone-sign:before, .fa-phone-square:before {content: "\f098";}
.icon-twitter:before, .fa-twitter:before {content: "\f099";}
.icon-facebook:before, .fa-facebook-f:before, .fa-facebook:before {content: "\f09a";}
.icon-github:before, .fa-github:before {content: "\f09b";}
.icon-unlock:before, .fa-unlock:before {content: "\f09c";}
.icon-credit-card:before, .fa-credit-card:before {content: "\f09d";}
.icon-rss:before, .fa-rss:before {content: "\f09e";}
.icon-hdd:before, .fa-hdd-o:before {content: "\f0a0";}
.icon-bullhorn:before, .fa-bullhorn:before {content: "\f0a1";}
.icon-bell:before, .fa-bell-o:before {content: "\f0a2";}
.icon-certificate:before, .fa-certificate:before {content: "\f0a3";}
.icon-hand-left:before, .fa-hand-o-left:before {content: "\f0a4";}
.icon-hand-right:before, .fa-hand-o-right:before {content: "\f0a5";}
.icon-hand-up:before, .fa-hand-o-up:before {content: "\f0a6";}
.icon-hand-down:before, .fa-hand-o-down:before {content: "\f0a7";}
.icon-circle-arrow-right:before, .fa-arrow-circle-right:before {content: "\f0a8";}
.icon-circle-arrow-left:before, .fa-arrow-circle-left:before {content: "\f0a9";}
.icon-circle-arrow-up:before, .fa-arrow-circle-up:before {content: "\f0aa";}
.icon-circle-arrow-down:before, .fa-arrow-circle-down:before {content: "\f0ab";}
.icon-globe:before, .fa-globe:before {content: "\f0ac";}
.icon-wrench:before, .fa-wrench:before {content: "\f0ad";}
.icon-tasks:before, .fa-tasks:before {content: "\f0ae";}
.icon-filter:before, .fa-filter:before {content: "\f0b0";}
.icon-briefcase:before, .fa-briefcase:before {content: "\f0b1";}
.icon-fullscreen:before, .fa-arrows-alt:before {content: "\f0b2";}
.icon-group:before, .fa-users:before {content: "\f0c0";}
.icon-link:before, .fa-link:before {content: "\f0c1";}
.icon-cloud:before, .fa-cloud:before {content: "\f0c2";}
.icon-beaker:before, .fa-flask:before {content: "\f0c3";}
.icon-cut:before, .fa-scissors:before {content: "\f0c4";}
.icon-copy:before, .fa-files-o:before {content: "\f0c5";}
.icon-paperclip:before, .fa-paperclip:before, .icon-paper-clip:before, .fa-paperclip:before {content: "\f0c6";}
.icon-save:before, .fa-floppy-o:before {content: "\f0c7";}
.icon-sign-blank:before, .fa-square:before {content: "\f0c8";}
.icon-reorder:before, .fa-bars:before {content: "\f0c9";}
.icon-list-ul:before, .fa-list-ul:before {content: "\f0ca";}
.icon-list-ol:before, .fa-list-ol:before {content: "\f0cb";}
.icon-strikethrough:before, .fa-strikethrough:before {content: "\f0cc";}
.icon-underline:before, .fa-underline:before {content: "\f0cd";}
.icon-table:before, .fa-table:before {content: "\f0ce";}
.icon-magic:before, .fa-magic:before {content: "\f0d0";}
.icon-truck:before, .fa-truck:before {content: "\f0d1";}
.icon-pinterest:before, .fa-pinterest:before {content: "\f0d2";}
.icon-pinterest-sign:before, .fa-pinterest-square:before {content: "\f0d3";}
.icon-google-plus-sign:before, .fa-google-plus-square:before {content: "\f0d4";}
.icon-google-plus:before, .fa-google-plus:before {content: "\f0d5";}
.icon-money:before, .fa-money:before {content: "\f0d6";}
.icon-caret-down:before, .fa-caret-down:before {content: "\f0d7";}
.icon-caret-up:before, .fa-caret-up:before {content: "\f0d8";}
.icon-caret-right:before, .fa-caret-right:before {content: "\f0d9";}
.icon-caret-left:before, .fa-caret-left:before {content: "\f0da";}
.icon-columns:before, .fa-columns:before {content: "\f0db";}
.icon-sort:before, .fa-sort:before {content: "\f0dc";}
.icon-sort-down:before, .fa-sort-asc:before {content: "\f0dd";}
.icon-sort-up:before, .fa-sort-desc:before {content: "\f0de";}
.icon-envelope:before, .fa-envelope:before {content: "\f0e0";}
.icon-linkedin:before, .fa-linkedin:before {content: "\f0e1";}
.icon-rotate-right:before, .fa-rotate-right:before, .icon-undo:before, .fa-undo:before {content: "\f0e2";}
.icon-legal:before, .fa-gavel:before {content: "\f0e3";}
.icon-dashboard:before, .fa-tachometer:before {content: "\f0e4";}
.icon-comment-alt:before, .fa-comment-o:before {content: "\f0e5";}
.icon-comments-alt:before, .fa-comments-o:before {content: "\f0e6";}
.icon-bolt:before, .fa-bolt:before {content: "\f0e7";}
.icon-sitemap:before, .fa-sitemap:before {content: "\f0e8";}
.icon-umbrella:before, .fa-umbrella:before {content: "\f0e9";}
.icon-paste:before, .fa-clipboard:before {content: "\f0ea";}
.icon-lightbulb:before, .fa-lightbulb-o:before {content: "\f0eb";}
.icon-exchange:before, .fa-exchange:before {content: "\f0ec";}
.icon-cloud-download:before, .fa-cloud-download:before {content: "\f0ed";}
.icon-cloud-upload:before, .fa-cloud-upload:before {content: "\f0ee";}
.icon-user-md:before, .fa-user-md:before {content: "\f0f0";}
.icon-stethoscope:before, .fa-stethoscope:before {content: "\f0f1";}
.icon-suitcase:before, .fa-suitcase:before {content: "\f0f2";}
.icon-bell-alt:before, .fa-bell:before {content: "\f0f3";}
.icon-coffee:before, .fa-coffee:before {content: "\f0f4";}
.icon-food:before, .fa-cutlery:before {content: "\f0f5";}
.icon-file-text-alt:before, .fa-file-text-o:before {content: "\f0f6";}
.icon-building:before, .fa-building-o:before {content: "\f0f7";}
.icon-hospital:before, .fa-hospital-o:before {content: "\f0f8";}
.icon-ambulance:before, .fa-ambulance:before {content: "\f0f9";}
.icon-medkit:before, .fa-medkit:before {content: "\f0fa";}
.icon-fighter-jet:before, .fa-fighter-jet:before {content: "\f0fb";}
.icon-beer:before, .fa-beer:before {content: "\f0fc";}
.icon-h-sign:before, .fa-h-square:before {content: "\f0fd";}
.icon-plus-sign-alt:before, .fa-plus-square:before {content: "\f0fe";}
.icon-double-angle-right:before, .fa-angle-double-right:before {content: "\f100";}
.icon-double-angle-left:before, .fa-angle-double-left:before {content: "\f101";}
.icon-double-angle-up:before, .fa-angle-double-up:before {content: "\f102";}
.icon-double-angle-down:before, .fa-angle-double-down:before {content: "\f103";}
.icon-angle-right:before, .fa-angle-right:before {content: "\f104";}
.icon-angle-left:before, .fa-angle-left:before {content: "\f105";}
.icon-angle-up:before, .fa-angle-up:before {content: "\f106";}
.icon-angle-down:before, .fa-angle-down:before {content: "\f107";}
.icon-desktop:before, .fa-desktop:before {content: "\f108";}
.icon-laptop:before, .fa-laptop:before {content: "\f109";}
.icon-tablet:before, .fa-tablet:before {content: "\f10a";}
.icon-mobile-phone:before, .fa-mobile:before {content: "\f10b";}
.icon-circle-blank:before, .fa-circle-o:before {content: "\f10c";}
.icon-quote-right:before, .fa-quote-right:before {content: "\f10d";}
.icon-quote-left:before, .fa-quote-left:before {content: "\f10e";}
.icon-spinner:before, .fa-spinner:before {content: "\f110" !important;}
.icon-circle:before, .fa-circle:before {content: "\f111";}
.icon-mail-reply:before, .fa-mail-reply:before, .icon-reply:before, .fa-reply:before {content: "\f112";}
.icon-github-alt:before, .fa-github-alt:before {content: "\f113";}
.icon-folder-close-alt:before, .fa-folder-o:before {content: "\f114";}
.icon-folder-open-alt:before, .fa-folder-open-o:before {content: "\f115";}
.icon-expand-alt:before, .fa-expand-o:before {content: "\f196";}
.icon-collapse-alt:before, .fa-square-o:before {content: "\f096";}
.icon-smile:before, .fa-smile-o:before {content: "\f118";}
.icon-frown:before, .fa-frown-o:before {content: "\f119";}
.icon-meh:before, .fa-meh-o:before {content: "\f11a";}
.icon-gamepad:before, .fa-gamepad:before {content: "\f11b";}
.icon-keyboard:before, .fa-keyboard-o:before {content: "\f11c";}
.icon-flag-alt:before, .fa-flag-o:before {content: "\f11d";}
.icon-flag-checkered:before, .fa-flag-checkered:before {content: "\f11e";}
.icon-terminal:before, .fa-terminal:before {content: "\f120";}
.icon-code:before, .fa-code:before {content: "\f121";}
.icon-reply-all:before, .fa-reply-all:before, .icon-mail-reply-all:before, .fa-mail-reply-all:before {content: "\f122";}
.icon-star-half-full:before, .fa-star-half-full:before, .icon-star-half-empty:before, .fa-star-half-o:before {content: "\f123";}
.icon-location-arrow:before, .fa-location-arrow:before {content: "\f124";}
.icon-crop:before, .fa-crop:before {content: "\f125";}
.icon-code-fork:before, .fa-code-fork:before {content: "\f126";}
.icon-unlink:before, .fa-chain-broken:before {content: "\f127";}
.icon-question:before, .fa-question:before {content: "\f128";}
.icon-info:before, .fa-info:before {content: "\f129";}
.icon-exclamation:before, .fa-exclamation:before {content: "\f12a";}
.icon-superscript:before, .fa-superscript:before {content: "\f12b";}
.icon-subscript:before, .fa-subscript:before {content: "\f12c";}
.icon-eraser:before, .fa-eraser:before {content: "\f12d";}
.icon-puzzle-piece:before, .fa-puzzle-piece:before {content: "\f12e";}
.icon-microphone:before, .fa-microphone:before {content: "\f130";}
.icon-microphone-off:before, .fa-microphone-slash:before {content: "\f131";}
.icon-shield:before, .fa-shield:before {content: "\f132";}
.icon-calendar-empty:before, .fa-calendar-o:before {content: "\f133";}
.icon-fire-extinguisher:before, .fa-fire-extinguisher:before {content: "\f134";}
.icon-rocket:before, .fa-rocket:before {content: "\f135";}
.icon-maxcdn:before, .fa-maxcdn:before {content: "\f136";}
.icon-chevron-sign-right:before, .fa-chevron-circle-right:before {content: "\f137";}
.icon-chevron-sign-left:before, .fa-chevron-circle-left:before {content: "\f138";}
.icon-chevron-sign-up:before, .fa-chevron-circle-up:before {content: "\f139";}
.icon-chevron-sign-down:before, .fa-chevron-circle-down:before {content: "\f13a";}
.icon-html5:before, .fa-html5:before {content: "\f13b";}
.icon-css3:before, .fa-css3:before {content: "\f13c";}
.icon-anchor:before, .fa-anchor:before {content: "\f13d";}
.icon-unlock-alt:before, .fa-unlock-alt:before {content: "\f13e";}
.icon-bullseye:before, .fa-bullseye:before {content: "\f140";}
.icon-ellipsis-horizontal:before, .fa-ellipsis-h:before {content: "\f141";}
.icon-ellipsis-vertical:before, .fa-ellipsis-v:before {content: "\f142";}
.icon-rss-sign:before, .fa-rss-square:before {content: "\f143";}
.icon-play-sign:before, .fa-play-circle:before {content: "\f144";}
.icon-ticket:before, .fa-ticket:before {content: "\f145";}
.icon-minus-sign-alt:before, .fa-minus-square:before {content: "\f146";}
.icon-check-minus:before, .fa-minus-square-o:before {content: "\f147";}
.icon-level-up:before, .fa-level-up:before {content: "\f148";}
.icon-level-down:before, .fa-level-down:before {content: "\f149";}
.icon-check-sign:before, .fa-check-square:before {content: "\f14a";}
.icon-edit-sign:before, .fa-pencil-square:before {content: "\f14b";}
.icon-external-link-sign:before, .fa-external-link-square:before {content: "\f14c";}
.icon-share-sign:before, .fa-share-square:before {content: "\f14d";}
.icon-compass:before, .fa-compass:before {content: "\f14e";}
.icon-collapse:before, .fa-caret-square-o-down:before {content: "\f150";}
.icon-collapse-top:before, .fa-caret-square-o-up:before {content: "\f151";}
.icon-expand:before, .fa-caret-square-o-left:before {content: "\f152";}
.icon-euro:before, .fa-euro:before, .icon-eur:before, .fa-eur:before {content: "\f153";}
.icon-gbp:before, .fa-gbp:before {content: "\f154";}
.icon-dollar:before, .fa-dollar:before, .icon-usd:before, .fa-usd:before {content: "\f155";}
.icon-rupee:before, .fa-rupee:before, .icon-inr:before, .fa-inr:before {content: "\f156";}
.icon-yen:before, .fa-yen:before, .icon-jpy:before, .fa-jpy:before {content: "\f157";}
.icon-renminbi:before, .fa-renminbi:before, .icon-cny:before, .fa-rub:before {content: "\f158";}
.icon-won:before, .fa-won:before, .icon-krw:before, .fa-krw:before {content: "\f159";}
.icon-bitcoin:before, .fa-bitcoin:before, .icon-btc:before, .fa-btc:before {content: "\f15a";}
.icon-file:before, .fa-file:before {content: "\f15b";}
.icon-file-text:before, .fa-file-text:before {content: "\f15c";}
.icon-sort-by-alphabet:before, .fa-sort-alpha-asc:before {content: "\f15d";}
.icon-sort-by-alphabet-alt:before, .fa-sort-alpha-desc:before {content: "\f15e";}
.icon-sort-by-attributes:before, .fa-sort-amount-asc:before {content: "\f160";}
.icon-sort-by-attributes-alt:before, .fa-sort-amount-desc:before {content: "\f161";}
.icon-sort-by-order:before, .fa-sort-numeric-asc:before {content: "\f162";}
.icon-sort-by-order-alt:before, .fa-sort-numeric-desc:before {content: "\f163";}
.icon-thumbs-up:before, .fa-thumbs-up:before {content: "\f164";}
.icon-thumbs-down:before, .fa-thumbs-down:before {content: "\f165";}
.icon-youtube-sign:before, .fa-youtube-square:before {content: "\f166";}
.icon-youtube:before, .fa-youtube:before {content: "\f167";}
.icon-xing:before, .fa-xing:before {content: "\f168";}
.icon-xing-sign:before, .fa-xing-square:before {content: "\f169";}
.icon-youtube-play:before, .fa-youtube-play:before {content: "\f16a";}
.icon-dropbox:before, .fa-dropbox:before {content: "\f16b";}
.icon-stackexchange:before, .fa-stack-overflow:before {content: "\f16c";}
.icon-instagram:before, .fa-instagram:before {content: "\f16d";}
.icon-flickr:before, .fa-flickr:before {content: "\f16e";}
.icon-adn:before, .fa-adn:before {content: "\f170";}
.icon-bitbucket:before, .fa-bitbucket:before {content: "\f171";}
.icon-bitbucket-sign:before, .fa-bitbucket-square:before {content: "\f172";}
.icon-tumblr:before, .fa-tumblr:before {content: "\f173";}
.icon-tumblr-sign:before, .fa-tumblr-square:before {content: "\f174";}
.icon-long-arrow-down:before, .fa-long-arrow-down:before {content: "\f175";}
.icon-long-arrow-up:before, .fa-long-arrow-up:before {content: "\f176";}
.icon-long-arrow-right:before, .fa-long-arrow-right:before {content: "\f177";}
.icon-long-arrow-left:before, .fa-long-arrow-left:before {content: "\f178";}
.icon-apple:before, .fa-apple:before {content: "\f179";}
.icon-windows:before, .fa-windows:before {content: "\f17a";}
.icon-android:before, .fa-android:before {content: "\f17b";}
.icon-linux:before, .fa-linux:before {content: "\f17c";}
.icon-dribbble:before, .fa-dribbble:before {content: "\f17d";}
.icon-skype:before, .fa-skype:before {content: "\f17e";}
.icon-foursquare:before, .fa-foursquare:before {content: "\f180";}
.icon-trello:before, .fa-trello:before {content: "\f181";}
.icon-female:before, .fa-female:before {content: "\f182";}
.icon-male:before, .fa-male:before {content: "\f183";}
.icon-gittip:before, .fa-gittip:before, .fa-gratipay:before {content: "\f184";}
.icon-sun:before, .fa-sun-o:before {content: "\f185";}
.icon-moon:before, .fa-moon-o:before {content: "\f186";}
.icon-archive:before, .fa-archive:before {content: "\f187";}
.icon-bug:before, .fa-bug:before {content: "\f188";}
.icon-vk:before, .fa-vk:before {content: "\f189";}
.icon-weibo:before, .fa-weibo:before {content: "\f18a";}
.icon-renren:before, .fa-renren:before {content: "\f18b";}
.fa-pagelines:before {content: "\f18c";}
.fa-stack-exchange:before {content: "\f18d";}
.fa-arrow-circle-o-left:before {content: "\f18e";}
.fa-arrow-circle-o-right:before {content: "\f190";}
.fa-toggle-right:before, .fa-caret-square-o-right:before {content: "\f191";}
.fa-dot-circle-o:before {content: "\f192";}
.fa-wheelchair:before {content: "\f193";}
.fa-vimeo-square:before {content: "\f194";}
.fa-turkish-lira:before, .fa-try:before {content: "\f195";}
.fa-plus-square-o:before {content: "\f196";}
.fa-empire:before, .fa-ge:before {content: "\f1d1";}
.fa-space-shuttle:before {content: "\f197";}
.fa-slack:before {content: "\f198";}
.fa-envelope-square:before {content: "\f199";}
.fa-wordpress:before {content: "\f19a";}
.fa-openid:before {content: "\f19b";}
.fa-institution:before, .fa-bank:before, .fa-university:before {content: "\f19c";}
.fa-mortar-board:before, .fa-graduation-cap:before {content: "\f19d";}
.fa-yahoo:before {content: "\f19e";}
.fa-google:before {content: "\f1a0";}
.fa-reddit:before {content: "\f1a1";}
.fa-reddit-square:before {content: "\f1a2";}
.fa-stumbleupon-circle:before {content: "\f1a3";}
.fa-stumbleupon:before {content: "\f1a4";}
.fa-delicious:before {content: "\f1a5";}
.fa-digg:before {content: "\f1a6";}
.fa-pied-piper-square:before, .fa-pied-piper:before {content: "\f1a7";}
.fa-pied-piper-alt:before {content: "\f1a8";}
.fa-drupal:before {content: "\f1a9";}
.fa-joomla:before {content: "\f1aa";}
.fa-language:before {content: "\f1ab";}
.fa-fax:before {content: "\f1ac";}
.fa-building:before {content: "\f1ad";}
.fa-child:before {content: "\f1ae";}
.fa-paw:before {content: "\f1b0";}
.fa-spoon:before {content: "\f1b1";}
.fa-cube:before {content: "\f1b2";}
.fa-cubes:before {content: "\f1b3";}
.fa-behance:before {content: "\f1b4";}
.fa-behance-square:before {content: "\f1b5";}
.fa-steam:before {content: "\f1b6";}
.fa-steam-square:before {content: "\f1b7";}
.fa-recycle:before {content: "\f1b8";}
.fa-automobile:before, .fa-car:before {content: "\f1b9";}
.fa-cab:before, .fa-taxi:before {content: "\f1ba";}
.fa-tree:before {content: "\f1bb";}
.fa-spotify:before {content: "\f1bc";}
.fa-deviantart:before {content: "\f1bd";}
.fa-soundcloud:before {content: "\f1be";}
.fa-database:before {content: "\f1c0";}
.fa-file-pdf-o:before {content: "\f1c1";}
.fa-file-word-o:before {content: "\f1c2";}
.fa-file-excel-o:before {content: "\f1c3";}
.fa-file-powerpoint-o:before {content: "\f1c4";}
.fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before {content: "\f1c5";}
.fa-file-zip-o:before, .fa-file-archive-o:before {content: "\f1c6";}
.fa-file-sound-o:before, .fa-file-audio-o:before {content: "\f1c7";}
.fa-file-movie-o:before, .fa-file-video-o:before {content: "\f1c8";}
.fa-file-code-o:before {content: "\f1c9";}
.fa-vine:before {content: "\f1ca";}
.fa-codepen:before {content: "\f1cb";}
.fa-jsfiddle:before {content: "\f1cc";}
.fa-life-bouy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before {content: "\f1cd";}
.fa-circle-o-notch:before {content: "\f1ce";}
.fa-ra:before, .fa-rebel:before {content: "\f1d0";}
.fa-git-square:before {content: "\f1d2";}
.fa-git:before {content: "\f1d3";}
.fa-hacker-news:before {content: "\f1d4";}
.fa-tencent-weibo:before {content: "\f1d5";}
.fa-qq:before {content: "\f1d6";}
.fa-wechat:before, .fa-weixin:before {content: "\f1d7";}
.fa-send:before, .fa-paper-plane:before {content: "\f1d8";}
.fa-send-o:before, .fa-paper-plane-o:before {content: "\f1d9";}
.fa-history:before {content: "\f1da";}
.fa-genderless:before, .fa-circle-thin:before {content: "\f1db";}
.fa-header:before {content: "\f1dc";}
.fa-paragraph:before {content: "\f1dd";}
.fa-sliders:before {content: "\f1de";}
.fa-share-alt:before {content: "\f1e0";}
.fa-share-alt-square:before {content: "\f1e1";}
.fa-bomb:before {content: "\f1e2";}
.fa-soccer-ball-o:before, .fa-futbol-o:before {content: "\f1e3";}
.fa-tty:before {content: "\f1e4";}
.fa-binoculars:before {content: "\f1e5";}
.fa-plug:before {content: "\f1e6";}
.fa-slideshare:before {content: "\f1e7";}
.fa-twitch:before {content: "\f1e8";}
.fa-yelp:before {content: "\f1e9";}
.fa-newspaper-o:before {content: "\f1ea";}
.fa-wifi:before {content: "\f1eb";}
.fa-calculator:before {content: "\f1ec";}
.fa-paypal:before {content: "\f1ed";}
.fa-google-wallet:before {content: "\f1ee";}
.fa-cc-visa:before {content: "\f1f0";}
.fa-cc-mastercard:before {content: "\f1f1";}
.fa-cc-discover:before {content: "\f1f2";}
.fa-cc-amex:before {content: "\f1f3";}
.fa-cc-paypal:before {content: "\f1f4";}
.fa-cc-stripe:before {content: "\f1f5";}
.fa-bell-slash:before {content: "\f1f6";}
.fa-bell-slash-o:before {content: "\f1f7";}
.fa-trash:before {content: "\f1f8";}
.fa-copyleft:before {content: "\f1f9";}
.fa-at:before {content: "\f1fa";}
.fa-eyedropper:before {content: "\f1fb";}
.fa-paint-brush:before {content: "\f1fc";}
.fa-birthday-cake:before {content: "\f1fd";}
.fa-area-chart:before {content: "\f1fe";}
.fa-pie-chart:before {content: "\f200";}
.fa-line-chart:before {content: "\f201";}
.fa-lastfm:before {content: "\f202";}
.fa-lastfm-square:before {content: "\f203";}
.fa-toggle-off:before {content: "\f204";}
.fa-toggle-on:before {content: "\f205";}
.fa-bicycle:before {content: "\f206";}
.fa-bus:before {content: "\f207";}
.fa-ioxhost:before {content: "\f208";}
.fa-angellist:before {content: "\f209";}
.fa-cc:before {content: "\f20a";}
.fa-shekel:before, .fa-sheqel:before, .fa-ils:before {content: "\f20b";}
.fa-meanpath:before {content: "\f20c";}
.fa-buysellads:before {content: "\f20d";}
.fa-connectdevelop:before {content: "\f20e";}
.fa-dashcube:before {content: "\f210";}
.fa-forumbee:before {content: "\f211";}
.fa-leanpub:before {content: "\f212";}
.fa-sellsy:before {content: "\f213";}
.fa-shirtsinbulk:before {content: "\f214";}
.fa-simplybuilt:before {content: "\f215";}
.fa-skyatlas:before {content: "\f216";}
.fa-cart-plus:before {content: "\f217";}
.fa-cart-arrow-down:before {content: "\f218";}
.fa-diamond:before {content: "\f219";}
.fa-ship:before {content: "\f21a";}
.fa-user-secret:before {content: "\f21b";}
.fa-motorcycle:before {content: "\f21c";}
.fa-street-view:before {content: "\f21d";}
.fa-heartbeat:before {content: "\f21e";}
.fa-venus:before {content: "\f221";}
.fa-mars:before {content: "\f222";}
.fa-mercury:before {content: "\f223";}
.fa-transgender:before {content: "\f224";}
.fa-transgender-alt:before {content: "\f225";}
.fa-venus-double:before {content: "\f226";}
.fa-mars-double:before {content: "\f227";}
.fa-venus-mars:before {content: "\f228";}
.fa-mars-stroke:before {content: "\f229";}
.fa-mars-stroke-v:before {content: "\f22a";}
.fa-mars-stroke-h:before {content: "\f22b";}
.fa-neuter:before {content: "\f22c";}
.fa-facebook-official:before {content: "\f230";}
.fa-pinterest-p:before {content: "\f231";}
.fa-whatsapp:before {content: "\f232";}
.fa-server:before {content: "\f233";}
.fa-user-plus:before {content: "\f234";}
.fa-user-times:before {content: "\f235";}
.fa-hotel:before, .fa-bed:before {content: "\f236";}
.fa-viacoin:before {content: "\f237";}
.fa-train:before {content: "\f238";}
.fa-subway:before {content: "\f239";}
.fa-medium:before {content: "\f23a";}
.fa-yc:before, .fa-y-combinator:before {content: "\f23b";}
.fa-optin-monster:before {content: "\f23c";}
.fa-opencart:before {content: "\f23d";}
.fa-expeditedssl:before {content: "\f23e";}
.fa-battery-4:before, .fa-battery-full:before {content: "\f240";}
.fa-battery-3:before, .fa-battery-three-quarters:before {content: "\f241";}
.fa-battery-2:before, .fa-battery-half:before {content: "\f242";}
.fa-battery-1:before, .fa-battery-quarter:before {content: "\f243";}
.fa-battery-0:before, .fa-battery-empty:before {content: "\f244";}
.fa-mouse-pointer:before {content: "\f245";}
.fa-i-cursor:before {content: "\f246";}
.fa-object-group:before {content: "\f247";}
.fa-object-ungroup:before {content: "\f248";}
.fa-sticky-note:before {content: "\f249";}
.fa-sticky-note-o:before {content: "\f24a";}
.fa-cc-jcb:before {content: "\f24b";}
.fa-cc-diners-club:before {content: "\f24c";}
.fa-clone:before {content: "\f24d";}
.fa-balance-scale:before {content: "\f24e";}
.fa-hourglass-o:before {content: "\f250";}
.fa-hourglass-1:before, .fa-hourglass-start:before {content: "\f251";}
.fa-hourglass-2:before, .fa-hourglass-half:before {content: "\f252";}
.fa-hourglass-3:before, .fa-hourglass-end:before {content: "\f253";}
.fa-hourglass:before {content: "\f254";}
.fa-hand-grab-o:before, .fa-hand-rock-o:before {content: "\f255";}
.fa-hand-stop-o:before, .fa-hand-paper-o:before {content: "\f256";}
.fa-hand-scissors-o:before {content: "\f257";}
.fa-hand-lizard-o:before {content: "\f258";}
.fa-hand-spock-o:before {content: "\f259";}
.fa-hand-pointer-o:before {content: "\f25a";}
.fa-hand-peace-o:before {content: "\f25b";}
.fa-trademark:before {content: "\f25c";}
.fa-registered:before {content: "\f25d";}
.fa-creative-commons:before {content: "\f25e";}
.fa-gg:before {content: "\f260";}
.fa-gg-circle:before {content: "\f261";}
.fa-tripadvisor:before {content: "\f262";}
.fa-odnoklassniki:before {content: "\f263";}
.fa-odnoklassniki-square:before {content: "\f264";}
.fa-get-pocket:before {content: "\f265";}
.fa-wikipedia-w:before {content: "\f266";}
.fa-safari:before {content: "\f267";}
.fa-chrome:before {content: "\f268";}
.fa-firefox:before {content: "\f269";}
.fa-opera:before {content: "\f26a";}
.fa-internet-explorer:before {content: "\f26b";}
.fa-tv:before, .fa-television:before {content: "\f26c";}
.fa-contao:before {content: "\f26d";}
.fa-500px:before {content: "\f26e";}
.fa-amazon:before {content: "\f270";}
.fa-calendar-plus-o:before {content: "\f271";}
.fa-calendar-minus-o:before {content: "\f272";}
.fa-calendar-times-o:before {content: "\f273";}
.fa-calendar-check-o:before {content: "\f274";}
.fa-industry:before {content: "\f275";}
.fa-map-pin:before {content: "\f276";}
.fa-map-signs:before {content: "\f277";}
.fa-map-o:before {content: "\f278";}
.fa-map:before {content: "\f279";}
.fa-commenting:before {content: "\f27a";}
.fa-commenting-o:before {content: "\f27b";}
.fa-houzz:before {content: "\f27c";}
.fa-vimeo:before {content: "\f27d";}
.fa-black-tie:before {content: "\f27e";}
.fa-fonticons:before {content: "\f280";}
#lbOverlay {background-color: #000;bottom: 0;right: 0;position: fixed;left: 0;top: 0;z-index: 399;}
#lbPrevLink, #lbNextLink {display: block;overflow: hidden;position: absolute;top: 0;width: 50%;outline: none;}
#lbPrevLink > span, #lbNextLink > span {background-color: #fff;display: none;padding: 7px;position: absolute;top: 20%;}
#lbPrevLink:hover > span, #lbNextLink:hover > span {box-shadow:  -0 0 20px 0 #ffaa22;}
#lbPrevLink {right: 0;}
#lbPrevLink > span {border-radius:30px 0 0 30px;right: 0;padding-left: 14px;}
#lbNextLink {left: 0;}
#lbNextLink > span {border-radius:0 30px 30px 0;padding-right: 14px;left: 0;}
#lbEnlarge, #lbCloseLink {cursor: pointer;display: block;float:left;padding-left: 7px;outline: none;}
#lbCenter, #lbBottomContainer {background-color: #fff;overflow: hidden;position: absolute;z-index: 400;}
#lbCenter > .icon-spinner {right: 50%;margin:-21px -21px 0 0;position: absolute;top: 50%;}
#lbImage {background-repeat: no-repeat;background-size: cover;border: 10px solid #fff;right: 0;position: absolute;top: 0;}
#lbImage:hover #lbNextLink > span, #lbImage:hover #lbPrevLink > span {display: block;}
#lbBottom {border: 10px solid #fff;border-top-style: none;color: #666;}
#lbCaption, #lbNumber {margin-left: 71px;}
#lbCaption {font-weight: bold;}
.wcfImageViewer {background-color: #000000;bottom: 0;display: none;right: 0;opacity: 0;position: fixed;left: 0;top: 0;z-index: 399;}
.wcfImageViewer .icon {color: #666666;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.wcfImageViewer.open {display: block;opacity: 1;}
.wcfImageViewer.maximized:not(.wcfImageViewerMobile) > header {top: -100px;}
.wcfImageViewer.maximized:not(.wcfImageViewerMobile) > div {bottom: 0;border-color: rgba(51,51,51,0);top: 0;}
.wcfImageViewer.maximized:not(.wcfImageViewerMobile) > footer {bottom: -100px;}
.wcfImageViewer.wcfImageViewerStatic > header > div > h1, .wcfImageViewer.wcfImageViewerStatic > header > div > h2, .wcfImageViewer.wcfImageViewerStatic > header > div > h3 {margin-right: 0 !important;}
.wcfImageViewer.wcfImageViewerMobile > header, .wcfImageViewer.wcfImageViewerMobile > footer {background-color: #000000;opacity: 1;position: absolute;visibility: visible;z-index: 402;}
.wcfImageViewer.wcfImageViewerMobile.maximized > header, .wcfImageViewer.wcfImageViewerMobile.maximized > footer {opacity: 0;visibility: hidden;transition: visibility 0s linear .5s, opacity .5s linear;}
.wcfImageViewer.wcfImageViewerMobile.maximized > div > ul > li.pointer {opacity: 0;}
.wcfImageViewer.wcfImageViewerMobile > div {bottom: 0;top: 0;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li {background-color: #e0e0e0;border-radius: 30px;margin-top: -24px;opacity: 0;position: absolute;top: 50%;z-index: 30;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.pointer {opacity: 1;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonPrevious {right: 10px;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonPrevious > span {right: -3px;position: relative;top: 2px;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonNext {left: 10px;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonNext > span {position: relative;left: -1px;top: 2px;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonFull {bottom: 80px;right: 50%;top: auto;transform: translateX(-50%);-ms-transform: translateX(-50%);-webkit-transform: translateX(-50%);}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonFull > span {font-size: 32px;right: 2px;position: relative;top: 10px;}
.wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonToggle, .wcfImageViewer.wcfImageViewerMobile > div > ul > li.wcfImageViewerSlideshowButtonEnlarge {display: none;}
.wcfImageViewer.wcfImageViewerMobile > footer > .wcfImageViewerButtonPrevious, .wcfImageViewer.wcfImageViewerMobile > footer > .wcfImageViewerButtonNext {display: none;}
.wcfImageViewer.wcfImageViewerMobile > footer > div {margin: 0;}
.wcfImageViewer > header, .wcfImageViewer > div, .wcfImageViewer > footer {box-sizing: border-box;-moz-box-sizing: border-box;right: 0;position: fixed;left: 0;z-index: 400;}
.wcfImageViewer > header {height: 100px;overflow: hidden;padding: 1rem;top: 0;}
.wcfImageViewer > header > div > h1, .wcfImageViewer > header > div > h2, .wcfImageViewer > header > div > h3 {color: #d3d3d3;margin-right: 80px !important;}
.wcfImageViewer > header > div > h1 > a, .wcfImageViewer > header > div > h2 > a, .wcfImageViewer > header > div > h3 > a {color: #d3d3d3;}
.wcfImageViewer > header > div > h1 {font-size: 1.75rem;}
.wcfImageViewer > header > div > h2 {font-size: 1.25rem;}
.wcfImageViewer > header > div > h3 {color: #d3d3d3;font-size: .85rem;margin-top: .25rem;}
.wcfImageViewer > header > div > a > img {height: 64px;width: 64px;}
.wcfImageViewer > header > .wcfImageViewerButtonClose {opacity: .6;position: absolute;left: 26px;top: 26px;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer > header > .wcfImageViewerButtonClose:hover {opacity: 1;}
.wcfImageViewer > div {background-color: #000000;border-bottom: 1px solid #333333;border-top: 1px solid #333333;bottom: 100px;top: 100px;z-index: 401;-webkit-transition-property: top, bottom, border-color;transition-property: top, bottom, border-color;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer > div.loading:before {content: "\f110";margin:-24px -24px 0 0;right: 50%;position: absolute;top: 50%;color: #666666;display: inline-block;font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;line-height: 1em;text-align: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);font-size: 42px;height: 48px;width: 48px;height: auto;-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
.wcfImageViewer > div > img {opacity: 0;position: absolute;top: 50%;z-index: 10;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .75s;transition-duration: .75s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer > div > img.animateTransformation {transition: left .3s, margin-top .3s, height .3s, width .3s, opacity .75s;-webkit-transition: left .3s, margin-top .3s, height .3s, width .3s, opacity .75s;}
.wcfImageViewer > div > img.active {opacity: 1;z-index: 20;}
.wcfImageViewer:not(.wcfImageViewerMobile) > header {-webkit-transition-property: top;transition-property: top;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer:not(.wcfImageViewerMobile) > footer {-webkit-transition-property: bottom;transition-property: bottom;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div {cursor: pointer;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > img, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul {cursor: default;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul {background-color: #000000;border: 1px solid #333333;border-bottom-width: 0;border-radius:5px 5px 0 0;bottom: 0;display: inline-block;right: 50%;margin-right: -122px;opacity: .4;position: absolute;z-index: 30;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .5s;transition-duration: .5s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul:hover {opacity: 1;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li {display: inline-block;opacity: .6;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .5s;transition-duration: .5s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.pointer > span.icon {cursor: pointer;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.active, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.pointer:hover {opacity: 1;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonToggle > span, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonEnlarge > span, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonFull > span {font-size: 28px;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonToggle > span:before, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonEnlarge > span:before, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonFull > span:before {right: 2px;position: relative;top: 9px;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonEnlarge, .wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li.wcfImageViewerSlideshowButtonFull {border-right: 1px solid #333333;box-sizing: border-box;}
.wcfImageViewer:not(.wcfImageViewerMobile) > div > ul > li > span {vertical-align: middle;}
.wcfImageViewer > footer {bottom: 0;height: 100px;padding: 10px;}
.wcfImageViewer > footer:hover > div > ul > li > img {filter: none;-webkit-filter: none;}
.wcfImageViewer > footer > span {bottom: 0;font-size: 48px;padding-top: 26px;opacity: 0;position: absolute;top: 0;width: 30px;z-index: 2;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .5s;transition-duration: .5s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer > footer > span.pointer {opacity: .6;}
.wcfImageViewer > footer > span.pointer:hover {opacity: 1;}
.wcfImageViewer > footer > span.wcfImageViewerButtonPrevious {right: 5px;}
.wcfImageViewer > footer > span.wcfImageViewerButtonNext {left: 5px;}
.wcfImageViewer > footer > div {height: 80px;margin: 0 35px;overflow: hidden;white-space: nowrap;}
.wcfImageViewer > footer > div > ul {font-size: 0;height: 80px;z-index: 1;transition: margin-left cubic-bezier(.5,1.595,.56,.98) .75s;-webkit-transition: margin-left cubic-bezier(.5,1.595,.56,.98) .75s;}
.wcfImageViewer > footer > div > ul > li {display: inline-block;height: 80px;opacity: .6;position: relative;width: 80px;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .5s;transition-duration: .5s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wcfImageViewer > footer > div > ul > li.active, .wcfImageViewer > footer > div > ul > li:hover {opacity: 1;}
.wcfImageViewer > footer > div > ul > li:not(:last-child) {margin-left: 10px;}
.wcfImageViewer > footer > div > ul > li.active > img {filter: none;-webkit-filter: none;}
.wcfImageViewer > footer > div > ul > li.loading:before {content: "\f110";margin:-16px -16px 0 0;right: 50%;position: absolute;top: 50%;z-index: -1;color: #666666;display: inline-block;font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;line-height: 1em;text-align: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);font-size: 28px;height: 32px;width: 32px;vertical-align: -5px;height: auto;-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
.wcfImageViewer > footer > div > ul > li.loading > img {opacity: 0;}
.wcfImageViewer > footer > div > ul > li > img {height: 80px;opacity: 1;width: 80px;filter: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cfilter%20id%3D%22grayscale%22%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200%22%2F%3E%3C%2Ffilter%3E%3C%2Fsvg%3E#grayscale);filter: gray;-webkit-filter: grayscale(1);transition: filter .5s, opacity 1s;-webkit-transition: -webkit-filter .5s, opacity 1s;}
@media only screen and (max-width: 800px) {
.wcfImageViewer > header {height: 80px;}
.wcfImageViewer > header > .wcfImageViewerButtonClose {left: 16px;top: 16px;}
.wcfImageViewer > footer {height: 80px;}
.wcfImageViewer > footer > div {height: 60px;}
.wcfImageViewer > footer > div > ul {height: 60px;}
.wcfImageViewer > footer > div > ul > li {height: 60px;}
}
.labelList {font-size: 0;margin-bottom: -4px;}
.labelList > li {display: inline-block;margin-bottom: 4px;}
.labelList > li:not(:last-child) {margin-left: 4px;}
.boxHeadline.labeledHeadline {font-size: 0;}
.boxHeadline.labeledHeadline > ul {display: inline-block;font-size: 1rem;}
.boxHeadline.labeledHeadline > ul:not(:empty) {margin-left: 7px;}
.boxHeadline.labeledHeadline > ul.statusIcons > li {display: inline-block;}
.boxHeadline.labeledHeadline > ul.labelList {position: relative;top: -4px;}
.boxHeadline.labeledHeadline > h1, .boxSubHeadline.labeledHeadline > h2 {display: inline-block;margin-left: 7px;}
#labelList::before, #labelList::after {display: table;content: "";}
#labelList::after {clear: both;}
#labelList li {float:right;margin-left: 1%;width: 30%;}
#labelList li.labelCustomClass {position: relative;}
#labelList li.labelCustomClass input[type='radio'] {right: 0;position: absolute;top: 0;}
#labelList li.labelCustomClass span {display: block;margin-right: 24px;}
.labelChooser > .dropdownToggle > span {cursor: pointer;}
.layoutFluid {margin-right: auto;margin-left: auto;min-width: 980px;max-width: 90%;}
@media only screen and (max-width: 800px) {
.layoutFluid {min-width: 0;max-width: none;}
}
.layoutFixed {margin-right: auto;margin-left: auto;width: 1200px;}
@media only screen and (max-width: 800px) {
.layoutFixed {width: auto;}
}
@media only screen and (min-width: 801px) {
body {min-width: 980px;}
}
#pageHeader {z-index: 100;}
@media only screen and (max-width: 800px) {
#pageHeader {margin-top: 48px;}
}
#top {display: block;height: 1px;visibility: hidden;}
.userPanel {background-color: rgba(0,0,0,0.5);height: 40px;right: 0;overflow: hidden;position: absolute;top: 0;left: 0;z-index: 200;}
.userPanel .icon {color: #ffffff;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.userPanel > div {position: relative;}
.userPanel > div > ul.userPanelItems::before, .userPanel > div > ul.userPanelItems::after {display: table;content: "";}
.userPanel > div > ul.userPanelItems::after {clear: both;}
.userPanel > div > ul.userPanelItems > li {float:right;}
.userPanel > div > ul.userPanelItems > li > a, .userPanel > div > ul.userPanelItems > li > div:not(.dropdownMenu) {color: #ffffff;display: block;height: 20px;padding:12px 8px 8px 8px;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.userPanel > div > ul.userPanelItems > li > a:hover, .userPanel > div > ul.userPanelItems > li > div:not(.dropdownMenu):hover {background-color: rgba(0,0,0,0.4);color: #ffffff;text-decoration: none;}
.userPanel > div > ul.userPanelItems > li > a > .badge.badgeInverse, .userPanel > div > ul.userPanelItems > li > div:not(.dropdownMenu) > .badge.badgeInverse {background-color: #336699;color: #ffffff;}
.userPanel > div > ul.userPanelItems > li > a > img, .userPanel > div > ul.userPanelItems > li > div:not(.dropdownMenu) > img {position: relative;top: -2px;}
.userPanel > div > ul.userPanelItems > li > .framed > img {margin-top: -5px;margin-bottom: -4px;padding: 0px;top: 0;}
.userPanel > div > .searchBar {background-color: rgba(0,0,0,0.4);position: absolute;left: 0;top: 0;}
.userPanel > div > .searchBar::before {content: "\f002";color: #ffffff;font-family: FontAwesome;font-size: 14px;right: 7px;position: absolute;top: 12px;}
.userPanel > div > .searchBar.loading::before {content: "\f110";-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
.userPanel > div > .searchBar > form {display: inline-block;}
.userPanel > div > .searchBar > form input[type="search"] {background-color: transparent;border-width: 0;color: #ffffff;height: 40px;padding:6px 26px 5px 12px;width: 240px;-webkit-appearance: textfield;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.userPanel > div > .searchBar > form input[type="search"]:focus {outline: 0;}
.userPanel > div > .searchBar > form input[type="search"]::-webkit-input-placeholder {color: #cccccc;}
.userPanel > div > .searchBar > form input[type="search"]::-moz-placeholder {color: #cccccc;}
.userPanel > div > .searchBar > form input[type="search"]:-ms-input-placeholder {color: #cccccc;}
.userPanel > div > .searchBar > form input[type="search"]::-webkit-search-cancel-button {display: none;}
.userPanel > div > .searchBar .dropdownMenu li > span {max-width: 210px;overflow: hidden;text-overflow: ellipsis;}
@media only screen and (max-width: 800px) {
.userPanel {height: 41px;}
.userPanel .icon {font-size: 21px;height: auto;width: auto;}
.userPanel > div > ul.userPanelItems > li > a, .userPanel > div > ul.userPanelItems > li > div:not(.dropdownMenu) {height: 21px;padding:11px 11px 9px 11px;}
.userPanel > div > ul.userPanelItems > li > .framed > img {margin-top: -4px;}
.userPanel > div > ul.userPanelItems > li > a > span:not(.icon):not(.badge), .userPanel > div > ul.userPanelItems > li#pageLanguageContainer > div > div > div > h3 {display: none;}
.userPanel > div > ul.userPanelItems > li > a > .badge {top: -4px;}
.userPanel > div > .searchBar {height: 41px;min-width: 40px;left: 0 !important;}
.userPanel > div > .searchBar::before {font-size: 21px;}
.userPanel > div > .searchBar > form {display: none;}
.userPanel > div > .searchBar > form input[type="search"] {height: 41px;padding-right: 40px;width: 100%;}
.userPanel > div > .searchBar.searchBarOpen {width: 100%;}
.userPanel > div > .searchBar.searchBarOpen > form {display: block;}
.userPanel > div > .searchBar::before {top: 8px;}
}
.logo {margin-bottom: 21px;margin-top: 14px;}
.logo::before, .logo::after {display: table;content: "";}
.logo::after {clear: both;}
.logo a {display: block;}
.logo a:hover {text-decoration: none;}
.logo a h1 {color: #ffffff;float:left;font-size: 1.7rem;padding-top: 21px;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.userPanel + .logo {margin-top: 57px;}
@media only screen and (max-width: 800px) {
.logo {display: none;}
}
.sitemapList {margin: 0 -7px;}
.sitemapList li > a, .sitemapList li > h3 {overflow: hidden;padding: 4px 14px;}
.sitemapList li > a {border-radius: 6px;display: block;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.sitemapList li > a:hover {background-color: #d8e7f5;text-decoration: none;}
.sitemapList > li:not(:first-child) {margin-top: 7px;}
.sitemapList > li:not(:last-child) {border-bottom: 1px solid #cccccc;padding-bottom: 7px;}
.sitemapList > li > ul > li > a {padding-right: 35px;}
.sitemapList > li > ul > li > ul > li a {padding-right: 56px;}
.mainMenu {font-size: 0;white-space: nowrap;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.mainMenu > ul {background-color: #f1f5fa;display: inline-block;}
.mainMenu > ul > li {display: inline-block;font-size: 1.2rem;vertical-align: middle;}
.mainMenu > ul > li > a {color: #488ed4;display: inline-block;padding: 4px 9px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.mainMenu > ul > li > a:hover {color: #336699;text-decoration: none;}
.mainMenu > ul > li > a > span {color: #488ed4;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.mainMenu > ul > li > a > span:hover {text-decoration: none;}
.mainMenu > ul > li.active > a, .mainMenu > ul > li.active > a:hover {background-color: #e4eef8;color: #336699;font-weight: bold;text-align: center;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.mainMenu > ul > li:not(:last-child) > a {border-left: 1px solid #cccccc;}
@media screen and (min-width: 801px),print {
.mainMenu > ul > li {margin-top: -7px;vertical-align: bottom;}
.mainMenu > ul > li > a {padding: 9px 21px;}
.mainMenu > ul > li.active {font-size: 1.4rem;margin-top: -8px;}
.mainMenu > ul > li.active > a {min-width: 80px;padding: 14px 21px 8px;}
.mainMenu > ul > li:not(.active) {padding-top: 5px;}
}
@media only screen and (max-width: 800px) {
.mainMenu > ul > li.active {margin-bottom: -1px;}
.mainMenu > ul > li.active > a {padding-bottom: 5px;}
}
.navigation {padding: 0 7px;}
.navigation > ul {display: inline-block;font-size: 0;}
.navigation > ul.navigationItems, .navigation > ul.navigationIcons {float:left;}
.navigation > ul.navigationItems > li, .navigation > ul.navigationIcons > li {float:left;}
.navigation > ul.navigationIcons > li {padding: 0 3px;}
.navigation > ul.navigationIcons > li > a {display: inline-block;padding: 4px 3px 3px;}
.navigation > ul.navigationItems {border-left: 1px dotted #cccccc;}
.navigation > ul.navigationItems > li > p {color: #336699;}
.navigation > ul.navigationItems > li, .navigation > ul.navigationMenuItems > li {font-size: 1rem;margin: 4px 7px 2px;}
.navigation > ul.navigationItems > li > a, .navigation > ul.navigationMenuItems > li > a {color: #336699;}
.navigation > ul.navigationItems > li > a:hover, .navigation > ul.navigationMenuItems > li > a:hover {color: #003366;text-decoration: none;}
.navigation > ul.navigationItems .icon, .navigation > ul.navigationMenuItems .icon, .navigation > ul.navigationIcons .icon {color: #336699;}
.navigation > ul.navigationMenuItems {float:right;}
.navigation > ul.navigationMenuItems > li {display: inline-block;}
.navigation > ul.navigationMenuItems > li > .badge {top: -2px;}
@media only screen and (max-width: 800px) {
.navigation.navigationHeader > ul.navigationIcons, .navigation.navigationHeader > ul.navigationItems {display: none;}
.navigation.navigationFooter > ul.navigationIcons, .navigation.navigationFooter > ul.navigationItems {display: none;}
.navigation.navigationFooter > ul.navigationMenuItems > li {margin:4px 0 4px 7px;}
}
.navigationHeader {overflow: hidden;background-color: #e4eef8;border-bottom: 1px solid #cccccc;border-top: 1px solid #cccccc;}
.navigationHeader::before, .navigationHeader::after {display: table;content: "";}
.navigationHeader::after {clear: both;}
.navigationHeader > ul.navigationMenuItems {white-space: nowrap;}
.navigationFooter {background-color: #e4eef8;border-top: 1px solid #cccccc;}
.navigationFooter::before, .navigationFooter::after {display: table;content: "";}
.navigationFooter::after {clear: both;}
@media only screen and (max-width: 800px) {
.navigationHeader {min-height: 4px;}
}
.footer {padding-bottom: 14px;z-index: 100;}
.footer .footerContent {text-align: center;}
.footer .footerContent a {text-shadow:-0 -1px 0 rgba(0,0,0,0.8);-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.footer .footerContent a:hover {text-decoration: none;}
@media only screen and (max-width: 800px) {
.footerContent {margin: 0 14px;}
}
#main {background-color: #ffffff;border-left: 1px solid transparent;box-sizing: border-box;-moz-box-sizing: border-box;z-index: 110;}
#main.sidebarOrientationRight {background-color: #d8e7f5;}
#main > div {display: table;table-layout: fixed;width: 100%;}
#main > div > div {display: table-row;}
#main > div > div > .sidebar, #main > div > div > .content {display: table-cell;vertical-align: top;}
#main > div > div > .sidebar > .mobileSidebarToggleButton, #main > div > div > .content > .mobileSidebarToggleButton {display: none;}
#main > div > div > .sidebar {background-color: #d8e7f5;width: 300px;z-index: 120;-webkit-transition-property: width;transition-property: width;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: ease;transition-timing-function: ease;}
#main > div > div > .sidebar > span {display: inline-block;position: absolute;}
#main > div > div > .sidebar > span > .collapsibleButton {background-color: #d8e7f5;border-radius:0 6px 6px 0;display: block;height: 24px;right: -20px;position: absolute;text-decoration: none;top: 0;width: 24px;}
#main > div > div > .sidebar > span > .collapsibleButton::before {content: "\f054";font-family: FontAwesome;font-size: 14px;position: absolute;right: 6px;top: 4px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
#main > div > div > .sidebar > div {overflow: hidden;width: 300px;-webkit-transition-property: width;transition-property: width;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: ease;transition-timing-function: ease;}
#main > div > div > .content {background-color: #ffffff;min-height: 100px;padding: 7px 38px 21px;z-index: 130;}
#main:not(.sidebarOrientationLeft):not(.sidebarOrientationRight) .sidebar {display: none;}
@media only screen and (max-width: 800px) {
#main {position: relative;}
#main > div > div > .sidebar, #main > div > div > .content {width: 100%;}
#main.sidebarOrientationLeft > div > div > .sidebar {display: none;}
#main.sidebarOrientationLeft > div > div > .sidebar > div {width: 100%;}
#main.sidebarOrientationLeft > div > div > .sidebar > div fieldset {width: 100%;}
#main.sidebarOrientationLeft > div > div > .sidebar > .mobileSidebarToggleButton {border-radius:0 0 3px 0;border-width:0 1px 1px 0;display: block;left: -3px;position: absolute;top: 0;}
#main.sidebarOrientationLeft > div > div > .content {padding-top: 35px;}
#main.sidebarOrientationLeft > div > div > .content > .mobileSidebarToggleButton {border-radius:0 0 0 3px;border-width:0 0 1px 1px;display: block;right: -3px;position: absolute;top: 0;}
#main.sidebarOrientationRight > div > div > .sidebar {display: none;}
#main.sidebarOrientationRight > div > div > .sidebar > div {width: 100%;}
#main.sidebarOrientationRight > div > div > .sidebar > div fieldset {width: 100%;}
#main.sidebarOrientationRight > div > div > .sidebar > .mobileSidebarToggleButton {border-radius:0 0 0 3px;border-width:0 0 1px 1px;display: block;right: -3px;position: absolute;top: 0;}
#main.sidebarOrientationRight > div > div > .content {padding-top: 35px;}
#main.sidebarOrientationRight > div > div > .content > .mobileSidebarToggleButton {border-radius:0 0 3px 0;border-width:0 1px 1px 0;display: block;left: -3px;position: absolute;top: 0;}
#main.mobileShowSidebar > div > div > .sidebar {display: table-cell;padding-top: 35px;}
#main.mobileShowSidebar > div > div > .content {display: none;}
#main .content {border-right: 0 !important;border-left: 0 !important;margin-right: 0;margin-left: 0;padding-right: 0 !important;padding-left: 0 !important;}
#main .content > *:first-child {margin-top: 0;}
}
@media only screen and (min-width: 801px) and (max-width: 1239px) {
#main > div > .content {padding-right: 28px;padding-left: 28px;}
}
@media only screen and (min-width: 801px) {
#main.sidebarOrientationRight.sidebarCollapsed > div > div > .sidebar {width: 20px;}
#main.sidebarOrientationRight.sidebarCollapsed > div > div > .sidebar > span > .collapsibleButton::before {content: "\f053";}
#main.sidebarOrientationRight.sidebarCollapsed > div > div > .sidebar > div {width: 0;}
}
html[dir="rtl"] #main.sidebarOrientationRight > div > div > .sidebar > span > .collapsibleButton::before {content: "\f053";}
html[dir="rtl"] #main.sidebarOrientationRight.sidebarCollapsed > div > div > .sidebar > span > .collapsibleButton::before {content: "\f054";}
.boxHeadline {margin-top: 14px;overflow: hidden;}
.boxHeadline h1 {font-size: 1.7rem;}
.boxHeadline > p {color: #808080;font-size: .85rem;}
.boxHeadline > .dataList, .boxHeadline > .inlineDataList {color: #808080;font-size: .85rem;}
.boxHeadline > h1, .boxSubHeadline > h2 {color: #666666;font-family: "Trebuchet MS", Arial, sans-serif;font-weight: bold;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.boxHeadline > h1 a, .boxSubHeadline > h2 a {color: #666666;text-decoration: none;}
.boxSubHeadline > h2 {font-size: 1.4rem;}
@media only screen and (max-width: 800px) {
.boxHeadline {margin-top: 7px;margin-right: 7px;margin-left: 7px;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.boxHeadline {margin-right: 14px;margin-left: 14px;}
}
.contentNavigation {display: table;width: 100%;}
.contentNavigation > * {margin-top: 14px;}
.contentNavigation > nav.pageNavigation > ul {float:right;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) {margin-left: 2px;float:left;font-size: 0;margin-bottom: -7px;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li {display: inline-block;font-size: 1rem;margin-bottom: 7px;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li:not(:last-child) {margin-left: 8px;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li .button {margin-right: 0;margin-left: 0;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup).smallButtons > li:not(:last-child) {margin-left: 4px;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup).iconList > li:not(:last-child) {margin-left: 2px;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li:not(:last-child) {margin-left: 0;}
.contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li:not(:first-child) {margin-right: 8px;}
.contentNavigation > nav:not(.pageNavigation) > ul.buttonGroup {float:left;}
.contentNavigation > nav:not(.pageNavigation) + nav.jsClipboardEditor > ul, .contentNavigation > nav:not(.pageNavigation) + nav > ul.buttonGroup {margin-left: 8px;}
@media only screen and (max-width: 800px) {
.contentNavigation {box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;padding-right: 7px;padding-left: 7px;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.contentNavigation {padding-right: 14px;padding-left: 14px;}
}
.container {background-color: #fcfdfe;border: 1px solid #cccccc;}
.containerPadding {padding: 14px 21px 14px;}
@media only screen and (max-width: 800px) {
.container {border-width: 1px 0;}
.containerPadding {padding: 7px;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.containerPadding {padding-right: 14px;padding-left: 14px;}
}
.containerHeadline > h3 {font-size: 1.2rem;font-weight: bold;}
.containerHeadline > h3 > small {color: #808080;font-weight: normal;text-shadow: none;white-space: nowrap;word-wrap: normal;}
.containerHeadline > h3 > .badge {top: -1px;}
.containerHeadline > h3, .containerHeadline > h3 > a {text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.containerHeadline + * {margin-top: 7px;}
.containerList > li {padding: 14px 21px;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.containerList > li:nth-child(even) {background-color: #f1f5fa;}
.containerList > li:hover {background-color: #d8e7f5;}
.containerList > li:hover > div > div > .buttonGroupNavigation > .buttonList {opacity: 1;}
.containerList > li:hover > div > div > .containerHeadline > .containerContentType {color: #808080;}
.containerList > li.showMore {text-align: center;}
.containerList > li.showMore > button {padding-right: 30px;padding-left: 30px;}
.containerList > li.showMore > small {color: #808080;}
.containerList > li > div > div {position: relative;}
.containerList > li > div > div > .buttonGroupNavigation {margin-top: 0;position: absolute;left: 0;top: 0;}
.containerList > li > div > div > .buttonGroupNavigation > .buttonList {opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.containerList > li > div > div > .containerHeadline > .containerContentType {color: #b3b3b3;position: absolute;left: 0;top: 3px;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.containerList > li > div > div > .containerHeadline .newContentBadge {color: #ffffff;text-transform: uppercase;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);background-color: #264c73;background-image: -webkit-linear-gradient(#336699,#264c73);background-image: linear-gradient(#336699,#264c73);}
.containerList > * > li {padding: 14px 21px;}
.containerList.styleList > li > div.box64 > span {text-align: center;width: 110px;}
.containerList.styleList > li > div.box64 > div {margin-right: 115px;}
@media only screen and (max-width: 800px) {
.containerList > li {padding: 7px;}
.containerList > li .containerContentType {display: none;}
.containerList.infoBoxList > li.box32 > span.icon {display: none;}
.containerList.infoBoxList > li.box32 > div {margin-right: 0;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.containerList > li {padding: 7px 14px;}
}
@media screen and (min-width: 1240px) {
.containerList.doubleColumned {overflow: hidden;}
.containerList.doubleColumned > li {padding: 0;float:right;width: 50%;height: 90px;overflow: hidden;}
.containerList.doubleColumned > li:nth-child(even) {float:left;}
.containerList.doubleColumned > li:nth-child(4n), .containerList.doubleColumned > li:nth-child(4n+1) {background-color: #fcfdfe;}
.containerList.doubleColumned > li:nth-child(4n+2), .containerList.doubleColumned > li:nth-child(4n+3) {background-color: #f1f5fa;}
.containerList.doubleColumned > li:hover {background-color: #d8e7f5;}
.containerList.doubleColumned > li > div {padding: 14px 21px;}
.containerList.doubleColumned::after {content: "";display: table;clear:right;}
}
.nestedCategoryList > li {margin-top: 14px;overflow: hidden;}
.nestedCategoryList > li:first-child {margin-top: 0;}
.nestedCategoryList > li > div {padding: 0 14px;}
.nestedCategoryList > li > div > ol {margin-top: 0;}
.nestedCategoryList > li > div > ol > li {display: inline-block;font-size: .85rem;}
.flexibleCategoryList {position: relative;}
.flexibleCategoryList > li {margin-bottom: 14px;}
.flexibleCategoryList > li > ol {margin-right: 21px;}
.flexibleCategoryList > li > ol > li > ol {margin-bottom: 7px;margin-right: 21px;}
.flexibleCategoryList > li > ol > li > ol > li {font-size: .85rem;}
@media all and (min-width: 801px) {
.nestedCategoryList.doubleColumned > li {float:right;width: 50%;}
.nestedCategoryList.doubleColumned > li:nth-child(odd):not(:first-child) {clear:right;}
.nestedCategoryList.doubleColumned > li:nth-child(2) {margin-top: 0;}
.nestedCategoryList.doubleColumned::after {content: "";display: table;clear:right;}
.flexibleCategoryList:not(.flexibleCategoryListDisabled) {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;}
.flexibleCategoryList:not(.flexibleCategoryListDisabled) > li {-webkit-column-break-inside: avoid;break-inside: avoid;}
.flexibleCategoryList:not(.flexibleCategoryListDisabled) > li > ol > li > ol {font-size: 0;}
.flexibleCategoryList:not(.flexibleCategoryListDisabled) > li > ol > li > ol > li {display: inline-block;}
@-moz-document url-prefix() {.flexibleCategoryList:not(.flexibleCategoryListDisabled) > li {display: block;overflow: hidden;}
}
}
.sidebarNestedCategoryList ol {margin-right: 14px;}
.sidebarNestedCategoryList li {margin: 6px 0;position: relative;}
.sidebarNestedCategoryList li > span {position: absolute;left: 0;top: 2px;}
.sidebarNestedCategoryList li > a {display: block;overflow: hidden;padding-left: 45px;text-overflow: ellipsis;}
.sidebarNestedCategoryList li.active > a {font-weight: bold;}
.containerBoxList {margin-bottom: -7px;}
.containerBoxList > li {margin-bottom: 7px;}
.containerBoxList > li > div {overflow: hidden;white-space: nowrap;word-wrap: normal;}
@media all and (min-width: 801px) {
.containerBoxList.doubleColumned::before, .containerBoxList.doubleColumned::after, .containerBoxList.tripleColumned::before, .containerBoxList.tripleColumned::after {display: table;content: "";}
.containerBoxList.doubleColumned::after, .containerBoxList.tripleColumned::after {clear: both;}
.containerBoxList.doubleColumned > li, .containerBoxList.tripleColumned > li {float:right;}
.containerBoxList.doubleColumned > li > div, .containerBoxList.tripleColumned > li > div {margin-left: 21px;}
.containerBoxList.doubleColumned > li {width: 50%;}
.containerBoxList.doubleColumned > li:nth-child(odd):not(:first-child) {clear:right;}
.containerBoxList.tripleColumned > li {width: 33%;}
.containerBoxList.tripleColumned > li:nth-child(3n+1):not(:first-child) {clear:right;}
}
.box16 {min-height: 20px;}
.box16 > :first-child {float:right;}
.box16 > *:not(:first-child) {margin-right: 20px;}
.box16 > .framed ~ * {margin-right: 24px;}
.box24 {min-height: 28px;}
.box24 > :first-child {float:right;}
.box24 > *:not(:first-child) {margin-right: 28px;}
.box24 > .framed ~ * {margin-right: 32px;}
.box32 {min-height: 36px;}
.box32 > :first-child {float:right;}
.box32 > *:not(:first-child) {margin-right: 39px;}
.box32 > .framed ~ * {margin-right: 43px;}
.box48 {min-height: 52px;}
.box48 > :first-child {float:right;}
.box48 > *:not(:first-child) {margin-right: 55px;}
.box48 > .framed ~ * {margin-right: 59px;}
.box64 {min-height: 68px;}
.box64 > :first-child {float:right;}
.box64 > *:not(:first-child) {margin-right: 71px;}
.box64 > .framed ~ * {margin-right: 75px;}
.box96 {min-height: 100px;}
.box96 > :first-child {float:right;}
.box96 > *:not(:first-child) {margin-right: 107px;}
.box96 > .framed ~ * {margin-right: 111px;}
.box128 {min-height: 132px;}
.box128 > :first-child {float:right;}
.box128 > *:not(:first-child) {margin-right: 139px;}
.box128 > .framed ~ * {margin-right: 143px;}
.box256 {min-height: 260px;}
.box256 > :first-child {float:right;}
.box256 > *:not(:first-child) {margin-right: 277px;}
.box256 > .framed ~ * {margin-right: 281px;}
.breadcrumbs {box-sizing: border-box;overflow: hidden;position: relative;text-align:right;}
.breadcrumbs > ul::before, .breadcrumbs > ul::after {display: table;content: "";}
.breadcrumbs > ul::after {clear: both;}
.breadcrumbs > ul > li {float:right;font-size: .85rem;list-style: none;max-width: 30%;padding-left: 10px;position: relative;}
.breadcrumbs > ul > li:first-child > a::before {content: "\f015";display: inline-block;font-family: FontAwesome;font-size: 14px;margin:-3px 0 -3px 7px;vertical-align: -1px;}
.breadcrumbs > ul > li > a {color: #666666;display: block;overflow: hidden;padding:5px 5px 5px 1px;text-decoration: none;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.breadcrumbs > ul > li > .pointer {padding: 5px 0;position: absolute;top: 0;left: 0;}
@media only screen and (max-width: 800px) {
.content > .breadcrumbs {background-color: #ffffff;border: 1px solid #cccccc;border-radius: 6px;display: inline-block;margin-right: 7px;margin-left: 7px;max-width: 90%;}
.content > .breadcrumbs > ul > li {float: none;max-width: none;padding-left: 0;}
.content > .breadcrumbs > ul > li:not(:last-child) {display: none;}
.content > .breadcrumbs > ul > li > a {padding: 4px 14px;}
.content > .breadcrumbs > ul > li > a::before {content: "\f062";font-family: FontAwesome;font-size: 14px;padding-left: 7px;}
.content > .breadcrumbs > ul > li > .pointer {display: none;}
.content > .breadcrumbs ~ .breadcrumbs {display: none;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.content > .breadcrumbs {margin-right: 14px;margin-left: 14px;}
}
.smallBreadcrumbs > li {display: inline;font-size: .85rem;}
.tabMenu {display: block;margin-top: 21px;position: relative;text-align:right;}
.tabMenu > ul {background-color: #f1f5fa;border-color: #cccccc;border-style: solid;border-width:1px 1px 0 1px;display: inline-block;font-size: 0;position: relative;white-space: nowrap;word-wrap: normal;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.tabMenu > ul > li {display: inline-block;outline: 0;}
.tabMenu > ul > li.ui-state-active > a {background-color: #fcfdfe;border-color: #cccccc #cccccc #fcfdfe;border-style: solid;border-width: 1px;color: #336699;font-weight: bold;z-index: 30;}
.tabMenu > ul > li > a {color: #808080;display: inline-block;font-size: 1.1rem;outline: 0;padding: 7px 10px;position: relative;text-decoration: none;z-index: 10;}
.tabMenu > ul > li > a > .badge {top: -1px;}
.tabMenu > ul > li:not(.ui-state-active) > a:hover {color: #336699;}
@media only screen and (max-width: 800px) {
.tabMenu > ul > li.ui-state-active {margin-top: -1px;}
.tabMenu > ul > li.ui-state-active:first-child {margin-right: -1px;}
.tabMenu > ul > li.ui-state-active:last-child {margin-left: -1px;}
}
@media all and (min-width: 801px) {
.tabMenu > ul {padding:0 5px 3px 5px;}
.tabMenu > ul > li > a {bottom: -3px;padding: 1px 10px 3px;}
.tabMenu > ul > li.ui-state-active > a {font-size: 1.3rem;margin-top: -10px;padding: 10px 15px 5px;}
.tabMenu > ul > li.ui-state-active:first-child {margin-right: -6px;}
.tabMenu > ul > li.ui-state-active:last-child {margin-left: -6px;}
}
.tabMenu > ul > li.ui-state-active > a, .tabMenu > ul > li.ui-state-disabled > a, .tabMenu > ul > li.ui-state-processing > a {cursor: default;}
.tabMenuContent {display: block;margin-top: -1px;min-height: 21px;position: relative;z-index: 20;}
.tabMenuContainer.containerPadding > .menu {margin:-14px -21px 14px -21px;}
.tabMenuContainer > .menu {border-bottom: 1px solid #cccccc;padding: 4px 7px;background-color: #fcfdfe;background-image: -webkit-linear-gradient(#fcfdfe,#f1f5fa);background-image: linear-gradient(#fcfdfe,#f1f5fa);}
.tabMenuContainer > .menu ul {display: inline-block;font-size: 0;white-space: nowrap;}
.tabMenuContainer > .menu ul li {display: inline-block;outline: 0;vertical-align: bottom;}
.tabMenuContainer > .menu ul li.ui-state-active a, .tabMenuContainer > .menu ul li.ui-state-active a:hover {background-color: #d8e7f5;border-color: #6699cc;color: #6699cc;cursor: default;}
.tabMenuContainer > .menu ul li a {background-color: #fcfdfe;border: 1px solid #cccccc;border-radius: 15px;color: #999999;display: block;font-size: .85rem;margin: 4px 0;outline: 0;padding: 4px 7px;}
.tabMenuContainer > .menu ul li a:hover {background-color: #ffe5c8;border-color: #ffaa22;color: #666666;text-decoration: none;}
.tabMenuContainer > .menu ul li:not(:last-child) {padding-left: 4px;}
.tabMenuContainer > .menu ul li.dropdown > a {font-size: 1.0rem;padding: 4px 7px 2px;}
@media only screen and (max-width: 800px) {
.tabMenuContainer.containerPadding > .menu {margin:-7px -14px 7px -14px;}
}
.containerPadding > .tabMenuContainer:last-child {margin-bottom: 7px;}
.ui-tabs .ui-tabs-hide {display: none !important;}
.ui-helper-hidden {display: none;}
.ui-helper-hidden-accessible {position: absolute !important;clip: rect(1px 1px 1px 1px);clip: rect(1px,1px,1px,1px);}
.tabularBox {background-color: #336699;border: 1px solid #cccccc;}
.tabularBox > .container {border: 0;}
.tabularBoxTitle > header {color: #ffffff;padding: 5px 7px;}
.tabularBoxTitle > header > h2 {font-size: 1.2rem;font-weight: bold;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.tabularBoxTitle > header > h2 > a {color: #ffffff;}
.tabularBoxTitle > header > h2 > a:hover {color: #ffffff;text-decoration: none;}
.tabularBoxTitle > header .icon {color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
@media only screen and (max-width: 800px) {
.tabularBox {border-width: 1px 0;}
.tabularBoxTitle {border-top-width: 0;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.tabularBoxTitle > header {padding-right: 14px;padding-left: 14px;}
}
.table, .cke_wysiwyg_div table {border-spacing: 0;width: 100%;}
.table th, .table td, .cke_wysiwyg_div table th, .cke_wysiwyg_div table td {padding: 7px;text-align:right;vertical-align: middle;word-break: break-word;}
.table th > label, .table td > label, .cke_wysiwyg_div table th > label, .cke_wysiwyg_div table td > label {cursor: pointer;display: block;margin: -7px;padding: 7px;}
.table th > label > input[type="checkbox"], .table td > label > input[type="checkbox"], .cke_wysiwyg_div table th > label > input[type="checkbox"], .cke_wysiwyg_div table td > label > input[type="checkbox"] {margin: -1px 3px 0;}
.table th, .cke_wysiwyg_div table th {border-left: 1px solid rgba(0,0,0,0.2);color: #ffffff;font-size: .85rem;font-weight: bold;white-space: nowrap;word-wrap: normal;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);background-color: rgba(0,0,0,0.3);background-image: -webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.3));background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.3));}
.table th > a, .cke_wysiwyg_div table th > a {color: #ffffff;display: block;margin: -7px;position: relative;}
.table th > a:hover, .cke_wysiwyg_div table th > a:hover {text-decoration: none;}
.table th > a > img, .cke_wysiwyg_div table th > a > img {margin: -5px 0;}
.table th.active > a, .cke_wysiwyg_div table th.active > a {background-color: rgba(0,0,0,0.1);color: #ffffff;box-shadow: inset -0 10px 10px -10px rgba(0,0,0,0.1);}
.table th.ASC > a, .table th.DESC > a, .cke_wysiwyg_div table th.ASC > a, .cke_wysiwyg_div table th.DESC > a {padding-left: 20px;}
.table th.ASC > a::after, .table th.DESC > a::after, .cke_wysiwyg_div table th.ASC > a::after, .cke_wysiwyg_div table th.DESC > a::after {display: inline-block;font-family: FontAwesome;font-size: 14px;position: absolute;margin-right: 4px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.table th.ASC > a::after, .cke_wysiwyg_div table th.ASC > a::after {content: "\f0de";top: 8px;}
.table th.DESC > a::after, .cke_wysiwyg_div table th.DESC > a::after {content: "\f0dd";top: 3px;}
.table th:hover > a, .cke_wysiwyg_div table th:hover > a {background-color: rgba(0,0,0,0.2);color: #ffffff;}
.table th > *, .cke_wysiwyg_div table th > * {padding: 7px;}
.table td, .cke_wysiwyg_div table td {background-color: #fcfdfe;-webkit-transition-property: background;transition-property: background;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.table td.columnMark, .table td.columnStatus, .cke_wysiwyg_div table td.columnMark, .cke_wysiwyg_div table td.columnStatus {text-align: center;width: 1px;white-space: nowrap;word-wrap: normal;}
.table td.columnDigits, .table td.columnID, .cke_wysiwyg_div table td.columnDigits, .cke_wysiwyg_div table td.columnID {text-align:left;width: 1px;white-space: nowrap;word-wrap: normal;}
.table td.columnIcon, .cke_wysiwyg_div table td.columnIcon {text-align:right;width: 1px;white-space: nowrap;word-wrap: normal;}
.table td.columnTitle, .cke_wysiwyg_div table td.columnTitle {font-weight: bold;text-align:right;}
.table td.columnText, .cke_wysiwyg_div table td.columnText {font-weight: normal;text-align:right;max-width: 20%;}
.table td.columnDate, .cke_wysiwyg_div table td.columnDate {font-size: .85rem;text-align:left;width: 1px;white-space: nowrap;word-wrap: normal;}
.table td.columnURL, .table td.columnSmallText, .cke_wysiwyg_div table td.columnURL, .cke_wysiwyg_div table td.columnSmallText {font-size: .85rem;text-align:right;}
.table > tbody > tr:nth-child(even) > td, .cke_wysiwyg_div table > tbody > tr:nth-child(even) > td {background-color: #f1f5fa;}
.table > tbody > tr:not(:last-child) > td, .cke_wysiwyg_div table > tbody > tr:not(:last-child) > td {border-bottom: 1px solid rgba(255,255,255,0.3);}
.table > tbody > tr:hover > td, .cke_wysiwyg_div table > tbody > tr:hover > td {background-color: #d8e7f5;}
.table > tbody > tr > td:not(:last-child), .cke_wysiwyg_div table > tbody > tr > td:not(:last-child) {border-left: 1px solid rgba(255,255,255,0.3);}
.table > tbody > tr > td.focus, .cke_wysiwyg_div table > tbody > tr > td.focus {background-color: #d8e7f5;}
.table > tbody > tr > td.left, .cke_wysiwyg_div table > tbody > tr > td.left {text-align:right;}
.table > tbody > tr > td.right, .cke_wysiwyg_div table > tbody > tr > td.right {text-align:left;}
.table .statusDisplay, .cke_wysiwyg_div table .statusDisplay {float:left;}
.table .statusDisplay .statusIcons, .cke_wysiwyg_div table .statusDisplay .statusIcons {float:left;margin-right: 7px;}
.table .statusDisplay .statusIcons li, .cke_wysiwyg_div table .statusDisplay .statusIcons li {display: inline-block;}
.table tr.jsMarked, .cke_wysiwyg_div table tr.jsMarked {color: #666666;}
.table tr.jsMarked > td, .cke_wysiwyg_div table tr.jsMarked > td {background-color: #ffffc8 !important;}
.table tr.jsMarked a:not(.badge), .cke_wysiwyg_div table tr.jsMarked a:not(.badge) {color: #666666;}
@media screen and (max-width: 800px) {
.responsiveTable {display: block;}
.responsiveTable thead, .responsiveTable tbody, .responsiveTable th, .responsiveTable td, .responsiveTable tr {display: block;}
.responsiveTable thead tr {display: none;}
.responsiveTable tr {border: 1px solid #cccccc;border-top-width: 0;}
.responsiveTable tr:last-child {border-bottom-width: 0;}
.responsiveTable td {text-align:right !important;max-width: none !important;width: auto !important;}
}
dl.statsDataList > dt {color: #808080;display: block;float:left;font-size: .85rem;line-height: 1.5;overflow: hidden;text-align:right;white-space: nowrap;width: 62%;word-wrap: normal;}
dl.statsDataList > dt > a {text-decoration: none;}
dl.statsDataList > dt:not(:first-child) {clear: both;}
dl.statsDataList > dd {color: #666666;float:right;font-weight: bold;margin: 0;overflow: hidden;text-align:left;text-overflow: ellipsis;white-space: nowrap;width: 35%;word-wrap: normal;}
dl.statsDataList > dd > a {text-decoration: none;}
dl.statsDataList::after {display: table;content: "";clear: both;}
dl.inlineDataList {overflow: hidden;}
dl.inlineDataList > dd {display: inline-block;margin:0 0 0 4px;padding: 0;}
dl.inlineDataList > dt {color: #808080;display: inline-block;margin: 0;text-align:right;width: auto;}
dl.inlineDataList > dt::after {content: ":";}
dl.dataList::before, dl.dataList::after {display: table;content: "";}
dl.dataList::after {clear: both;}
dl.dataList dt {color: #808080;clear:left;float:right;margin-left: 4px;text-align:right;}
dl.dataList dt::after {content: ":";}
dl.dataList dd {float:left;text-align:left;}
dl.dataList dd:not(:last-child) {margin-bottom: 3px;}
ul.inlineDataList li, ul.dataList li {display: inline-block;}
ul.inlineDataList li:not(:last-child)::after, ul.dataList li:not(:last-child)::after {content: ",";}
ul.inlineDataList {display: inline-block;}
.contentNavigation .pageNavigation {float:right;margin: 19px 0 3px;}
.contentNavigation .pageNavigation ul li {margin: 0 2px;}
.pageNavigation ul li {border-radius: 3px;float:right;font-weight: bold;margin: 0 1px;min-width: 19px;padding: 0;text-align: center;}
.pageNavigation ul li:not(.active):not(.disabled) {cursor: pointer;}
.pageNavigation ul li.disabled {background-image: none;border: 1px solid rgba(0,0,0,0.1);cursor: not-allowed;}
.pageNavigation ul li.skip > a {padding: 2px 0 1px;}
.pageNavigation ul li.skip > span {padding: 3px 0 1px;}
.pageNavigation ul li:not(.disabled):hover > a {color: #666666;}
.pageNavigation ul li:not(.skip) > a {padding: 2px 3px;}
.pageNavigation ul li.active > span {padding: 2px 3px;}
.pageNavigation ul li > a {color: #999999;display: block;text-decoration: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.pageNavigation ul li > span:not(.invisible) {display: inline-block;}
@media only screen and (max-width: 800px) {
.pageNavigation > ul > li:not(.skip):not(.active) {display: none;}
.pageNavigation > ul > li:nth-last-child(2):not(.active) {display: block;}
.pageNavigation > ul > li.active > span.invisible {display: inline-block;}
.pageNavigation > ul > li.active > span:not(.invisible) {display: none;}
}
.statusDisplay .pageNavigation {font-size: .85rem;float:right;margin-top: 2px;}
.statusDisplay .pageNavigation ul li {min-width: 13px;}
.statusDisplay .pageNavigation ul li:not(.skip) a {padding: 1px;}
.sidebar > div > fieldset:not(:last-child), .sidebar > div > div:not(:last-child) {border-bottom: 1px solid #cccccc;margin-bottom: 14px;}
.sidebar.collapsibleMenu > div > fieldset, .sidebar.collapsibleMenu > div > div {border-bottom-width: 0;}
.sidebar {padding: 21px 0 7px;}
.sidebar fieldset {padding: 7px 14px 14px;margin-top: 0;box-sizing: border-box;-moz-box-sizing: border-box;min-width: 300px;width: 300px;}
.sidebar fieldset > legend {border-width: 0;color: #666666;font-family: "Trebuchet MS", Arial, sans-serif;font-weight: normal;font-size: 1rem;padding: 0;text-transform: uppercase;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.sidebar fieldset > legend > .badge {float:left;}
.sidebar fieldset > legend > a {color: #666666;text-decoration: none;}
.sidebar fieldset > legend.invisible + div {margin-top: -7px;}
.sidebar fieldset::after {content: "";height: 0;display: block;clear: both;}
.sidebar fieldset .button.more {margin: 5px 0 0;float:left;}
.sidebar fieldset > nav {margin: 0 -14px 0;}
.sidebar fieldset > nav ul > li.active {background-color: #ffffff;}
.sidebar fieldset > nav ul > li.active > a {font-weight: bold;}
.sidebar fieldset > nav ul > li:hover:not(.active) > a {color: #003366;}
.sidebar fieldset > nav ul > li > a {color: #336699;display: block;padding:4px 21px 7px 14px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.sidebar fieldset > nav ul > li > a:hover {text-decoration: none;}
.sidebar .sidebarBoxList > li:not(:last-child) {margin-bottom: 7px;}
.sidebar .sidebarBoxList {overflow: hidden;}
.sidebar .sidebarBoxHeadline > h3 {color: #336699;margin-bottom: 1px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.sidebar .sidebarBoxHeadline > h3 a {text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.sidebar .sidebarBoxHeadline > h3 small {text-shadow: none;}
.sidebar .formSubmit {margin-bottom: 14px;margin-top: 0;width: 300px;}
.sidebar.collapsibleMenu legend {color: #336699;cursor: pointer;font-weight: bold;font-size: 1.3rem;padding-right: 41px;position: relative;margin-right: -14px;text-transform: none;}
.sidebar.collapsibleMenu legend::before {content: "\f054";display: inline-block;font-family: FontAwesome;font-size: 14px;height: 16px;right: 21px;position: absolute;text-align: center;top: 2px;width: 16px;}
.sidebar.collapsibleMenu legend.active::before {content: "\f078";}
.sidebar.collapsibleMenu nav ul > li > a {padding-right: 41px;}
.sidebar dl.dataList {font-size: .85rem;overflow: hidden;}
.sidebar dl.inlineDataList {font-size: .85rem;}
.sidebar dl.inlineDataList > dt {float:right;}
.sidebar dl.inlineDataList > dd {display: block;padding-left: 14px;text-align:left;}
.sideBySide {display: table;table-layout: fixed;width: 100%;}
.sideBySide > * {display: table-cell;width: 50%;}
.wcfAdLocation {overflow: hidden;}
.wcfAdLocationHeaderContent, .wcfAdLocationFooterContent, .wcfAdLocationFooterBottom {text-align: center;}
.wcfAdLocationHeaderContent > div, .wcfAdLocationFooterContent > div, .wcfAdLocationFooterBottom > div {display: inline-block;text-align:right;}
.wcfAdLocationHeaderContent {margin-top: 7px;}
.wcfAdLocationFooterContent, .wcfAdLocationFooterBottom {margin-top: 14px;}
.wcfAdLocationSidebarTop, .wcfAdLocationSidebarBottom {padding: 0 14px 14px;text-align: center;}
.wcfAdLocationSidebarTop > div, .wcfAdLocationSidebarBottom > div {display: inline-block;text-align:right;}
.wcfAdLocationLogo {float:left;padding: 0 14px;}
@media print {
* {background-color: transparent !important;background-image: none !important;box-shadow: none !important;color: #000 !important;text-shadow: none !important;}
html, body {font-size: 12pt !important;}
.badge::before {content: "[";}
.badge::after {content: "]";}
.content {padding-right: 0 !important;padding-left: 0 !important;}
.logo {margin-top: 14px !important;}
a.externalURL::after {content: " (" attr(href) ")";font-size: .85rem;}
.sidebar, .button, .navigationIcons, .navigationMenuItems, .navigationHeader, .userPanel, .styleChooser {display: none !important;}
}
.CodeMirror-linenumber {min-width: 32px !important;}
.CodeMirror-lines {line-height: 1.2;}
.CodeMirror {direction: ltr;}
.ui-resizable {position: relative;}
.ui-resizable-handle {position: absolute;font-size: 0.1px;z-index: 99999;display: block;}
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle {display: none;}
.ui-resizable-n {cursor: n-resize;height: 7px;width: 100%;top: -5px;right: 0px;}
.ui-resizable-s {cursor: s-resize;height: 7px;width: 100%;bottom: -5px;right: 0px;}
.ui-resizable-e {cursor: e-resize;width: 7px;left: -5px;top: 0px;height: 100%;}
.ui-resizable-w {cursor: w-resize;width: 7px;right: -5px;top: 0px;height: 100%;}
.ui-resizable-se {cursor: se-resize;width: 12px;height: 12px;left: 1px;bottom: 1px;}
.ui-resizable-sw {cursor: sw-resize;width: 9px;height: 9px;right: -5px;bottom: -5px;}
.ui-resizable-nw {cursor: nw-resize;width: 9px;height: 9px;right: -5px;top: -5px;}
.ui-resizable-ne {cursor: ne-resize;width: 9px;height: 9px;left: -5px;top: -5px;}
.ps-container:hover > .ps-scrollbar-y-rail > .ps-scrollbar-y {background-color: rgba(102,102,102,0.6);}
.ps-container.ps-active-y > .ps-scrollbar-y-rail {display: block;}
.ps-container > .ps-scrollbar-y-rail {background-color: rgba(102,102,102,0);border-radius: 4px;bottom: 0;display: none;position: absolute;left: 2px;width: 8px;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.ps-container > .ps-scrollbar-y-rail:hover {background-color: rgba(102,102,102,0.3);}
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {background-color: rgba(102,102,102,0);border-radius: 4px;position: relative;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.messageGroupList .columnSubject > .labelList {float:left;padding-right: 7px;}
.messageGroupList .columnSubject > h3 > .messageGroupLink {font-size: 1.2rem;}
.messageGroupList .columnSubject > h3 > .badge.label {top: -2px;}
.messageGroupList .columnSubject > small {display: block;}
.messageGroupList .columnSubject > nav {font-size: .85rem;}
.messageGroupList .columnSubject > nav > ul > li {display: inline;}
.messageGroupList tr.new .columnSubject > h3 > .messageGroupLink {font-weight: bold;}
.messageGroupList tr.new .columnAvatar div > p > img, .messageGroupList tr:hover .columnAvatar div > p > img {opacity: 1;}
.messageGroupList tr.messageDisabled {color: #009900;}
.messageGroupList tr.messageDisabled > td {background-color: #eeffee !important;}
.messageGroupList tr.messageDisabled a:not(.badge) {color: #009900;}
.messageGroupList tr.messageDeleted {color: #cc0000;}
.messageGroupList tr.messageDeleted > td {background-color: #ffeeee !important;}
.messageGroupList tr.messageDeleted a:not(.badge) {color: #cc0000;}
.messageGroupList tr .columnSubject .statusDisplay .pageNavigation {opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.messageGroupList tr:hover .columnSubject .statusDisplay .pageNavigation {opacity: 1;}
.messageGroupList tr.new .columnAvatar > div::after {color: #336699;content: "\f069";font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;font-size: 14px;position: absolute;text-decoration: none !important;top: -4px;left: -2px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.messageGroupList .columnAvatar div {position: relative;width: 40px;height: 38px;}
.messageGroupList .columnAvatar div > p > img {opacity: .6;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.messageGroupList .columnAvatar .myAvatar {position: absolute;width: 16px;height: 16px;bottom: -2px;right: 24px;opacity: 1;box-shadow:  -0 0 3px 0 rgba(0,0,0,0.3);}
.messageGroupList .columnLastPost {white-space: nowrap;word-wrap: normal;}
.messageGroupList .columnLastPost > div > div > small {color: #808080;}
.messageGroupList .messageGroupInfo {font-size: .85rem;}
.messageGroupList .messageGroupInfo > li {display: inline-block;}
.messageGroupList .messageGroupInfo > li:not(:first-child)::before {content: " - ";}
.messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupLastPoster, .messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupLastPostTime {display: none;}
@media only screen and (max-width: 800px) {
.messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupAuthor, .messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupTime {display: none;}
.messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupLastPoster, .messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupLastPostTime {display: inline-block;}
.messageGroupList .messageGroupInfo.mobileOptimization > li.messageGroupLastPoster::before {display: none;}
}
@media only screen and (min-width: 801px) {
.messageList .messageGroupStarter {position: relative;}
.messageList .messageGroupStarter > .message::after {content: "\f005";font-family: FontAwesome;font-size: 14px;display: block;right: 4px;position: absolute;top: 2px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.messageList .messageGroupStarter > .message.messageSidebarOrientationRight::after {right: auto;left: 4px;}
}
.message {background-color: #d8e7f5;border: 1px solid #cccccc;position: relative;}
.message:hover .messageHeader .messageQuickOptions > li {opacity: 1;}
.message:hover .messageOptions nav {opacity: 1;}
.message.messageDisabled:not(.messageReduced) {background-color: #eeffee;}
.message.messageDisabled:not(.messageReduced) .messageSidebar {color: #009900;}
.message.messageDisabled:not(.messageReduced) .messageSidebar a {color: #009900;}
.message.messageDeleted:not(.messageReduced) {background-color: #ffeeee;}
.message.messageDeleted:not(.messageReduced) .messageSidebar {color: #cc0000;}
.message.messageDeleted:not(.messageReduced) .messageSidebar a {color: #cc0000;}
.message.jsMarked:not(.messageReduced) {background-color: #ffffc8;}
.message.jsMarked:not(.messageReduced) .messageSidebar {color: #666666;}
.message.jsMarked:not(.messageReduced) .messageSidebar a {color: #666666;}
.message .messageOptions {font-size: .85rem;position: relative;}
.message .messageOptions.forceHidden nav {display: none !important;}
.message .messageOptions.forceOpen nav {opacity: 1;}
.message .messageOptions nav {bottom: -2px;opacity: 0;position: absolute;left: -22px;text-align:left;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.message .messageOptions nav ul.smallButtons > li a.button {border-radius: 0;}
.message .messageHeader .messageQuickOptions {float:left;}
.message .messageHeader .messageQuickOptions > li {display: inline-block;opacity: .6;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.message .messageHeader .messageQuickOptions > li span.icon {color: #808080;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.message .messageHeader .messageQuickOptions > li > a:hover > span.icon {color: #336699;}
.message .messageHeader .messageQuickOptions > li > .badge {top: -2px;}
.message .messageHeader .messageQuickOptions input[type=checkbox] {position: relative;top: 1px;}
.message .messageHeader .permalink {color: #808080;}
.message.dividers .userCredits {border-top: 1px solid #cccccc;}
.touch .message .messageOptions nav {opacity: 1;}
.touch .messageBody > footer {padding-bottom: 28px;}
@media only screen and (max-width: 800px) {
.message {border-width: 1px 0;}
}
.message.messageSidebarOrientationLeft .messageContent {border-right: 1px solid #cccccc;margin:0 211px 0 0;}
.message.messageSidebarOrientationLeft .messageSidebar {float:right;}
.message.messageSidebarOrientationRight .messageContent {border-left: 1px solid #cccccc;margin:0 0 0 211px;}
.message.messageSidebarOrientationRight .messageSidebar {float:left;}
.message.messageSidebarOrientationLeft .messageHeader::before, .message.messageSidebarOrientationLeft .messageHeader::after, .message.messageSidebarOrientationRight .messageHeader::before, .message.messageSidebarOrientationRight .messageHeader::after {border-width: 20px;content: "";display: block;height: 0;position: absolute;top: 35px;width: 0;}
.message.messageSidebarOrientationLeft .messageHeader::before, .message.messageSidebarOrientationRight .messageHeader::before {z-index: 100;}
.message.messageSidebarOrientationLeft .messageHeader::after, .message.messageSidebarOrientationRight .messageHeader::after {z-index: 101;}
.message.messageSidebarOrientationLeft .messageHeader::before, .message.messageSidebarOrientationLeft .messageHeader::after {border-style:inset none inset solid;}
.message.messageSidebarOrientationLeft .messageHeader::before {border-color:transparent transparent transparent #cccccc;right: -20px;}
.message.messageSidebarOrientationLeft .messageHeader::after {border-color:transparent transparent transparent #fcfdfe;right: -19px;}
.message.messageSidebarOrientationRight .messageHeader::before, .message.messageSidebarOrientationRight .messageHeader::after {border-style:inset solid inset none;}
.message.messageSidebarOrientationRight .messageHeader::before {border-color:transparent #cccccc transparent transparent;left: -20px;}
.message.messageSidebarOrientationRight .messageHeader::after {border-color:transparent #fcfdfe transparent transparent;left: -19px;}
.message .newMessageBadge {color: #ffffff;display: block;font-size: .85rem;font-weight: bold;padding: 6px 10px;position: absolute;text-transform: uppercase;top: 24px;box-shadow:  -1px 1px 3px 0 rgba(0,0,0,0.2);background-color: #264c73;background-image: -webkit-linear-gradient(#336699,#264c73);background-image: linear-gradient(#336699,#264c73);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.message .newMessageBadge::before {border-bottom: 4px solid #19334d;content: "";display: block;position: absolute;top: -4px;}
.message.messageSidebarOrientationLeft .newMessageBadge {border-radius:5px 0 0 5px;right: -219px;}
.message.messageSidebarOrientationLeft .newMessageBadge::before {border-right: 6px solid transparent;right: 0;}
.message.messageSidebarOrientationRight	.newMessageBadge {left: -219px;}
.message.messageReduced .newMessageBadge {left: -7px;top: 21px;}
.message.messageSidebarOrientationRight .newMessageBadge, .message.messageReduced .newMessageBadge {border-radius:0 5px 5px 0;}
.message.messageSidebarOrientationRight .newMessageBadge::before, .message.messageReduced .newMessageBadge::before {border-left: 6px solid transparent;left: 0;}
.messageBody {color: #666666;display: block;line-height: 1.5;}
.messageBody > div:not(.messageFooter):not(.redactor-box):not(.messageTabMenu) {overflow: hidden;padding-bottom: 14px;}
.messageBody > div:not(.messageFooter):not(.redactor-box):not(.messageTabMenu) > div.messageText img {max-width: 100%;}
.messageBody > div:not(.messageFooter):not(.redactor-box):not(.messageTabMenu) > div.messageText table img {max-width: none;}
.messageBody > footer {padding-bottom: 14px;}
.messageBody > .messageSignature {color: #808080;}
.messageBody > .messageSignature img {max-height: 150px;}
.messageBody .messageFooter > *:not(:first-child) {margin-top: 7px;}
.messageTextPreview img {max-width: 100%;}
.messageTextPreview table img {max-width: none;}
.messageFooterNote {border-right: 2px solid #cccccc;color: #808080;font-size: .85rem;padding: 4px 7px;background-image: -webkit-linear-gradient(90deg, rgba(204,204,204,0.2) 0%, rgba(204,204,204,0) 40%);background-image: linear-gradient(90deg, rgba(204,204,204,0.2) 0%, rgba(204,204,204,0) 40%);}
html[dir='rtl'] .messageFooterNote {background-image: -webkit-linear-gradient(270deg, rgba(204,204,204,0.2) 0%, rgba(204,204,204,0) 40%);background-image: linear-gradient(270deg, rgba(204,204,204,0.2) 0%, rgba(204,204,204,0) 40%);}
.messageHeader + .messageBody > div:first-child:not(.redactor-box), .messageBody > div:not(.messageFooter):not(.messageTabMenu):not(.redactor-box):not(:first-child) {border-top: 1px dotted #cccccc;padding: 14px 0;}
.message .messageBody {padding: 14px 21px 1px;}
.message .messageContent {background-color: #fcfdfe;}
.message .messageContent .messageHeader {padding: 14px 21px 0;position: relative;}
.message .messageContent .messageHeader .messageHeadline > h1 {color: #666666;font-size: 1.4rem;font-weight: bold;overflow: hidden;padding-left: 21px;text-overflow: ellipsis;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.message .messageContent .messageHeader .messageHeadline > h1 + p {margin-top: 2px;}
.message .messageContent .messageHeader .messageHeadline > p {font-size: .85rem;}
.message .messageContent .messageHeader .messageHeadline > p > .likesBadge {margin:-2px 4px -1px 0;}
.message .messageContent .messageHeader .messageHeadline > p > .username::after {content: " - ";}
.message .messageContent .messageHeader .box32 > .messageHeadline > p:first-child {font-size: 1rem;}
.message .messageContent .messageHeader .box32 > .messageHeadline > p:first-child > .username {font-size: 1.2rem;font-weight: bold;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.message .messageContent .messageHeader .box32 > .messageHeadline > p:first-child > .username {display: block;}
.message .messageContent .messageHeader .box32 > .messageHeadline > p:first-child > .username::after {content: "";}
.message .messageContent .messageHeader .box32 > .messageHeadline > p:first-child > .likesBadge {font-size: .85rem;top: -1px;}
.message .messageSidebar {line-height: 1.3;margin-bottom: -1px;padding: 14px 21px 21px;position: relative;text-align: center;width: 170px;}
.message .messageSidebar::after {clear: both;content: '';display: block;}
.message .messageSidebar header .username {color: #336699;font-size: 1.2rem;font-weight: bold;padding: 0 3px 1px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.message .messageSidebar header .username a {text-decoration: none;}
.message .messageSidebar .userTitle {margin: 7px 0 0;}
.message .messageSidebar .userRank {margin: 2px 0 0;}
.message .messageSidebar .userAvatar {display: inline-block;margin: 7px 0 0;position: relative;text-align:right;}
.message .messageSidebar .userAvatar > .badgeOnline {border-radius:5px 0 0 5px;color: #eeffee;bottom: 7px;right: -5px;position: absolute;text-transform: uppercase;box-shadow:  -1px 1px 3px 0 rgba(0,0,0,0.2);background-color: #006600;background-image: -webkit-linear-gradient(#009900,#006600);background-image: linear-gradient(#009900,#006600);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.message .messageSidebar .userAvatar > .badgeOnline::before {border-bottom: 4px solid #003300;border-right: 6px solid transparent;content: "";display: block;right: 0;position: absolute;top: -4px;}
.message .messageSidebar .userCredits {font-size: .85rem;margin: 7px 0 0;overflow: hidden;padding: 7px 0 0;}
.message:not(.messageReduced) .messageOptions::before, .message:not(.messageReduced) .messageOptions::after {display: table;content: "";}
.message:not(.messageReduced) .messageOptions::after {clear: both;}
.message:not(.messageReduced) .messageBody::before, .message:not(.messageReduced) .messageBody::after {display: table;content: "";}
.message:not(.messageReduced) .messageBody::after {clear: both;}
li:nth-child(2n+1) .message.messageSidebarOrientationLeft .messageHeader::after {border-left-color: #f1f5fa;}
li:nth-child(2n+1) .message.messageSidebarOrientationRight .messageHeader::after {border-right-color: #f1f5fa;}
li:nth-child(2n+1) .message .messageContent {background-color: #f1f5fa;}
.messageReduced .messageOptions > .breadcrumbs {bottom: 10px;right: 0;opacity: 1;position: relative;}
.messageReduced.messageDisabled {border-color: #009900;}
.messageReduced.messageDisabled .messageContent {background-image: -webkit-linear-gradient(180deg, #eeffee, rgba(238,255,238,0) 90px);background-image: linear-gradient(180deg, #eeffee, rgba(238,255,238,0) 90px);}
.messageReduced.messageDeleted {border-color: #cc0000;}
.messageReduced.messageDeleted .messageContent {background-image: -webkit-linear-gradient(180deg, #ffeeee, rgba(255,238,238,0) 90px);background-image: linear-gradient(180deg, #ffeeee, rgba(255,238,238,0) 90px);}
.messageReduced.jsMarked {border-color: #666666;}
.messageReduced.jsMarked .messageContent {background-image: -webkit-linear-gradient(180deg, #ffffc8, rgba(255,255,200,0) 90px);background-image: linear-gradient(180deg, #ffffc8, rgba(255,255,200,0) 90px);}
.messageCollapsed {color: #808080;opacity: .8;padding: 14px 21px;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.messageCollapsed:hover {opacity: 1;}
.messageCollapsed.messageCollapsedExpandable {cursor: pointer;}
.messageCollapsed h1 {font-size: .85rem;}
.messageCollapsed .messageCounter {padding-top: 3px;}
.messageCollapsed.jsMarked {background-color: #ffffc8 !important;color: #666666;}
.messageCollapsed.jsMarked a {color: #666666;}
@media only screen and (max-width: 800px) {
.messageCollapsed {padding: 7px;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.messageCollapsed {padding: 7px 14px;}
}
.messageBody > span.icon-spinner {right: 50%;margin:-21px 0 0 -21px;position: absolute;top: 50%;}
#messageQuickReply .formSubmit {padding-bottom: 14px;}
#showQuotes {bottom: 25px;cursor: pointer;opacity: .7;position: fixed;left: 25px;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#showQuotes:hover {opacity: 1;}
#messageQuoteList {max-width: 800px !important;}
#messageQuoteList li:not(:first-child) {margin-top: 7px;}
#messageQuoteList li > span {float:right;}
#messageQuoteList li > span > input {vertical-align: bottom;}
#messageQuoteList li > span > span {cursor: pointer;vertical-align: middle;}
#messageQuoteList li div.jsQuote {margin-right: 60px;}
#messageQuoteList li div.jsFullQuote {display: none;}
#quoteManagerCopy > span:not(.pointer) {cursor: pointer;}
#quoteManagerCopy > .jsQuoteManagerQuoteAndInsert {border-right: 1px solid #ffffff;margin-right: 4px;padding-right: 4px;}
#quoteManagerCopy > .pointer {border-width: 5px 5px 0;bottom: -5px;margin-right: -5px;top: auto;}
.messageShareButtons > ul > li {display: inline-block;}
.messageShareButtons > ul > li > a {text-decoration: none;}
.messageShareButtons > ul > li > a > .icon {height: 28px;}
.messageShareButtons > ul > li > .badge {background-color: #fcfdfe;border: 1px solid #cccccc;border-radius: 3px;color: #666666;line-height: 23px;padding: 0 7px;position: relative;vertical-align: 1px;}
.messageShareButtons > ul > li > .badge::before {border: 6px solid #cccccc;border-color:transparent transparent transparent #cccccc;content: "";display: block;height: 0;margin-top: -6px;position: absolute;left: 100%;top: 50%;width: 0;}
.messageShareButtons > ul > li > .badge::after {border: 6px solid #fcfdfe;border-color:transparent transparent transparent #fcfdfe;content: "";display: block;height: 0;margin-left: -1px;margin-top: -6px;position: absolute;left: 100%;top: 50%;width: 0;}
.messageShareButtons .jsShareFacebook:not(.disabled) > a > .icon {color: #3b5998;}
.messageShareButtons .jsShareTwitter:not(.disabled) > a > .icon {color: #4099ff;}
.messageShareButtons .jsShareGoogle:not(.disabled) > a > .icon {color: #d34836;}
.messageShareButtons .jsShareReddit:not(.disabled) > a > .icon {color: #5f99cf;}
.contentNavigation > .messageShareButtons {float:left;margin-left: 14px;margin-top: 0;}
.messageSearchResultList > li > .box48 > div > .containerHeadline > h3 {padding-left: 100px;}
.likeButton.active .icon, .wcfLikeButton.active .icon {color: #009900;}
.dislikeButton.active .icon, .wcfDislikeButton.active .icon {color: #cc0000;}
@media screen and (max-width: 800px),print {
.message.messageSidebarOrientationLeft .messageContent, .message.messageSidebarOrientationRight .messageContent {border: 0;margin: 0;}
.message.messageSidebarOrientationLeft .messageSidebar, .message.messageSidebarOrientationRight .messageSidebar {float: none;min-height: 37px;}
.message.messageSidebarOrientationLeft .messageHeader::before, .message.messageSidebarOrientationLeft .messageHeader::after, .message.messageSidebarOrientationRight .messageHeader::before, .message.messageSidebarOrientationRight .messageHeader::after {display: none;}
.message .messageHeader .messageQuickOptions, .message .messageBody .messageSignature, .message .messageSidebar .userCredits {display: none;}
.message .messageSidebar {padding: 7px;text-align:right;width: auto;}
.message .messageSidebar > div {margin-right: 40px;}
.message .messageSidebar .userAvatar {right: 7px;position: absolute;top: 0;}
.message .messageSidebar .userAvatar img {height: 32px !important;width: 32px !important;}
.message .messageSidebar .userAvatar > .badgeOnline {display: none;}
.message .messageSidebar .userTitle {margin-top: -2px;}
.message .messageContent .messageHeader {padding: 7px 7px 0;}
.message .messageBody {padding: 7px;}
.message .messageBody > div:not(.messageFooter):not(.messageTabMenu):not(.redactor-box) {padding: 7px 0;}
.message .messageBody > footer {padding: 0;position: absolute;left: 7px;top: 7px;}
.message .messageOptions nav {opacity: 1;position: static;text-align:right;}
.message .newMessageBadge {display: none;}
}
@media screen and (min-width: 641px) and (max-width: 800px),print {
.message .messageSidebar, .message .messageContent .messageHeader, .message .messageBody {padding-right: 14px;padding-left: 14px;}
.message .messageSidebar .userAvatar {right: 14px;}
.message .messageBody > footer {left: 14px;}
}
@media only screen and (max-width: 800px) {
.moderationList thead {display: none;}
.moderationList tbody .columnAssignedUserID, .moderationList tbody .columnLastChangeTime {display: none;}
}
.editHistoryDiff > .sideBySide:first-child {margin-bottom: 21px;text-align: center;}
.editHistoryDiff .sideBySide > div:first-child {padding-left: 14px;}
.editHistoryDiff .sideBySide > div:last-child {padding-right: 14px;}
@media only screen and (max-width: 800px) {
.editHistoryVersionList .columnUser, .editHistoryVersionList .columnEditReason {display: none;}
}
.messageFloatObjectLeft {float:right;margin:0 0 7px 14px;}
.messageFloatObjectRight {float:left;margin:0 14px 7px 0;}
#pollOptionContainer .sortableList {padding: 7px 0;}
#pollOptionContainer .sortableList .sortableNode {margin-top: 7px;}
#pollOptionContainer .sortableList .sortableNode .sortableButtonContainer > img {cursor: pointer;margin-left: 14px;}
.pollContainer {float:right;margin:0 0 7px 14px;max-width: 50%;min-width: 300px;}
.pollContainer > .formSubmit {background-color: #f1f5fa;border-top: 1px solid #cccccc;margin:14px -21px -14px -21px;padding: 10px 0;}
.pollInnerContainer > p:first-of-type {margin-top: 7px;}
.pollResultList li {margin-bottom: 8px;padding: 1px 0;position: relative;z-index: 0;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.pollResultList li:last-child {margin-bottom: 0px;}
.pollResultList li:hover {background-color: #f1f5fa;border-radius:5px 0 0 5px;}
.pollResultList li .pollMeter {background-color: #d8e7f5;border-radius:5px 0 0 5px;height: 100%;right: 0;position: absolute;top: 0;z-index: -1;}
.pollResultList li .caption {color: #336699;padding: 2px 0;}
.pollResultList li .caption .optionName {display: block;padding:0 7px 0 3.5em;}
.pollResultList li .caption .relativeVotes {position: absolute;left: 7px;top: 3px;}
@media only screen and (max-width: 800px) {
.pollContainer > .formSubmit {margin:14px -14px -7px -14px;}
}
@font-face {font-family: 'RedactorFont';src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggi/NUAAAC8AAAAYGNtYXAaVcx2AAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zm8dIFkAAAFwAAATSGhlYWQACVb9AAAUuAAAADZoaGVhA+ECBQAAFPAAAAAkaG10eEEBA94AABUUAAAAkGxvY2FVlFE8AAAVpAAAAEptYXhwAC8AkgAAFfAAAAAgbmFtZRHEcG0AABYQAAABZnBvc3QAAwAAAAAXeAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmHwHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIOYf//3//wAAAAAAIOYA//3//wAB/+MaBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAwAAACUCAAGSAAQACQANAAA3EQURBQEFEQURATUXBwACAP4AAdv+SgG2/tySkiUBbgH+lAEBSgH+3AEBJv7/3G9sAAAGAAAASQIAAW4ABAAJAA4AEwAYAB0AABMhFSE1FSEVITUVIRUhNSczFSM1FTMVIzUVMxUjNZIBbv6SAW7+kgFu/pKSSUlJSUlJAW5JSW5JSW5JSdxJSW5JSW5JSQAAAAACAAAAJQH3AZIAFgAuAAAlLgMnBzIuAic+AyMXNh4CByUnMg4CBx4DIxcnHgMXNi4CBwH3Dik/XUABAR04Vjg+WDUYAQFNeEcZEv7MAQENHDMlHzIfEQEBASZUTDYHCSBIZj4lGCQaEARqFi5HLzJFKhJqDC1RZSzVPQoWIxkbJBQID0wCCQ4VDxo4KA8PAAACAG4AJQGSAZIABAAzAAA3IQchJzceAzMyPgI3PgMnNyMXDgMHDgMjIi4CJy4DNycjBx4DF24BJQH+3QFABRIUGg0QGBUQCAYKBgQBAUABAQEEBAQCCAgKBQYJCQcEAgUCAwEBPwEBAwcJCEkkJD8HCgYEBAYKBwcRFRkPtcMGCQkHAwMFAwEBAwUDAwcJCQbDtQ8ZFREHAAUAAP//AgABtwAGAA4AFgBHAF8AAAEzFTMVIzUfAQc1IzUzNS8BNxUzFSMVFx4DFRwBDgEHDgMHMh4CFx4DHwEjJzwBJjQjLgMrARUjNTMyHgIXBzMyPgI3PgM1NC4CJy4DKwEVAUkjS24mkZFvb96RkW9vDAMFAwECAwICBQUGBAECAgIBAQICAgEbIBMBAQIEBQUCCh0qCAwKCQM3DgMFBQMCAQIBAQEBAgECAwQGAw4BtpYgtv9cXEolSUhcXEklSlUDCAoNBwQJBwcCAwUDAgEBAQIBAQMEBANCLgEBAQIGBwYCSLYBAwUDRAECAgECBAQGAwQFBQQBAgIBATIAAAAAAwBtAAABkgGTAAMADAARAAAlIzcXBzM3MxczAyMDFyEVITUBI0YjI7ZKF2MXSmVbZQEBJP7c5nh4eUlJASb+2iRJSQAKAAAAJQIAAZIABAAJAA4AEwAYAB0AIgAnACwAMQAANxEFEQU3FzUHFTU3NScVJwcVFzUVJxU3NRUHFRc1NxUXNQclBxUXNRUnFTc1FQcVFzUAAgD+ALeSkpKSJW1tbW1tbSWSkgEkbW1tbW1tJQFuAf6UASUBSgFIbQFIAUq4AUgBSm8BSgFIbQFIAUrbSAFKAQEBSAFKbwFKAUhtAUgBSgAAAAIACQAlAgABkgAWAC4AACUOAxU1DgMHJj4CFzU0HgIXBT4DNxU1FD4CNy4DNRUmDgIXAgA5VTkcQVxAKA8RGEh3Thc2Vz/+PAY3S1UlECAxICYyHQw9Z0chCt8wRi8VAWsFDxsjGS1kUiwLaQETKUYxYBAUDwgDTRABCRMlGhoiFwkBPhAQJzkZAAAAAgBJAEkBtwFuAEcAjwAAAQ4DFRQeAhceAxc+Azc+AzU0LgInLgMHJg4CBwYiBiYHNAYmIicwLgE0NTQ+Ajc+Azc1DgMHJw4DFRQeAhceAxc+Azc+AzU0LgInLgMHJg4CBwYiBiYVJgYmIjUiJjQmNTQ+Ajc+Azc1DgMHATkJDQkEAwYKBgcOEBAJCA4NDAUGCAUDAwQHBQUKCgwGBQoICAMBAgIBAQEBAQEBAQMGCgYGDxITCxMhHBYJzQkNCQQDBwkHBg4QEQgIDg0MBgUIBQMCBQcFBAoLDAYFCQkIAwECAgEBAQEBAQEBAwcJBgcPERQLEyEcFwkBIgwYHBsQCxgUEgcICwgDAQECBggGBQ0MDwYIDA0KBgUIBAQBAQICBQECAgEBAQECAQQCBQEKEhQRCggQDAwDFwgQFBQNAQwYHBsQCxgUEgcICwgDAQECBggGBQ0MDwYIDA0KBgUIBAQBAQICBQECAgEBAQECAQQCBQEKEhQRCggQDAwDFwgQFBQNAAT//wBJAgABbgAEAAkADgASAAATIRUhNRchFSE1FSEVITUHNQcXAAIA/gC3AUn+twFJ/rclk5MBbklJbklJbklJSbdcWwAAAAUAAABJAgABbgAEAAkADgAaAG0AABMhFSE1FSEVITUVIRUhNSczNSM1IwcVNxUjFRc+Azc+Azc0PgE0NTQuAicuAyMiBioBByIOAiMVPgM3Mj4BMjM6AR4BFx4CFBUcAQYUBw4DBw4DDwEVMzUjPgM3MZIBbv6SAW7+kgFu/pKNRBgUFhYYIAUHBQMBAgICAQEBAQEDBAICBgcHBQEEAwQCAgMEBAICBAQDAgIDAwMCAgMDAwEBAgEBAQEBAgICAQQGCQULRC0BAwQEAgFuSUluSUluSUlrFF0GFAZJFJEFBwYEAQIDBAMBAgMDAwIDBwUFAgIEAgEBAQEBAhUBAgIBAQEBAQIBAQIDBAIBAgMCAQICAwMCAQUHCQYNExQBBAMFAgADAAAASQIAAW4ALAAxAGwAACUiLgInNTMeAzMyPgI1NC4CIyIOAgcjNT4DMzIeAhUUDgIjJzMVIzUnIg4CByMVDgMVFB4CFxUzHgMzMj4CNzMVDgMjIi4CNTQ+AjMyHgIXFSMuAyMBbgoUEhEIHgUKCwsGEyEZDg4ZIRMGCwsKBR4IERIUCh41KBcXKDUet5KSJQYLCwoFHgQHBQICBQcEHgUKCwsGBgsLCgUeCBESFAoeNSgXFyg1HgoUEhEIHgUKCwsGSQMGBwU0AgQDAQ0XHhESHhcNAQMEAjQFBwYDFyg1Hx41KBe3SUkvAQMEAhgFCw0OBwcNDQsGFwIEAwEBAwQCNAUHBgMXKDUeHzUoFwMGBwU0AgQDAQAAAAEAAAC3AgABAAAEAAATIRUhNQACAP4AAQBJSQABAJIASQGSAZIADAAAAQ8CFzcHNxc3DwEXAQcpQQvBC0ApQAvBC0EBWdYBOAE6AdgBOgE4AQAAAAQAAABJAgABbgAEAAkADgASAAATIRUhNRchFSE1FSEVITUHNRcHAAIA/gC3AUn+twFJ/re3k5MBbklJbklJbklJSbdcWwAAAAMAAAAlAgABkgAEAAkAEgAANxEFEQUBBREFEQc/ARcVJTU3FwACAP4AAdv+SgG2tiQwPv6Sbm4lAW4B/pQBAUoB/twBASa4AV5eSgFIk5MABAAlAAAB2wG3AAMAGgAeADUAAAEVJzMHHgIGDwEOAS4BJy4BNDY/AT4BHgEXARcnFTceATI2PwE+AS4BJy4CBg8BDgEeARcB29vbKgMDAQICcwIGBgYCAwMBAnQCBQYGAv5029sqAwYGBQJzAgEBAgMCBgYGAnICAgEDAgG33NwrAgYGBgJzAgEBAgMDBQYGAnMCAQECA/51AdvaKgMDAQJzAgUGBgMCAwECAnMCBQYGAgAABAAA/9sCAAHbAAMAGgAeADUAACU1Fwc3LgI2PwE+AR4BFx4BFAYPAQ4BIiYnBycXNQcuASIGDwEOAR4BFx4CNj8BPgEuAScBJdvbKgMDAQICcwIGBgYCAwMBAnQCBQYGAnTb2yoDBgYFAnMCAQECAwIGBgYCcgICAQMC/9zbASwCBgYGAnICAgEDAgMGBgUCcwIBAwN1AdzbKgMDAQJzAgUGBgMCAwECAnICBgYGAgABAG4AJQFuAZIAEgAAJREjESM1Ii4CNTQ+AjsBESMBSSRKFigeEREeKBaTJSUBSf63khEeKBcWKB4R/pMAAAAAAwAlAAEB3AG2AAoAVwB4AAAlMwcnMzUjNxcjFQcOAwcOAyMiLgInLgM1ND4CNz4DOwE1NC4CJy4DIyIOAgcOAwc1PgM3PgIyMzIeAhceAx0BIzU1IyIOAgcOAxUUHgIXHgMzMj4CNz4DPQEBkkpcXEpKXFxK6wIGBgcEAwgICQUIDw4LBQUHBQIDBQkGBQ8SFAwlAQMDAgMFBwgFBAoJCQQFCQkJBQQJCQkEBQkKCQUNFRENBQUIBQI0FQgMCggDAwUDAQECAwICBQUHAwUJCQcCAwUCApKRkZORkZMHBAYFBQECAwIBAgUHBQULDQ8JCRANCwQFBgUCCQMGBQQCAgICAQEBAgEBAwQFAy8CAwMCAQEBAQIFCAUGDhIXDXgYSwECAwICBgYIBQQGBgUCAgMCAQIEBgQECgsOBwQAAAAEACUASgHbAW4AAwAMAC0AegAANyM3FwczNzMXMwMjAyUVFA4CBw4DIyIuAicuAzU0PgI3PgM7ATcuAyMqAQ4BBw4DBxU+Azc+AzMyHgIXHgMdASMiDgIHDgMVFB4CFx4DMzI+Ajc+AzcVMzU0LgInrjUbGok4EUsSOE1ETQF/AQMFAwMHCQoFBAYGBQIDAwIBAgMEAwMJCw0IFiIFDhIWDQYKCgoFBAoJCgQFCgoJBQUJCgoFBAkHBgIDAwMBJg0WEw8GBgkGAwIFCAUFDA4QCQUJCQgEBAcHBgI3AgUIBsV1dXZHRwEf/uFlBAcOCwsEBAYEAwICAwICBQYHAwUJBwUCAgMCAWIFCAYCAQEBAQMCBAIwAwUEAwIBAgEBAQIDAQIEBgYDCQMEBwQFCw4QCgkPDgsFBQcFAgEBAwICBQUHAxh7DhcTDwUAAAIASQBJAbcBkwAEAIEAABMhFSE1Fx4DFx4DFRQOAgcOAyMiLgInLgMnFR4DFx4DMzI+Ajc+AzU0LgInLgMvAS4DJy4DNTQ+Ajc+AzMyHgIXHgMXNS4DJy4DIyIOAgcOAxUUHgIXHgMfAUkBbv6SvwQIBgYCAgMDAQIDBQQDCAkLBgYNDAwGBg0NDQYGCwwNBgYNDAwHDxoXEggHCwgDAgUHBAUMDxIKHAcNCQcDAgMDAQIDBQMDCAkKBgYLCgsGBQsLCgYGCwwLBgYLDAsGDBcUEQcICwcDAgQHBAUMERUNIAEAJSUxAgMFBAMDBgYHAwUICAYDAgQDAQECAwMCBQcIBEEDBAUDAgECAQEDBgkGBQ8SFQwJEA8NBgYKCggDCwIFBQQDAgUFBgMFBwcFAwIDAwEBAgMCAgQGBgM9AgUDBAEBAgEBAwcJBgYPERMLCA8ODAQFCgoJBQsAAAQAAABJAgABbgAEAAkADgATAAA/ARcHJxc3FwcnJScHFzcXJwcXNwAltiO4AbYluCMB/yO4JbYBuCO2Jdsdkh6TAZQekhwBHZIekwGUHpIcAAAAAAUAAP/bAgAB2wAEAAkADgATABgAABcRIREhASERIREHITUhFRUhNSEVFSE1IRUAAgD+AAHb/koBtkn+3AEk/twBJP7cASQlAgD+AAHc/kkBt5JJSW5JSW5JSQAAAwCTAEkBbQGSABcALwBbAAA3Mh4CFx4DFwYUDgEHDgMrATczNzIeAhceAhQXBhQOAQcOAysBNzMDMzI+Ajc+Ayc2LgInLgMnPgM3PgMnNi4CJy4DKwED+AcNCQkDBAMEAQEBBAQEAgkKDQcqASgBBQsIBwIDAwQBAQQCBAEICAsFKgEoZGQRGRgRCAYLBgQBAQMEBwQGCg8OCggMDQgFAwcDAwEBBAYLBgcQFBcOZAHeAQMEAwMICQwHBgsJCAIDBAMBYYECAgMDAgYHCQUFCQcGAgIEAgFN/uoDBQgGBQ4RFQsKEQ8NBgUJBgQBAQMFBwUECwwOCAsSDw0FBggFAv63AAADACUAAAHbAbcABAANABEAADcRIREhEyMDMzczFzMDBxcjNyUBtv5K/URMOBBLETdLIho0GgABt/5JAW7+20hIASU1eHgAAAACAEIAHwG8AZkAIQBLAAAlBycOAS4BJwcXBw4BIiYvAS4BNDY/AT4BMhYfAR4BFAYHJy4BIgYPAQ4BFBYXHgE+AT8BLgMnLgI2PwE+AhYXBxc3PgE0JicBvJQEBQsMCwYhHg8PJygnDw8PDw8P1w8nKCcPDw8QEA8lCxscHAvFCwwLCgsbHRsLJwMFBgUCCgwDBQhSBg8QEgl+JoYLCwoL9pQEAQECAwMgHg8PDw8PDxAmKCcP1w8QEA8PDycoJw9+CwoLC8YLGx0bCwoLAQsLJgIDBAUCChcXFQhSBgYBBAV9JYYLHBwbCwAAAAMAAABJAgABbgAEAAkADgAAEyEVITUXIRUhNRczFSM1AAIA/gCSAW7+kpPb2wFuSUluSUluSUkAAwAAAEkCAAFuAAQACQAOAAATIRUhNRUhFSE1FTMVIzUAAgD+AAFt/pPc3AFuSUluSUluSUkAAAADAAAASQIAAW4ABAAJAA4AABMhFSE1FSEVITUVIRUhNQAB//4BAf/+AQIA/gABbklJbklJbklJAAMAAABJAgABbgAEAAkADgAAEyEHIScHIRchNxchByEnbgElAf7dAW0B/wH9/wFtASUB/t0BAW5JSW5JSW5JSQAGAAAAJwIAAZUACAANABQAGAAdACEAADc1IxEhFTMRIQEhFSE1FyMVIRUhNQcjNxcXITUhFScXIzdJSQG3Sf5JAUn+kwFtSiX+twFu27hcXG3+2wElKSlJICdJASVK/twBSdzcSbcl3EltbSUlJW5JSQAAAAEAAAABAADCHXSvXw889QALAgAAAAAAz3WLJQAAAADPdYsl////2wIAAdsAAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgD//wAAAgAAAQAAAAAAAAAAAAAAAAAAACQAAAAAAAAAAAAAAAABAAAAAgAAAAIAAAACAAAAAgAAbgIAAAACAABtAgAAAAIAAAkCAABJAgD//wIAAAACAAAAAgAAAAIAAJICAAAAAgAAAAIAACUCAAAAAgAAbgIAACUCAAAlAgAASQIAAAACAAAAAgAAkwIAACUCAABCAgAAAAIAAAACAAAAAgAAAAIAAAAAAAAAAAoAFAAeAEAAcAC4AQQBhgGoAfoCQAMCAyYDuARGBFQEcASUBLwFFgVuBY4GLgbUB4IHrAfaCFwIgAj2CRIJLglKCWoJpAAAAAEAAAAkAJAACgAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAYAAAAAQAAAAAAAgAOAGoAAQAAAAAAAwAYAC4AAQAAAAAABAAYAHgAAQAAAAAABQAWABgAAQAAAAAABgAMAEYAAQAAAAAACgAoAJAAAwABBAkAAQAYAAAAAwABBAkAAgAOAGoAAwABBAkAAwAYAC4AAwABBAkABAAYAHgAAwABBAkABQAWABgAAwABBAkABgAYAFIAAwABBAkACgAoAJAAUgBlAGQAYQBjAHQAbwByAEYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAFIAZQBkAGEAYwB0AG8AcgBGAG8AbgB0UmVkYWN0b3JGb250AFIAZQBkAGEAYwB0AG8AcgBGAG8AbgB0AFIAZQBnAHUAbABhAHIAUgBlAGQAYQBjAHQAbwByAEYAbwBuAHQARwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AABIoAAoAAAAAEeAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAADgEAAA4Bg0Rie09TLzIAAA74AAAAYAAAAGAIIvzVY21hcAAAD1gAAABMAAAATBpVzHZnYXNwAAAPpAAAAAgAAAAIAAAAEGhlYWQAAA+sAAAANgAAADYACVb9aGhlYQAAD+QAAAAkAAAAJAPhAgVobXR4AAAQCAAAAJAAAACQQQED3m1heHAAABCYAAAABgAAAAYAJFAAbmFtZQAAEKAAAAFmAAABZhHEcG1wb3N0AAASCAAAACAAAAAgAAMAAAEABAQAAQEBDVJlZGFjdG9yRm9udAABAgABADr4HAL4GwP4GAQeCgAZU/+Lix4KABlT/4uLDAeKZviU+HQFHQAAAT8PHQAAAUQRHQAAAAkdAAAN+BIAJQEBDRkbHSAlKi80OT5DSE1SV1xhZmtwdXp/hImOk5idoqessba7wFJlZGFjdG9yRm9udFJlZGFjdG9yRm9udHUwdTF1MjB1RTYwMHVFNjAxdUU2MDJ1RTYwM3VFNjA0dUU2MDV1RTYwNnVFNjA3dUU2MDh1RTYwOXVFNjBBdUU2MEJ1RTYwQ3VFNjBEdUU2MEV1RTYwRnVFNjEwdUU2MTF1RTYxMnVFNjEzdUU2MTR1RTYxNXVFNjE2dUU2MTd1RTYxOHVFNjE5dUU2MUF1RTYxQnVFNjFDdUU2MUR1RTYxRXVFNjFGAAACAYkAIgAkAgABAAQABwAKAA0AQQCYAPEBSQH6Ai8CxwMhA98EGwTXBYEFkQW0BfEGLwagBxEHOgf0CLUJaQmsCfwKhAq5C0QLdAuiC9AMAQxo/JQO/JQO/JQO+5QOi7AVi/gB+JSLi/wB/JSLBfhv990V/EqLi/u5+EqLi/e5Bfu4+5QVi/dv9yb7Avsm+wEFDvcm+AIV+AKLi0L8AouL1AWL+wIV+AKLi0L8AouL1AWL+wIV+AKLi0L8AouL1AX7JvdwFdSLi0JCi4vUBYv7AhXUi4tCQouL1AWL+wIV1IuLQkKLi9QFDviLsBVky0yq+0KWCIshBYuLQMb7LPcT9z33GsW4i4sIiyEF92Wr9wT7QV77Cgj7yfdpFYvIBYuLb3ImSOFBtnqLiwiLfIvXBe6F9yJ7nGSl0PsO6Ps2YwgO9wLUFfe4i4tn+7iLi68FysoVnHmngrGLsounlJydnJ2Up4uyCIv3SUyLi/tXBYt8hoCDg4ODgId8i32Lf4+Dk4OTh5aLmgiL91dLi4v7SQWLZJRvnXkIDvfd+EoVrouL+yrWi4tr+wKLi/dKBbH7kxX3JS/7JS+L1fsDi4uw9wOLi9QF+3LTFfsl5/cl54tC9wOLi2b7A4uLQQWXNhWTg499i3iLf4mBhoSGg4SHgYmOio6KjYiNiI6GjoQIpklri3i5BYuMio2KjYaZhZKEiwiBi4tDbouL90q1iwWfi5mHk4MIVEcVmYsFk4uRjY+Pjo+NkYuUi5SJkoiOh4+FjYOLCH2Li1kFDve393oVRYuu9wyu+wwF+0r7DRXVi6LU7ouiQtWLJve6MIsm+7oFjGcV97iLi0L7uIuL1AUOi7AVi/gB+JSLi/wB/JSLBfdLrxX3JouL1Psmi4tCBYv3AhX3JouL1Psmi4tCBWb3SxX7AYuLQvcBi4vUBYv7AhX7AYuLQvcBi4vUBYv7AhX7AYuLQvcBi4vUBbD3cBWLQvcmi4vU+yaLBfe4ixX7AYuLQvcBi4vUBYv7AhX7AYuLQvcBi4vUBYv7AhX7AYuLQvcBi4vUBQ74lPdzFfss+xNAUIuLCIv1BftCgExsZEte9wr3BPdB92VrCIv1BYuLxV73PfsaCPxYLBWcsvcim+6RCIs/i5oFi4u2nOHVJs5vpIuLCItOBfs2s/sOLqVGCA73zfe2FXNsgGiLY4tpk3Ccd513n4Gji6CLnJKZmpqakpyLn4uehZt+mH+ZfJJ7i32LgIeChQiIiYmKiYuKi4mMioyKjoqPi5GLpJOknKOco6KcqJYIi6EFWXhlcnRrCPthixV0bH9oi2OLaZNwnXecd6CBoougi5ySmpqZmpKci5+LnoWbfph/mX2Seot+i3+IgoQIiImJioqLiYuKjIqMiY6Kj4uRi6SUpJujnKOinKmWCIuhBVh4ZnJzawgOi/gCFfiUi4tC/JSLi9QF90v7AhX33YuLQvvdi4vUBYv7AhX33YuLQvvdi4vUBWZCFYv3S/snL/cnMAUO9yb4AhX4AouLQvwCi4vUBYv7AhX4AouLQvwCi4vUBYv7AhX4AouLQvwCi4vUBfsh9hXPi4ufc4uL6HeLdYWLd6GRi0Jzi4t3Bav7JRWXl5KTjY6PkI2PjY+Mj4yPi5CLlIiThJCFkYKOf4uHi4aKhoqGioaKhokIi3YFkI6QjZCNkIyPjI+LkIuPio6IjoiMh4uGi4iLiImIiYeJh4eHiIiDgX18CIB+i3jPi4ufXosFjo+QkJGRCIuLBQ74AtQVcItyk3aYCIu/qYsFmIWZh5uLvYu0sIu5i7pisFmLe4t9h36FCG2Li78FoJikk6aL3IvMSYs6iztKSTqLCPtL90sV9yaLi0L7JouL1AVmuhV8i3yHfoUIbYuLcwWAfYR6i3iLeZJ5ln0Ii3SpiwWYhZqHmoubi5mPmJEIqYuLVwV2fnKDcIs6i0rNi9uL3MzN3Iumi6SDoH4Ii1dtiwV+kX2Pe4sIDov3lBX4lIuLQvyUi4vUBQ73m/ftFWL7a0qLgFL3VYuWxEuLtPdry4uWxPtVi4BSzIsFDov4AhX4lIuLQvyUi4vUBfdL+wIV992Li0L73YuL1AWL+wIV992Li0L73YuL1AX7S0IVi/dL9ycv+ycwBQ6LsBWL+AH4lIuL/AH8lIsF+G/33RX8SouL+7n4SouL97kF+0r7SxWvi7vqySyLQvwCi4vU9wL3JvcC+yYFDvhv+EsVi/tw+2/3cPdviwVhYBWShIyChoUI+wf7BwWFhoKMhJKEkoqUkJEI9wj3BwWQkJWKkYQI/CD8HxX3b4r7b/dvi/tuBbW1FZKElYqQkAj3B/cHBZCQipWEkoSRgo2FhQj7BvsHBYWGjYGRhQgO97n3kxWL93D3b/tv+2+KBbW3FYSSipSQkQj3B/cGBZGRlIqShJKEjIGGhgj7CPsHBYaGgYyFkgj7CPsJFftvjPdv+3CL928FYWEVhJKBjIaGCPsH+wcFhoaMgZKEkoSUipGRCPcG9wYFkZGJlIWSCA733bAVi/fdZ4uL+91Bi4v3JgVPi1q8i8iLx7y8x4sI9yeLi/wBZosFDvgm9yYV1Ysv+yUv9yXVi4v3J0GL5/cl5/slQYuL+ycF+3+EFYWCgoSBhoGGgIh/i3WLeZF+mH6XhZ2Looujkp2blpqXopGriwiwi4uUBYuUiJKFj4SQgo1/i3+Lf4l/iH+If4V+hAiLugWWkJeOl46XjZiMmIusi6KEmH6ZfZFyi2gIi/sMV4uLowWL1hV2iwV3i32IhIaDhoeCi36LgY6EkIWQhpOIlIuZi5aQkpaTlo+ai58Ii48FDvdC91kVVoum9wml+wkF+x37ChXDi5zS1oudRMOLPvezR4s++7MF+BPwFYuHBYt3h3uDgIOAf4V9i4GLg46GkYWRiJOLlIuYj5WTkJSQmY6giwihiwWt7RV9mXOSaYt8i36Kfol/iH6Hf4YIi1sFmJOYkJiPl46YjZmLl4uViJGHkoaOhIuCCIuCZYsFaYtyhXt/e3+DeItyi3SReZl+mH6ehaOLmIuXjZWQlpCTk5KUCItzwouL9w8Fi6+EpX2ZCA7U95QV+AKLi2b8AouLsAX3U1oVloeUhZGEkYSOgouCi36GgYKEgoR/iHuLe4t6jnuRepB6lHqXCItKBZqEm4Wch5yIm4mci7OLqZOfm5+alKOLq4ujhZ9/mn6bd5dwlAhvlgV3kX6ShZGFkIiTi5OLl4+UlJGTkZeOm4uai5mImoaZhpqEmYIIi8gFfJF8kHuPfI58jXuLaYtxg3h6d3uCdItui3WQeZd+l32hf61+CKuABQ6L928Vr6n3S/snZ277S/cmBYuLFfdL9yevbvtL+ydnqAX4lIsVZ6n7S/snr273S/cmBYuLFftL9ydnbvdL+yevqAUOi2YVi/iU+JSLi/yU/JSLBfhv+HAV/EqLi/xL+EqLi/hLBUL7JhX7uIuL1Pe4i4tCBYv7AhX7uIuL1Pe4i4tCBYv7AhX7uIuL1Pe4i4tCBQ73jPdyFZ6LmYiUg5ODj36LeYt6h3+DhIOEfYd3iwhii4vstIsFi/cVFZuLloiShJKFjoKLfYt+iIGEhYSFgIh7iwhii4vYtIsFJvuqFfCLBbWLqJKemp2ZlKKLqoulhZ9/mn+ZeZRzjZ+NmpKVl5aXkJuLoIungqB5mHqZcJJoiwgmi4v73QUOsIsVi/hL+EqLi/xL/EqLBfeR+AIVR4s/+7nDi5vT1oucQ8KLQPe5BWlWFaX7DFeLpfcMBQ74UPeKFfso+yiHjwV9h3uNfJMIamupbXx8BWJiSYtitAh8mgVitIvNtLQI92v3awW0tM2LtGIImnwFtGKLSWJiCGb3EhVuqFyKbm4I+1n7WgVtbotcp26ob7qLqKkIsrEFg4+EkIWScKaGsJ+gCN3dBZuapIyifwj7EvsRsWb3GvcaBaiojLpuqAgOi/gCFfiUi4tC/JSLi9QF9yb7AhX4AouLQvwCi4vUBfcn+wIV92+Li0L7b4uL1AUOi/gCFfiUi4tC/JSLi9QFi/sCFfgBi4tC/AGLi9QFi/sCFfdwi4tC+3CLi9QFDov4AhX4k4uLQvyTi4vUBYv7AhX4k4uLQvyTi4vUBYv7AhX4lIuLQvyUi4vUBQ73AvgCFfe4i4tC+7iLi9QF+wL7AhX4lIuLQvyUi4vUBfcC+wIV97iLi0L7uIuL1AUO1LIVi9RCi4v3ufhLi4tB1IuL+7j8S4sF99333RX8AYuL+3D4AYuL93AF1UIVZouL+0v73YuLZvgCi4v3cAX7b0IV+0yL5/cB5/sBBfcBZhX7uYuLsPe5i4tmBWL3AhW0QkKLq9QFDviUFPiUFYsMCgAAAAADAgABkAAFAAABTAFmAAAARwFMAWYAAAD1ABkAhAAAAAAAAAAAAAAAAAAAAAEQAAAAAAAAAAAAAAAAAAAAAEAAAOYfAeD/4P/gAeAAIAAAAAEAAAAAAAAAAAAAACAAAAAAAAIAAAADAAAAFAADAAEAAAAUAAQAOAAAAAoACAACAAIAAQAg5h///f//AAAAAAAg5gD//f//AAH/4xoEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAQAAhlBJsl8PPPUACwIAAAAAAM91iyUAAAAAz3WLJf///9sCAAHbAAAACAACAAAAAAAAAAEAAAHg/+AAAAIA//8AAAIAAAEAAAAAAAAAAAAAAAAAAAAkAAAAAAAAAAAAAAAAAQAAAAIAAAACAAAAAgAAAAIAAG4CAAAAAgAAbQIAAAACAAAJAgAASQIA//8CAAAAAgAAAAIAAAACAACSAgAAAAIAAAACAAAlAgAAAAIAAG4CAAAlAgAAJQIAAEkCAAAAAgAAAAIAAJMCAAAlAgAAQgIAAAACAAAAAgAAAAIAAAACAAAAAABQAAAkAAAAAAAOAK4AAQAAAAAAAQAYAAAAAQAAAAAAAgAOAGoAAQAAAAAAAwAYAC4AAQAAAAAABAAYAHgAAQAAAAAABQAWABgAAQAAAAAABgAMAEYAAQAAAAAACgAoAJAAAwABBAkAAQAYAAAAAwABBAkAAgAOAGoAAwABBAkAAwAYAC4AAwABBAkABAAYAHgAAwABBAkABQAWABgAAwABBAkABgAYAFIAAwABBAkACgAoAJAAUgBlAGQAYQBjAHQAbwByAEYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAFIAZQBkAGEAYwB0AG8AcgBGAG8AbgB0UmVkYWN0b3JGb250AFIAZQBkAGEAYwB0AG8AcgBGAG8AbgB0AFIAZQBnAHUAbABhAHIAUgBlAGQAYQBjAHQAbwByAEYAbwBuAHQARwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('woff');font-weight: normal;font-style: normal;}
.re-icon {font-family: 'RedactorFont';}
.re-icon > i:before {position: relative;font-size: 14px;}
.re-video:before {content: "\e600";}
.re-unorderedlist:before {content: "\e601";}
.re-undo:before {content: "\e602";}
.re-underline:before {content: "\e603";}
.re-textdirection:before {content: "\e604";}
.re-fontcolor:before {content: "\e605";}
.re-table:before {content: "\e606";}
.re-redo:before {content: "\e607";}
.re-quote:before {content: "\e608";}
.re-outdent:before {content: "\e609";}
.re-orderedlist:before {content: "\e60a";}
.re-link:before {content: "\e60b";}
.re-horizontalrule:before {content: "\e60c";}
.re-italic:before {content: "\e60d";}
.re-indent:before {content: "\e60e";}
.re-image:before {content: "\e60f";}
.re-fullscreen:before {content: "\e610";}
.re-normalscreen:before {content: "\e611";}
.re-formatting:before {content: "\e612";}
.re-fontsize:before {content: "\e613";}
.re-fontfamily:before {content: "\e614";}
.re-deleted:before {content: "\e615";}
.re-html:before {content: "\e616";}
.re-clips:before {content: "\e617";}
.re-bold:before {content: "\e618";}
.re-backcolor:before {content: "\e619";}
.re-file:before {content: "\e61a";}
.re-alignleft:before {content: "\e61b";}
.re-alignment:before, .re-alignright:before {content: "\e61c";}
.re-alignjustify:before {content: "\e61d";}
.re-aligncenter:before {content: "\e61e";}
.re-gallery:before {content: "\e61f";}
.redactor-box {border: 1px solid #cccccc;font-size: 0;line-height: 1.28;position: relative;}
.redactor-box + .messageTabMenu {padding: 0;}
.redactor-box + .innerError, .redactor-box > .innerError {border-radius: 0;box-shadow: none;display: block;margin-top: -1px;}
.redactor-box > .innerError {margin: -1px;}
.redactor-box > .redactorAutosaveNotice {background-color: #fcfdfe;border: 1px solid #cccccc;border-width:1px 1px 0 0;bottom: 0;font-size: 1rem;opacity: 0;padding: 7px;position: absolute;left: 0;transition: visibility 0s linear .3s, opacity .3s linear;visibility: hidden;}
.redactor-box > .redactorAutosaveNotice.open {opacity: 1;visibility: visible;transition-delay: 0s;}
.redactor-box > .redactorAutosaveNotice.redactorAutosaveNoticeIcons > span.fa-check {margin-left: 7px;}
.redactor-box > .redactorAutosaveNotice > span.redactorAutosaveMessage {padding: 0 7px;}
.redactor-editor {max-height: 500px;padding: 10px;position: relative;outline: none;overflow: auto;}
.redactor-editor + textarea {border-width: 0;box-shadow: none;font-size: 1rem;line-height: 1.28;outline: none;padding: 10px;resize: vertical;}
.redactor-editor + textarea:focus {box-shadow: none;}
.redactor-editor ul, .redactor-editor ol {margin: 1em 0;margin-right: 40px;}
.redactor-editor ul ul, .redactor-editor ul ol, .redactor-editor ol ul, .redactor-editor ol ol {margin-bottom: 0;margin-top: 0;}
.redactor-editor ul li, .redactor-editor ol li {margin: 7px 0;}
.redactor-editor ul {list-style-type: disc;}
.redactor-editor ol {list-style-type: decimal;}
.redactor-editor img {border: 1px solid transparent;max-width: 100%;}
.redactor-editor table {border-collapse: collapse;font-size: 14px;line-height: 1.6em;}
.redactor-editor table td {border: 1px solid #ddd;padding: 5px;vertical-align: top;}
.redactor-editor .quoteBox {clear: none;}
.redactor-editor .quoteBox > header {position: relative;}
.redactor-editor .quoteBox > header > .redactorQuoteEdit {bottom: -7px;right: -14px;left: -14px;top: -14px;padding-top: 14px;padding-right: 14px;position: absolute;}
.redactor-editor .codeBox {overflow: hidden;position: relative;}
.redactor-editor .codeBox .redactorEditCodeBox {background-color: rgba(255,255,255,0.8);bottom: 0;right: 0;opacity: 0;position: absolute;left: 0;text-align: center;top: 0;z-index: 200;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.redactor-editor .codeBox .redactorEditCodeBox > div {cursor: pointer;font-size: 1.4rem;right: 50%;padding: 1em 3em;position: absolute;top: 50%;transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);}
.redactor-editor .codeBox:hover .redactorEditCodeBox {opacity: 1;}
.redactor-editor .codeBox ol {margin-bottom: 0;margin-top: 0;}
.redactor-editor.msie .quoteBox {min-height: auto;}
@media all and (min-width: 801px) {
.redactor-editor {font-size: 1rem;}
}
@media only screen and (max-width: 800px) {
.redactor-editor + textarea {font-size: 16px;max-height: 500px;}
}
.redactor-toolbar {background: repeating-linear-gradient(0deg,#cccccc 0px,#cccccc 3%,#fcfdfe 3%,#f1f5fa 100%);background-size: 100% 31px;}
.redactor-toolbar > li {display: inline-block;margin-bottom: 1px;vertical-align: middle;}
.redactor-toolbar > li:last-of-type, .redactor-toolbar > li.separator {border-left: 1px solid #cccccc;}
.redactor-toolbar > li > a {box-sizing: border-box;color: #999999;display: block;font-size: 14px;height: 30px;outline: none;padding: 6px 0;text-align: center;text-decoration: none;width: 30px;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.redactor-toolbar > li > a.redactor-button-disabled, .redactor-toolbar > li > a.redactor-button-disabled:before, .redactor-toolbar > li > a.redactor-button-disabled > i:before {color: rgba(102,102,102,0.4);cursor: default;}
.redactor-toolbar > li > a:before {color: #666666;}
.redactor-toolbar > li > a > i {height: 14px;width: 12px;}
.redactor-toolbar > li > a > i:before {color: #666666;}
.redactor-toolbar > li > a:not(.redactor-button-disabled):hover, .redactor-toolbar > li > a.redactor-act, .redactor-toolbar > li > a.dropact {background-color: #d8e7f5;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.redactor-toolbar > li > a:not(.redactor-button-disabled):hover > i, .redactor-toolbar > li > a.redactor-act > i, .redactor-toolbar > li > a.dropact > i {text-shadow: none;}
.redactor-toolbar > li > a.fa-redactor-btn:before {content: "";}
.redactor-toolbar > li > a.redactor-btn-image {background-position: center;background-repeat: no-repeat;}
.redactor-toolbar > li > a.redactor-btn-image.redactor-button-disabled {opacity: .5;}
.redactor-toolbar-tooltip {background-color: rgba(0,0,0,0.8);border-radius: 6px;color: #ffffff;font-size: .85rem;max-width: 300px;padding: 5px 10px 7px;position: absolute;z-index: 800;box-shadow:  -0 3px 7px 0 rgba(0,0,0,0.3);}
.redactor-toolbar-tooltip .pointer {border-color: rgba(0,0,0,0.8) transparent;border-style: solid;border-width: 0 5px 5px;right: 50%;position: absolute;top: -5px;}
.redactor-toolbar-tooltip.inverse .pointer {border-width: 5px 5px 0;}
#redactor-image-box {border: 1px dashed rgba(0,0,0,0.5);display: inline-block;line-height: 0;max-width: 100%;position: relative;}
#redactor-image-box > img {border-width: 0;opacity: .5;}
#redactor-image-editter {background-color: rgba(0,0,0,0.8);border-radius: 6px;color: #ffffff;font-size: .85rem;max-width: 300px;padding: 5px 10px 7px;position: absolute;z-index: 800;box-shadow:  -0 3px 7px 0 rgba(0,0,0,0.3);cursor: pointer;right: 50%;line-height: .85rem;margin-top: -13px;top: 50%;z-index: 5;}
#redactor-image-editter .pointer {border-color: rgba(0,0,0,0.8) transparent;border-style: solid;border-width: 0 5px 5px;right: 50%;position: absolute;top: -5px;}
#redactor-image-editter.inverse .pointer {border-width: 5px 5px 0;}
#redactor-image-resizer {background-color: #000000;border: 1px solid #ffffff;bottom: -4px;cursor: nw-resize;height: 8px;line-height: 1;position: absolute;left: -5px;width: 8px;z-index: 10;}
.redactorAttachmentContainer {background-color: #ffffff;border: 1px solid #eeeeee;border-top-width: 0;padding: 7px 14px 7px;}
.messageTabMenu {border: 1px solid #cccccc;border-top-width: 0;line-height: 1.28;}
.messageTabMenu > nav.messageTabMenuNavigation > ul {background-color: #fcfdfe;font-size: 0;white-space: nowrap;}
.messageTabMenu > nav.messageTabMenuNavigation > ul > li {display: inline-block;}
.messageTabMenu > nav.messageTabMenuNavigation > ul > li > a {border-left: 1px solid #cccccc;border-bottom: 1px solid transparent;color: #999999;display: block;font-size: 1rem;line-height: 1.28;margin-bottom: -1px;padding:7px 14px 8px 14px;text-decoration: none;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.messageTabMenu > nav.messageTabMenuNavigation > ul > li > a:hover {color: #336699;}
.messageTabMenu > nav.messageTabMenuNavigation > ul > li > a > span.icon {display: none;}
.messageTabMenu > nav.messageTabMenuNavigation > ul > li.active > a {background-color: #fcfdfe;color: #336699;}
.messageTabMenu > div, .messageTabMenu > fieldset {background-color: #fcfdfe;border-width: 0;border-radius: 0;border-top: 1px solid #cccccc;display: none;position: static;}
.messageTabMenu > div.active, .messageTabMenu > fieldset.active {display: block;}
.messageTabMenu > div > nav {background-color: #fcfdfe;border-bottom: 1px solid #cccccc;margin:-14px -21px 14px -21px;padding: 4px 7px;}
.messageTabMenu > div > nav ul {display: inline-block;font-size: 0;white-space: nowrap;}
.messageTabMenu > div > nav ul li {display: inline-block;outline: 0;vertical-align: baseline;}
.messageTabMenu > div > nav ul li.active a, .messageTabMenu > div > nav ul li.active a:hover {color: #6699cc;cursor: default;}
.messageTabMenu > div > nav ul li a {color: #999999;display: block;font-size: .85rem;outline: 0;padding: 0 7px;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.messageTabMenu > div > nav ul li a:hover {color: #666666;text-decoration: none;}
.messageTabMenu > div > nav ul li:not(:last-child) {padding-left: 4px;}
.messageTabMenu > div > nav ul li.dropdown > a {font-size: 1.0rem;padding: 4px 7px 2px;}
.messageTabMenu > div > div, .messageTabMenu > div > fieldset {border-top-width: 0;}
@media only screen and (max-width: 800px) {
.redactor-toolbar > li > a:hover {background-color: transparent !important;}
.messageTabMenu > nav > ul > li:not(.active) > a > span.icon {display: block;}
.messageTabMenu > nav > ul > li:not(.active) > a > span:not(.icon) {display: none;}
.messageTabMenu > div > nav {margin:-3px -7px 7px -7px;}
}
@-moz-document url-prefix() {fieldset + .messageTabMenu {margin-top: -3px;}
}
.redactor-dropdown-box-fontcolor {width: 200px;}
.redactor-dropdown-box-fontcolor > li.redactorColorPallet {padding: 0 4px;}
.redactor-dropdown-box-fontcolor > li.redactorColorPallet:hover {background-color: #ffffff !important;}
.redactor-dropdown-box-fontcolor > li.redactorColorPallet > a {border: 2px solid #ffffff;border-bottom-width: 0;display: inline-block;font-size: 0;height: 20px;padding: 0;margin: 0;width: 20px;}
.redactorDropArea {background-color: #ffffcc;border: 5px dashed #ffcc00;box-sizing: border-box;font-size: 1.4rem;position: absolute;text-align: center;vertical-align: middle;z-index: 360;}
.redactorDropArea.active {background-color: #CEF6CE;border-color: #04B404;}
.redactor-link-tooltip {background-color: rgba(0,0,0,0.8);border-radius: 6px;color: #ffffff;font-size: .85rem;padding: 5px 10px 7px;position: absolute;z-index: 800;box-shadow:  -0 3px 7px 0 rgba(0,0,0,0.3);}
.redactor-link-tooltip > a {color: #ffffff;}
.redactor-link-tooltip > a + a {border-right: 1px solid #ffffff;margin-right: 10px;padding-right: 10px;}
.slideshowContainer {overflow: hidden;position: relative;}
.slideshowContainer > ul:not(.slideshowButtonList) > li:not(:first-child) {display: none;}
.slideshowContainer > .slideshowItemList {position: absolute;-webkit-transition-property: left;transition-property: left;-webkit-transition-duration: .8s;transition-duration: .8s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.slideshowContainer > .slideshowItemList > li.slideshowItem {display: block;float:right;overflow: hidden;position: absolute;top: 0;-webkit-transform: translate3d(0,0,0);}
.slideshowContainer > .slideshowButtonList {position: absolute;left: 0;top: 0;}
.slideshowContainer > .slideshowButtonList > li {display: inline-block;}
.slideshowContainer > .slideshowButtonList > li > a > .icon {color: #d8e7f5;}
.slideshowContainer > .slideshowButtonList > li > a > .icon.active {color: #336699;}
.slideshowContainer > .slideshowButtonList > li:hover > a > .icon {color: #003366;}
.sortableListContainer .sortablePlaceholder {background-color: #efcb50;border: 1px solid #e9bf2b;color: #000000;margin: 4px 0;padding: 4px;}
.sortablePlaceholder.sortableInvalidTarget {background-color: #c95145;border: 1px solid #913d37;color: #ffffff;}
.sortableList {list-style-position: outside;list-style-type: decimal;margin-right: 21px;}
.sortableList .jsCollapsibleCategory > .sortableNodeLabel {background-color: #336699;color: #ffffff;padding-right: 7px;}
.sortableList .jsCollapsibleCategory > .sortableNodeLabel > a {color: #ffffff;}
.sortableList .jsCollapsibleCategory > .sortableNodeLabel .icon {color: #ffffff;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.sortableList .statusDisplay {float:left;}
.sortableNode {cursor: move;}
.sortableNode.ui-sortable-helper {list-style: none;}
.sortableNodeLabel {padding:7px 0 7px 7px;display: block;}
.sortableList:not(.simpleSortableList) .sortableNodeLabel {border-bottom: 1px solid #cccccc;}
.simpleSortableList {min-height: 21px;}
.colorPreview {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC);border: 1px solid #cccccc;border-radius: 6px;display: inline-block;}
.colorPreview:hover {box-shadow:  -0 0 15px 0 #cccccc;}
.colorPreview > div {border: 2px solid #ffffff;border-radius: 6px;cursor: pointer;display: block;height: 60px;width: 180px;}
.colorList > li {float:right;padding: 7px;}
.colorList > li > figure > figcaption {font-size: .85rem;margin-bottom: 7px;text-align: center;}
.colorList::after {clear: both;content: "";display: block;}
#tplStyleAdd #styleLogo {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEX////MzMw46qqDAAAAD0lEQVQI12P4z4Ad4ZAAAH6/D/Hgw85/AAAAAElFTkSuQmCC);}
.tagList > li {display: inline-block;}
.tag {border-radius:4px 0 0 4px;font-weight: normal;height: 13px;margin-right: 6px;padding-bottom: 2px;padding-right: 10px;}
.tag::before {border-color:transparent transparent transparent #666666;border-style:inset inset inset solid;border-width:8px 0 8px 8px;clip: rect(auto auto auto 2px);content: "";height: 0;right: -8px;position: absolute;top: 0;width: 0;}
.tag::after {background: #ffffff;border-radius: 2px;content: "";height: 4px;right: -2px;position: absolute;top: 6px;width: 4px;box-shadow:  -0 -1px 2px 0 rgba(0,0,0,0.2);}
.tag:hover {background-color: #336699;color: #ffffff;}
.tag:hover::before {border-left-color: #336699;}
.editableItemList li.tag {margin-bottom: 11px;margin-right: 10px;}
.editableItemList li.tag:first-child {margin-right: 6px;}
.sidebar .userAvatar {text-align: center;overflow: hidden;}
.sidebar .userAvatar > a {display: block;}
.sidebar .userList > li > a {font-size: .85rem;}
.framedIconList li {float:right;margin:0 0 4px 2px;}
.framedIconList li .framed {display: inline-block;}
.framedIconList::after {content: "";height: 0;display: block;clear: both;}
.userInformation > .inlineDataList, .userInformation > .dataList {font-size: .85rem;}
.userInformation > .dataList {margin-top: 0;}
.userInformation > .inlineDataList {margin-top: 7px;}
.userInformation > .inlineDataList ~ .inlineDataList {margin-top: 0;}
.userInformation > .containerHeadline + .inlineDataList {margin-top: 0;}
.userInformation > .containerHeadline > p {margin-bottom: 2px;}
.userInformation > .userFacts {overflow: hidden;}
.userTitleBadge {font-weight: normal;max-width: 154px;overflow: hidden;text-overflow: ellipsis;}
.userProfilePreview {position: relative;}
.userProfilePreview > .userInformation {padding-bottom: 16px;}
.userProfilePreview > .userInformation > .userStats, .userProfilePreview > .userInformation > .userFields {margin-bottom: 5px;padding-top: 5px;border-top: 1px dotted #cccccc;}
.userProfilePreview > .userInformation > .userFields {padding-bottom: 5px;border-bottom: 1px dotted #cccccc;}
.userProfilePreview > .userInformation > .buttonGroupNavigation {position: absolute;bottom: 0;left: 0;}
.userHeadline {padding-left: 428px;position: relative;}
.userHeadline > nav.buttonGroupNavigation {position: absolute;left: 7px;top: 7px;}
.userHeadline > .dataList {overflow: hidden;}
.letters > li {margin-bottom: 4px;}
.letters > li > .button {min-width: 1.2em;text-align: center;}
.recentActivityList > li.recentActivitiesMore {text-align: center;}
.recentActivityList > li.recentActivitiesMore > button {padding-right: 30px;padding-left: 30px;}
.recentActivityList > li.recentActivitiesMore > small {color: #808080;}
.recentActivityList > li > div.box48 > div {overflow: hidden;}
.likeList > li:first-child {padding-bottom: 7px;text-align:left;}
.likeList > li:first-child:hover {background-color: #fcfdfe;}
.likeList > li:first-child > ul.buttonGroup {display: inline-block;margin-bottom: 7px;}
.likeList > li:first-child > ul.buttonGroup:not(:first-child) {margin-right: 4px;}
@media only screen and (max-width: 800px) {
.likeList > li:first-child {padding-bottom: 0;}
}
.dashboardBoxSidebarButton {padding-bottom: 21px !important;}
.dashboardBoxSidebarButton > div {text-align: center;}
.dashboardBoxSidebarButton > div > .button {font-size: 1.2rem;padding: 5px 13px;}
.usersOnlineInfoBox .usersOnlineLegend {margin-top: 7px;}
.usersOnlineInfoBox .usersOnlineLegend > p {display: inline-block;}
.usersOnlineInfoBox .usersOnlineLegend > ul {display: inline-block;}
@media only screen and (max-width: 800px) {
#tplUser .userHeadline {overflow: visible;padding-left: 30px;}
#tplUser .userHeadline > .invisible {display: block;float:right;}
#tplUser .userHeadline > *:not(.invisible) {margin-right: 59px;}
}
.userAvatarCrop {cursor: pointer;}
#userAvatarCropSelection {position: relative;margin: 0 auto;}
#userAvatarCropOverlay {background-color: #000000;height: 100%;opacity: 0.5;position: absolute;right: 0;top: 0;width: 100%;z-index: 10;}
#userAvatarCropOverlaySelection {cursor: move;position: absolute;right: 0;top: 0;height: 128px;overflow: hidden;width: 128px;z-index: 20;}
.buttonList.thirdPartyLogin {text-align: center;}
.thirdPartyLoginButton {border-radius: 3px;border: 1px solid rgba(255,255,255,0.1);color: #fff;display: inline-block;font-size: 0;}
.thirdPartyLoginButton:hover {color: #fff;text-decoration: none;}
.thirdPartyLoginButton > .icon {border-left: 1px solid rgba(0,0,0,0.1);color: #fff;text-shadow: none;padding: 4px 6px;}
.thirdPartyLoginButton > span:not(.icon) {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size: 1rem;padding: 4px 12px;}
.thirdPartyLoginButton.googleLoginButton {background-color: #dd4b39;}
.thirdPartyLoginButton.googleLoginButton:hover {background-color: #ca3523;}
.thirdPartyLoginButton.facebookLoginButton {background-color: #3b5998;}
.thirdPartyLoginButton.facebookLoginButton:hover {background-color: #30487b;}
.thirdPartyLoginButton.twitterLoginButton {background-color: #55acee;}
.thirdPartyLoginButton.twitterLoginButton:hover {background-color: #309aea;}
.thirdPartyLoginButton.githubLoginButton {background-color: #444444;}
.thirdPartyLoginButton.githubLoginButton:hover {background-color: #303030;}
.userNotificationItemList > .notificationItem.groupedNotificationItem > div > .framed > span.fa-users:before {position: relative;top: 3px;}
.userNotificationItemList > .notificationItem.notificationUnconfirmed {position: relative;}
.userNotificationItemList > .notificationItem.notificationUnconfirmed > div > .details {padding-left: 37px;}
.userNotificationItemList > .notificationItem.notificationUnconfirmed > .notificationItemMarkAsConfirmed {opacity: .6;position: absolute;left: 21px;top: 50%;transform: translateY(-50%);-ms-transform: translateY(-50%);-webkit-transform: translateY(-50%);-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.userNotificationItemList > .notificationItem.notificationUnconfirmed:hover > .notificationItemMarkAsConfirmed {opacity: 1;}
.userNotificationItemList > .notificationItem > div > .details {padding-top: 3px;}
.userNotificationItemList > .notificationItem > div > .details .userLink {font-weight: bold;}
.dashboardBoxRecentActivityHeadline {overflow: visible;position: relative;min-height: 30px;}
.dashboardBoxRecentActivityHeadline > nav.buttonGroupNavigation {position: absolute;left: 4px;top: 2px;}
#aboutMe img {max-width: 100%;}
#conversationLabelFilter {margin-bottom: 14px;}
.conversationLabelList {margin-bottom: 14px;}
.conversationLabelList li:not(:last-child) {margin-bottom: 4px;}
.conversationLabelList~small {display: block;}
#unreadConversations .dropdownMenu > li h3 {max-width: 250px;overflow: hidden;text-overflow: ellipsis;}
.conversationParticipantList > li .inlineDataList {font-size: .85rem;}
.conversationParticipantList > li.conversationLeft > div > a > img, .conversationParticipantList > li.conversationLeft > div > span > img {filter: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cfilter%20id%3D%22grayscale%22%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200%22%2F%3E%3C%2Ffilter%3E%3C%2Fsvg%3E#grayscale);filter: gray;-webkit-filter: grayscale(1);}
.conversationLeft .userLink, .conversationLeft.userLink, .conversationLeft p > span {text-decoration: line-through;}
.sidebar fieldset.conversationQuota > div {text-align: center;}
.conversationUsageBar {background-color: #666666;border-radius: 5px;height: 20px;padding: 4px;box-shadow: inset -0 1px 5px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .5);}
.conversationUsageBar > span {border-radius: 3px;color: transparent;display: block;height: 100%;box-shadow: inset -0 1px 0 rgba(255, 255, 255, .5);background-color: #a5df41;background-image: -webkit-linear-gradient(#a5df41,#4ca916);background-image: linear-gradient(#a5df41,#4ca916);}
.conversationUsageBar.yellow > span {background-color: #fecf23;background-image: -webkit-linear-gradient(#fecf23,#fd9215);background-image: linear-gradient(#fecf23,#fd9215);}
.conversationUsageBar.red > span {background-color: #f0a3a3;background-image: -webkit-linear-gradient(#f0a3a3,#f42323);background-image: linear-gradient(#f0a3a3,#f42323);}
.conversationFolderList > li > a > span {float:left;}
@media only screen and (max-width: 800px) {
.conversationList thead {display: none;}
.conversationList tbody .columnMark, .conversationList tbody .columnReplies, .conversationList tbody .columnParticipants, .conversationList tbody .columnLastPost, .conversationList tbody .conversationParticipantSummary, .conversationList tbody .columnSubject .statusDisplay {display: none;}
}
@media only screen and (max-width: 1239px) {
.conversationList thead .columnParticipants, .conversationList tbody .columnParticipants {display: none;}
}
.wbbBoardList .wbbDepth2.wbbBoardContainer > .wbbBoard {padding-right: 43px;}
.wbbBoardList .wbbDepth2.wbbCategory > header {padding-right: 43px;}
.wbbBoardList .wbbDepth3.wbbBoardContainer > .wbbBoard {padding-right: 79px;}
.wbbBoardList .wbbDepth3.wbbCategory > header {padding-right: 79px;}
.wbbBoardList .wbbCategory .wbbDepth2.wbbBoardContainer > .wbbBoard {padding-right: 7px;}
.wbbBoardList .wbbCategory .wbbDepth3.wbbBoardContainer > .wbbBoard {padding-right: 43px;}
.wbbBoardList .tabularBox:not(.wbbDepth1) {border-width: 1px 0 0;}
.wbbBoardList .wbbStats {right: 49%;margin-top: 0;position: absolute;top: 14px;width: 16%;}
.wbbBoardList .wbbStats > dl > dt {line-height: 1.28;width: 48%;}
.wbbBoardList .wbbStats > dl > dd {font-weight: normal;font-size: .85rem;width: 50%;}
.wbbBoardList .wbbLastPost {right: 66%;margin-top: 0;position: absolute;top: 14px;width: 34%;}
.wbbBoardList .wbbLastPost > div > div > p, .wbbBoardList .wbbLastPost > div > div > small {overflow: hidden;text-overflow: ellipsis;width: 98%;white-space: nowrap;word-wrap: normal;}
.wbbBoardList .wbbLastPost > div > div > p {color: #336699;}
.wbbBoardList .wbbLastPost > div > div > p > .badge {font-size: .85rem;max-width: 33%;overflow: hidden;text-overflow: ellipsis;top: -1px;}
.wbbBoardList .wbbLastPost > div > div > small {display: block;}
.wbbBoardList .wbbLastPost > div > div > small time {color: #808080;}
.wbbBoardList .wbbSubBoards {margin-top: 7px;}
.wbbBoardList .wbbSubBoards li {display: inline-block;}
.wbbBoardList .wbbSubBoards li > span.icon {position: relative;top: 2px;}
.wbbBoardList .wbbSubBoards + .wbbUsersOnline {margin-top: 0;}
.wbbBoardList .wbbUsersOnline {margin-top: 7px;}
.wbbBoardList .wbbUsersOnline > span.icon {position: relative;top: 1px;}
.wbbBoardList .wbbBoardContainer {position: relative;}
.wbbBoardList .wbbDepth1 {margin-top: 14px;}
.wbbBoardList .wbbBoard {min-height: 44px;padding: 7px;padding-left: 51%;-webkit-transition-property: background;transition-property: background;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.wbbBoardList .wbbBoard:hover {background-color: #d8e7f5;}
.wbbBoardList .wbbBoardNode1 {background-color: #fcfdfe;}
.wbbBoardList .wbbBoardNode2 {background-color: #f1f5fa;}
.wbbBoardList .wbbBoard > div > .containerHeadline > h3 {font-weight: normal;}
.wbbBoardList .new > div > .containerHeadline > h3, .wbbBoardList .wbbSubBoards li.new a {font-weight: bold;}
.wbbBoardList .wbbCollapsibleCategory .collapsibleButton {display: inline-block;margin-left: 7px;}
.wbbBoardList .wbbCollapsibleCategory > header > small {display: inline-block;margin-right: 23px;}
.wbbBoardList .icon {color: #336699;}
@media only screen and (max-width: 800px) {
.wbbBoardList .wbbBoard {padding-left: 7px;}
.wbbBoardList .wbbBoard > div {margin-right: 0;}
.wbbBoardList .wbbBoard > div > .containerHeadline > h3 > a {display: inline-block;width: 88%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.wbbBoardList .wbbCategory > header > h2 {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.wbbBoardList .wbbCategory > header > h2 > a {display: inline-block;text-overflow: ellipsis;overflow: hidden;width: 100%;}
.wbbBoardList .wbbBoardDescription, .wbbBoardList .wbbSubBoards, .wbbBoardList .wbbStats, .wbbBoardList .wbbUsersOnline, .wbbBoardList .collapsibleButton, .wbbBoardList .wbbBoard > span.icon {display: none !important;}
.wbbBoardList .wbbLastPost {position: static;width: auto;}
.wbbBoardList .wbbCollapsibleCategory > header > small {margin-right: 0;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.wbbBoardList .wbbBoard {padding: 7px 14px;}
}
@media only screen and (min-width: 801px) and (max-width: 1239px) {
.wbbBoardList .wbbBoard {padding-left: 56%;}
.wbbBoardList .wbbStats {display: none !important;}
.wbbBoardList .wbbLastPost {right: 55%;width: 45%;}
}
.wbbBoardListReduced .wbbBoardContainer > div {padding: 7px;}
.wbbBoardListReduced .wbbDepth2.wbbBoardContainer > div {padding-right: 28px;}
.wbbBoardListReduced .wbbDepth2.wbbCategory > header {padding-right: 28px;}
.wbbBoardListReduced .wbbDepth3.wbbBoardContainer > div {padding-right: 56px;}
.wbbBoardListReduced .wbbDepth3.wbbCategory > header {padding-right: 56px;}
.wbbBoardListReduced .wbbCategory .wbbDepth2.wbbBoardContainer > div {padding-right: 7px;}
.wbbBoardListReduced .wbbCategory .wbbDepth3.wbbBoardContainer > div {padding-right: 28px;}
#tplBoard .wbbThreadList tr.wbbThreadSticky + tr:not(.wbbThreadSticky):not(.wbbThreadAnnouncement) > td, #tplBoard .wbbThreadList tr.wbbThreadAnnouncement + tr:not(.wbbThreadSticky):not(.wbbThreadAnnouncement) > td {border-top: 1px solid #cccccc;}
@media only screen and (max-width: 800px) {
.wbbThreadList thead {display: none;}
.wbbThreadList tbody .columnMark, .wbbThreadList tbody .columnReplies, .wbbThreadList tbody .columnLikes, .wbbThreadList tbody .columnViews, .wbbThreadList tbody .columnLastPost, .wbbThreadList tbody .columnSubject .statusDisplay {display: none;}
#tplBoard .boxHeadline > p {display: none;}
}
@media only screen and (max-width: 1239px) {
.wbbThreadList thead .columnViews, .wbbThreadList tbody .columnViews {display: none;}
}
@media only screen and (min-width: 641px) and (max-width: 800px) {
.wbbThreadList tbody .columnAvatar {padding-right: 14px;}
.wbbThreadList tbody .columnSubject {padding-left: 14px;}
}
@media only screen and (max-width: 800px) {
#tplThread .contentNavigation > nav:not(.pageNavigation) .button:not(.buttonPrimary):not(.jsThreadInlineEditor) {display: none;}
}
.wbbSimilarThreadList .box48 > div > p:not(:first-child) {color: #808080;}
.wbbSimilarThreadList .box48 > div > p:not(:first-child) a {color: #808080;}
.wbbSimilarThreadList .box48 > div > p:first-child > a {display: block;overflow: hidden;text-overflow: ellipsis;}
.wbbInlineSimilarThreadList {margin: 7px 0;}
.wbbPostPreview .labelList {margin-bottom: 7px;}
.wbbMarkAsDone.icon-check {color: #009900;}
.wbbMarkAsDone.icon-check-empty {color: #cc0000;}
.wbbAdLocationIn1stPost {float:right;margin-bottom: 7px;margin-left: 14px;}
.wbbAdLocationPostList, .wbbAdLocationBoardList {margin-top: 14px;text-align: center;}
.wbbAdLocationPostList > div, .wbbAdLocationBoardList > div {display: inline-block;text-align:right;}
.blogEntryNavigation {margin-top: 14px;}
.blogEntryNavigation::before, .blogEntryNavigation::after {display: table;content: "";}
.blogEntryNavigation::after {clear: both;}
.blogEntryNavigation .blogPreviousEntryButton, .blogEntryNavigation .blogNextEntryButton {width: 50%;}
.blogEntryNavigation .blogPreviousEntryButton > a, .blogEntryNavigation .blogNextEntryButton > a {color: #666666;display: block;text-decoration: none;}
.blogEntryNavigation .blogPreviousEntryButton > a:before, .blogEntryNavigation .blogNextEntryButton > a:before {font-family: FontAwesome;font-size: 28px;display: block;}
.blogEntryNavigation .blogPreviousEntryButton > a:hover, .blogEntryNavigation .blogNextEntryButton > a:hover {color: #003366;}
.blogEntryNavigation .blogPreviousEntryButton > a:hover > span:last-child, .blogEntryNavigation .blogNextEntryButton > a:hover > span:last-child {color: #003366;}
.blogEntryNavigation .blogPreviousEntryButton > a > span, .blogEntryNavigation .blogNextEntryButton > a > span {display: block;}
.blogEntryNavigation .blogPreviousEntryButton > a > span:first-child, .blogEntryNavigation .blogNextEntryButton > a > span:first-child {font-weight: bold;}
.blogEntryNavigation .blogPreviousEntryButton > a > span:last-child, .blogEntryNavigation .blogNextEntryButton > a > span:last-child {color: #808080;}
.blogEntryNavigation .blogPreviousEntryButton {float:right;}
.blogEntryNavigation .blogPreviousEntryButton > a:before {float:right;content: "\f053";}
.blogEntryNavigation .blogPreviousEntryButton > a > span {margin-right: 28px;}
.blogEntryNavigation .blogNextEntryButton {float:left;text-align:left;}
.blogEntryNavigation .blogNextEntryButton > a:before {float:left;content: "\f054";}
.blogEntryNavigation .blogNextEntryButton > a > span {margin-left: 28px;}
@media only screen and (max-width: 800px) {
.blogEntryNavigation .blogPreviousEntryButton, .blogEntryNavigation .blogNextEntryButton {width: 100%;float: none;}
.blogEntryNavigation .blogPreviousEntryButton > a {padding-right: 7px;}
.blogEntryNavigation .blogNextEntryButton > a {padding-left: 7px;}
}
.blogList .inlineDataList {font-size: .85rem;}
.blogArchive > li > a {display: block;padding: 4px 0;text-decoration: none;}
.blogArchive > li > ol {display: none;padding-right: 11px;}
.blogArchive > li > ol > li > a {display: block;padding: 4px 0;text-decoration: none;}
.blogArchive > li > ol > li > ul {display: none;padding-right: 21px;}
.blogArchive > li > ol > li > ul > li {padding: 2px 0;}
.blogArchive > li > ol > li.open > ul {display: block;}
.blogArchive > li > ol > li:not(:last-child) > ul {padding-bottom: 4px;}
.blogArchive > li.open > ol {display: block;}
.blogArchive > li:not(:last-child) > ol {padding-bottom: 11px;}
.blogAdLocationInEntryMessage {float:right;margin-bottom: 7px;margin-left: 14px;}
.calendarMonthView > .calendarMonthViewHeader {box-sizing: border-box;-moz-box-sizing: border-box;background-color: #336699;border-top-right-radius: 6px;border-top-left-radius: 6px;border-width:1px 1px 1px 0;border-style: solid;border-color: #ffffff;color: #ffffff;font-size: .85rem;}
.calendarMonthView > .calendarMonthViewHeader::before, .calendarMonthView > .calendarMonthViewHeader::after {display: table;content: "";}
.calendarMonthView > .calendarMonthViewHeader::after {clear: both;}
.calendarMonthView > .calendarMonthViewHeader > li {box-sizing: border-box;-moz-box-sizing: border-box;border-left: 1px solid #ffffff;float:right;padding: 4px;text-align: center;width: 14.285714%;}
.calendarMonthView > .calendarMonthViewHeader > li:last-child {border-top-left-radius: 6px;}
.calendarMonthView > .calendarWeeks > li {background-color: #fcfdfe;}
.calendarMonthView > .calendarWeeks > li::before, .calendarMonthView > .calendarWeeks > li::after {display: table;content: "";}
.calendarMonthView > .calendarWeeks > li::after {clear: both;}
.calendarMonthView > .calendarWeeks > li:nth-child(even) {background-color: #f1f5fa;}
.calendarMonthView > .calendarWeeks > li:hover {background-color: #d8e7f5;}
.calendarMonthView > .calendarWeeks > li:last-child > .calendarWeekDays {border-bottom-right-radius: 6px;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays {box-sizing: border-box;-moz-box-sizing: border-box;border-right: 1px solid #ffffff;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays::before, .calendarMonthView > .calendarWeeks > li > .calendarWeekDays::after {display: table;content: "";}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays::after {clear: both;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li {box-sizing: border-box;-moz-box-sizing: border-box;border-width:0 0 1px 1px;border-style: solid;border-color: #ffffff;float:right;padding: 4px;width: 14.285714%;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarOffMonth {color: #b3b3b3;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarOffMonth > h3 > a {color: #b3b3b3;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarToday {background-color: #d8e7f5;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarToday > h3 {font-weight: bold;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarWeekend:not(.calendarToday) {background-color: rgba(204,204,204,0.1);}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarWeekend:not(.calendarToday):hover {background-color: transparent;}
.calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li > h3 {text-align: center;}
.calendarMonthView > .calendarWeeks > li:last-child {border-bottom-right-radius: 6px;border-bottom-left-radius: 6px;}
.calendarMonthView > .calendarWeeks > li:last-child > .calendarWeekDays > li:first-child {border-bottom-right-radius: 6px;}
.calendarMonthView > .calendarWeeks > li:last-child > .calendarWeekDays > li:last-child {border-bottom-left-radius: 6px;}
.calendarFullMonthView > .calendarMonthViewHeader {padding-right: 27px;}
.calendarFullMonthView > .calendarMonthViewHeader > li:first-child {border-right: 1px solid #ffffff;}
.calendarFullMonthView > .calendarWeeks > li > div {box-sizing: border-box;-moz-box-sizing: border-box;border-width:0 1px 1px 0;border-style: solid;border-color: #ffffff;float:right;height: 100px;padding: 4px;text-align:left;width: 28px;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays {border-right: 0;margin-right: 28px;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li {height: 100px;position: relative;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li:first-child {border-right-width: 1px;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > h3 {text-align:left;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > .calendarEvents {max-height: 58px;overflow: hidden;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > .calendarEvents > li {font-size: .85rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > .calendarBirthdays {font-size: .85rem;position: absolute;bottom: 7px;}
.calendarFullMonthView > .calendarWeeks > li:last-child > div {border-bottom-right-radius: 6px;}
.calendarFullMonthView > .calendarWeeks > li:last-child > .calendarWeekDays > li:first-child {border-bottom-right-radius: 0;}
.calendarWeekView > .containerList > li {position: relative;}
.calendarWeekView > .containerList > li::before, .calendarWeekView > .containerList > li::after {display: table;content: "";}
.calendarWeekView > .containerList > li::after {clear: both;}
.calendarWeekView > .containerList > li.calendarToday {background-color: #d8e7f5;}
.calendarWeekView > .containerList > li > .calendarDay {background-color: #ffffff;border: 1px solid #cccccc;border-radius: 6px;float:right;padding: 4px 0;text-align: center;width: 90px;}
.calendarWeekView > .containerList > li > .calendarDay > h3 {font-size: 4.0rem;line-height: 100%;}
.calendarWeekView > .containerList > li > .calendarDay > h3 > a {text-decoration: none;}
.calendarWeekView > .containerList > li > .calendarDay > p {color: #b3b3b3;}
.calendarWeekView > .containerList > li > .calendarEvents {margin:4px 103px 0 0;}
.calendarWeekView > .containerList > li > .calendarEvents > li {background-color: #f1f5fa;padding: 7px;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.calendarWeekView > .containerList > li > .calendarEvents > li:not(:last-child) {border-bottom: 1px solid #cccccc;}
.calendarWeekView > .containerList > li > .calendarEvents > li:nth-child(2n) {background-color: #fcfdfe;}
.calendarWeekView > .containerList > li > .calendarEvents > li:hover {background-color: #d8e7f5 !important;}
.calendarWeekView > .containerList > li > .calendarEvents + .calendarBirthdays {margin-top: 14px;}
.calendarWeekView > .containerList > li > .calendarBirthdays {margin:3px 106px 0 80px;}
.calendarWeekView > .containerList > li > .calendarBirthdays > h4 {margin-bottom: 2px;}
.calendarWeekView > .containerList > li > .calendarBirthdays > .framedIconList {margin-bottom: -4px;}
.calendarWeekView > .containerList > li:nth-child(2n) > .calendarEvents > li {background-color: #fcfdfe;}
.calendarWeekView > .containerList > li:nth-child(2n) > .calendarEvents > li:nth-child(2n) {background-color: #f1f5fa;}
.calendarWeekView > .containerList > li:hover:not(.calendarToday) {background-color: #fcfdfe;}
.calendarWeekView > .containerList > li:hover:not(.calendarToday):nth-child(2n) {background-color: #f1f5fa;}
.calendarDateNavigation {float:right;}
.calendarNavigationHeadline {overflow: visible;position: relative;}
.calendarNavigationHeadline > nav.buttonGroupNavigation {position: absolute;left: 2px;top: 4px;}
.calendarParticipantList > li > div {white-space: normal;}
.calendarEventInfoWindow .boxHeadline {margin-top: 0;white-space: nowrap;}
.calendarEventInfoWindow > ul {margin-top: 7px;}
.calendarEventInfoWindow > ul > li:not(:last-child) {margin-bottom: 7px;}
@media only screen and (max-width: 800px) {
.calendarWeekView > .containerList > li > .calendarDay {width: 45px;}
.calendarWeekView > .containerList > li > .calendarDay > p {font-size: .85rem;}
.calendarWeekView > .containerList > li > .calendarDay > h3 {font-size: 2.0rem;}
.calendarWeekView > .containerList > li > .calendarDayOfWeek {font-size: .85rem;left: 7px;top: 7px;}
.calendarWeekView > .containerList > li > .calendarEvents {margin-right: 56px;}
.calendarWeekView > .containerList > li > .calendarBirthdays {margin-right: 59px;}
.calendarFullMonthView > .calendarMonthViewHeader {display: none;}
.calendarFullMonthView > .calendarWeeks > li.open > div:after {content: "\f107";}
.calendarFullMonthView > .calendarWeeks > li.open > .calendarWeekDays {display: block;}
.calendarFullMonthView > .calendarWeeks > li > div {color: #336699;cursor: pointer;display: block;float: none;height: 3rem;padding-top: .75rem;position: relative;text-align: center;width: 100%;}
.calendarFullMonthView > .calendarWeeks > li > div:after {content: "\f105";right: 0;position: absolute;top: .85rem;color: #666666;display: inline-block;font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;line-height: 1em;text-align: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;text-shadow:-0 1px 0 rgba(255,255,255,0.8);font-size: 14px;height: 16px;width: 16px;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays {display: none;margin-right: 0;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li {display: block;float: none;height: auto;min-height: 60px;width: 100%;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > h3 {font-size: .85rem;}
.calendarFullMonthView > .calendarWeeks > li > .calendarWeekDays > li > a {position: static;}
}
.calendarEventBox {display: inline-block;line-height: 1.28;max-width: 500px;padding: 11px 14px;white-space: nowrap;}
.calendarEventBox > div > .containerHeadline {position: relative;}
.calendarEventBox > div > .containerHeadline > h3 {text-overflow: ellipsis;overflow: hidden;}
.calendarEventBox > div > .containerHeadline > p {color: #808080;font-size: .85rem;}
.calendarEventBox > div > .containerHeadline > p > a {color: #808080;}
.calendarEventBox > div > .containerHeadline > p > .containerContentType {color: #b3b3b3;position: absolute;left: 0;}
.calendarEventBox > div > .containerHeadline > p.calendarEventShowLocation {display: table;width: 100%;}
.calendarEventBox > div > .containerHeadline > p.calendarEventShowLocation > span {display: table-cell;}
.calendarEventBox > div > .containerHeadline > p.calendarEventShowLocation > .containerContentType {display: table-cell;padding-right: 14px;position: relative;text-align:left;}
@media only screen and (max-width: 800px) {
.calendarEventBox {display: block;}
}
.filebaseContainerBoxList > li .containerHeadline > h3 {text-overflow: ellipsis;overflow: hidden;}
.filebaseContainerBoxList > li .containerHeadline > p {color: #808080;font-size: .85rem;}
.filebaseContainerBoxList > li .containerHeadline > p > a {color: #808080;}
.filebaseFeaturedFileList > li::before, .filebaseFeaturedFileList > li::after {display: table;content: "";}
.filebaseFeaturedFileList > li::after {clear: both;}
.filebaseFeaturedFileList > li:not(:first-child) {display: none;}
.filebaseFeaturedFileList > li > div > a {float:right;}
.filebaseFeaturedFileList > li > div > a > img {background-color: #ffffff;border: 1px solid #cccccc;padding: 7px;box-shadow:  -0 2px 3px 0 rgba(0,0,0,0.15);}
.filebaseFeaturedFileList > li > div > div {height: 153px;margin-right: 177px;padding-top: 7px;position: relative;}
.filebaseFeaturedFileList > li > div > div > .containerHeadline > h3 {margin-bottom: 2px;}
.filebaseFeaturedFileList > li > div > div > .containerHeadline > p {color: #808080;font-size: .85rem;}
.filebaseFeaturedFileList > li > div > div > .containerHeadline > p > a {color: #808080;}
.filebaseFeaturedFileList > li > div > div > .containerHeadline+ div {margin-top: 11px;max-height: 48px;overflow: hidden;}
.filebaseFeaturedFileList > li > div > div > .buttonList {bottom: 7px;position: absolute;left: 7px;}
.filebaseFilePreview {min-height: 148px;}
.filebaseFilePreview > p {float:right;}
.filebaseFilePreview > div {margin-right: 158px;}
.filebaseVersion {color: #808080;}
.filebaseFileHeadline > .buttonList {float:left;margin:7px 7px 0 7px;}
.filebaseFileHeadline > .buttonList .button {text-align: center;}
.filebaseFileHeadline > h1 {display: inline;}
.filebaseFileHeadline > h1 .likesBadge {margin-right: 4px;}
.filebaseFileHeadline > h1 .likesBadge:not(.green):not(.red) {color: #ffffff;}
.filebaseFileHeadline > .labelList {display: inline;margin-right: 4px;}
.filebaseFileHeadline > .labelList > li {font-size: 1.7rem;margin-bottom: 0;}
.filebaseFileHeadline.filebaseFileHeadlineIcon {padding-right: 58px;position: relative;}
.filebaseFileHeadline.filebaseFileHeadlineIcon > .framed {right: 0;position: absolute;}
@media only screen and (max-width: 800px) {
.filebaseFileHeadline {display: table;table-layout: fixed;}
.filebaseFileHeadline > .buttonList {float: none;display: table-footer-group;text-align: center;}
.filebaseFileHeadline > .buttonList > li {margin-top: 7px;margin-bottom: 0;}
}
.filebaseFileOptions {border-bottom: 1px dotted #cccccc;margin: 0 21px;padding: 14px;}
#versions > ul > li.versionsMore {text-align: center;}
.filebaseFileBox {display: inline-block;line-height: 1.28;max-width: 500px;padding: 11px 14px;white-space: nowrap;}
.filebaseFileBox > ul > li:not(:last-child) {padding-bottom: 11px;margin-bottom: 11px;border-bottom: 1px dotted #cccccc;}
.filebaseFileBox > ul > li > div > .containerHeadline {position: relative;}
.filebaseFileBox > ul > li > div > .containerHeadline > h3 {text-overflow: ellipsis;overflow: hidden;}
.filebaseFileBox > ul > li > div > .containerHeadline > p {color: #808080;font-size: .85rem;margin-left: 50px;}
.filebaseFileBox > ul > li > div > .containerHeadline > p > a {color: #808080;}
.filebaseFileBox > ul > li > div > .containerHeadline > .containerContentType {bottom: 0;color: #b3b3b3;position: absolute;left: 0;}
@media only screen and (max-width: 800px) {
.filebaseFileBox {display: block;}
}
@media only screen and (max-width: 800px) {
.filebaseFeaturedFileList > li > div > a > img {height: auto !important;max-width: 72px;width: auto !important;}
.filebaseFeaturedFileList > li > div > div {height: 133px;margin-right: 98px;padding-top: 14px;}
.filebaseFeaturedFileList .fileTeaser {display: none;}
.filebaseFeaturedFileList .button > small {display: none;}
.filebaseNewestFileList {max-height: none;}
.filebaseNewestFileList > li {float: none;width: auto;}
.filebaseFileHeadline {overflow: visible;padding-left: 30px;}
.filebaseFileList thead {display: none;}
.filebaseFileList tbody .columnMark, .filebaseFileList tbody .columnLikes, .filebaseFileList tbody .columnComments, .filebaseFileList tbody .columnDownloads, .filebaseFileList tbody .columnLastChangeTime, .filebaseFileList tbody .columnSubject .statusDisplay {display: none;}
}
#fileIconUpload .buttonList > li:first-child {vertical-align: bottom;}
#fileIconUpload .buttonList > li:first-child .uploadButton {vertical-align: bottom;}
.galleryImageList {margin-bottom: -2%;}
.galleryImageList::before, .galleryImageList::after {display: table;content: "";}
.galleryImageList::after {clear: both;}
.galleryImageList > li {display: block;float:right;margin-bottom: 2%;margin-right: 1%;margin-left: 1%;overflow: hidden;position: relative;width: 31.333333333333%;}
.galleryImageList > li:nth-child(3n+1) {clear: both;}
.galleryImageList > li > a {display: block;}
.galleryImageList > li > a > img {width: 100%;}
.galleryImageList > li > div {background-color: rgba(0,0,0,0.6);bottom: 0;color: #fff;position: absolute;width: 100%;padding: 7px 0;}
.galleryImageList > li > div a {color: #fff;}
.galleryImageList > li > div > p, .galleryImageList > li > div > div > small, .galleryImageList > li > div > div > dl {margin: 0 7px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.galleryImageList > li > div > p {margin-left: 32px;}
.galleryImageList > li > div > label {bottom: 5px;position: absolute;left: 7px;}
.galleryImageList > li > div > div {height: 0;overflow: hidden;-webkit-transition-property: height;transition-property: height;-webkit-transition-duration: .25s;transition-duration: .25s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.galleryImageList > li > div > div > dl {font-size: .85rem;margin-top: 2px;}
.galleryImageList > li > div > div > dl > dt::after {display: none;}
.galleryImageList > li > div > div > dl > dd {margin-left: 7px;}
.galleryImageList > li > div .icon {color: #fff;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.galleryImageList > li.imageDisabled > div {background-color: rgba(238,255,238,0.9);color: #009900;}
.galleryImageList > li.imageDisabled > div a {color: #009900;}
.galleryImageList > li.imageDisabled > div .icon {color: #009900;text-shadow: none;}
.galleryImageList > li.imageDeleted > div {background-color: rgba(255,238,238,0.9);color: #cc0000;}
.galleryImageList > li.imageDeleted > div a {color: #cc0000;}
.galleryImageList > li.imageDeleted > div .icon {color: #cc0000;text-shadow: none;}
.galleryImageList > li.jsMarked > div {background-color: rgba(255,255,200,0.9);color: #666666;}
.galleryImageList > li.jsMarked > div a {color: #666666;}
.galleryImageList > li.jsMarked > div .icon {color: #666666;text-shadow: none;}
.galleryImageList > li.jsGalleryImageShowDetails > div > div, .galleryImageList > li:hover > div > div {height: 2.5em;}
.gallerySortableImageList {font-size: 0;padding: 0 7px;margin-bottom: -14px;margin-right: 0;margin-left: -14px;}
.gallerySortableImageList > .gallerySortableImagePlaceholder {background-color: #efcb50;}
.gallerySortableImageList > li {display: inline-block;margin-bottom: 14px;margin-left: 14px;min-height: 144px;min-width: 144px;position: relative;vertical-align: top;}
.gallerySortableImageList > li > div {background-color: rgba(0,0,0,0.6);bottom: 0;color: #fff;position: absolute;width: 100%;padding: 7px 0;}
.gallerySortableImageList > li > div > p {font-size: .85rem;margin: 0 7px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.galleryAlbumList ul.galleryAlbumCoverImages {margin-bottom: 7px;margin-left: -7px;margin-top: 14px;max-height: 295px;overflow: hidden;}
.galleryAlbumList ul.galleryAlbumCoverImages > li {float:right;margin-left: 7px;margin-bottom: 7px;}
.galleryAlbumList ul.galleryAlbumCoverImages.galleryMediumAlbumCoverImages {height: 295px;}
.galleryAlbumList ul.galleryAlbumCoverImages.galleryMediumAlbumCoverImages > li:first-child {height: 295px;margin-bottom: 0;position: relative;}
.galleryAlbumList ul.galleryAlbumCoverImages.galleryMediumAlbumCoverImages > li:first-child > a > img {position: relative;top: -62px;}
.galleryAlbumList ul.galleryAlbumCoverImages.galleryMediumAlbumCoverImages > li:not(:first-child) {margin-bottom: 7px;}
.galleryImageContainer > .galleryImage {position: relative;text-align: center;}
.galleryImageContainer > .galleryImage img {max-width: 100%;}
.galleryImageContainer > .galleryImage > .galleryPreviousImageButton, .galleryImageContainer > .galleryImage > .galleryNextImageButton {background-color: black;border-radius: 30px;margin-top: -20px;opacity: .2;padding: 4px;position: absolute;top: 50%;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.galleryImageContainer > .galleryImage > .galleryPreviousImageButton > span, .galleryImageContainer > .galleryImage > .galleryNextImageButton > span {color: white;position: relative;text-shadow: none;top: 4px;}
.galleryImageContainer > .galleryImage > .galleryPreviousImageButton:hover, .galleryImageContainer > .galleryImage > .galleryNextImageButton:hover {opacity: .9 !important;}
.galleryImageContainer > .galleryImage:hover > .galleryPreviousImageButton, .galleryImageContainer > .galleryImage:hover > .galleryNextImageButton {opacity: .6;}
.galleryImageContainer > .galleryImage > .galleryPreviousImageButton {right: 7px;}
.galleryImageContainer > .galleryImage > .galleryPreviousImageButton > span {right: -2px;}
.galleryImageContainer > .galleryImage > .galleryNextImageButton {left: 7px;}
.galleryImageContainer > .galleryImage > .galleryNextImageButton > span {right: 2px;}
.gallerySidebarBoxList > li > .framed > img {max-width: 64px;}
.gallerySidebarBoxList > li > .sidebarBoxHeadline {padding-top: 7px;}
.gallerySidebarImageList {font-size: 0;margin-left: -4px;}
.gallerySidebarImageList > li {display: inline-block;margin-left: 4px;margin-bottom: 4px;}
.gallerySidebarImageList > li > a {display: block;}
.gallerySidebarImageList > li > a > img {width: 88px;}
.gallerySidebarBoxImageNavigation {font-size: 0;}
.gallerySidebarBoxImageNavigation > ul {height: 76px;position: relative;overflow: hidden;}
.gallerySidebarBoxImageNavigation > ul > li {display: inline-block;position: absolute;}
.gallerySidebarBoxImageNavigation > ul > li:first-child, .gallerySidebarBoxImageNavigation > ul > li:last-child {background-color: #afceeb;height: 76px;vertical-align: top;z-index: 10;}
.gallerySidebarBoxImageNavigation > ul > li:first-child.disabled, .gallerySidebarBoxImageNavigation > ul > li:last-child.disabled {opacity: 0.5;}
.gallerySidebarBoxImageNavigation > ul > li:first-child.disabled > .icon, .gallerySidebarBoxImageNavigation > ul > li:last-child.disabled > .icon {cursor: not-allowed;}
.gallerySidebarBoxImageNavigation > ul > li:first-child > .icon, .gallerySidebarBoxImageNavigation > ul > li:last-child > .icon {padding: 30px 0;}
.gallerySidebarBoxImageNavigation > ul > li:first-child {margin-left: 3px;right: 0;}
.gallerySidebarBoxImageNavigation > ul > li:nth-child(2) {right: 19px;position: relative;}
.gallerySidebarBoxImageNavigation > ul > li:last-child {left: 0;}
.gallerySidebarBoxImageNavigation > ul > li > ul {height: 76px;width: 99999px;position: absolute;overflow: hidden;}
.gallerySidebarBoxImageNavigation > ul > li > ul > li {display: inline-block;margin-left: 3px;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.gallerySidebarBoxImageNavigation > ul > li > ul > li:not(.active) {opacity: 0.5;}
.gallerySidebarBoxImageNavigation > ul > li > ul > li:hover {opacity: 1;}
.gallerySidebarBoxImageNavigation > ul > li > ul > li > a {display: block;}
.gallerySidebarBoxImageNavigation > ul > li > ul > li > a > img {width: 76px;}
.galleryImageHeadline {overflow: visible;padding-left: 250px;position: relative;}
.galleryImageHeadline > nav.buttonGroupNavigation {position: absolute;left: 4px;top: 4px;}
.galleryImageHeadline > h1 .likesBadge {margin-right: 4px;}
.galleryImageHeadline > h1 .likesBadge:not(.green):not(.red) {color: #ffffff;}
#thumbnailList {margin-bottom: -21px;}
#thumbnailList::before, #thumbnailList::after {display: table;content: "";}
#thumbnailList::after {clear: both;}
#thumbnailList > li {border: 1px solid #cccccc;float:right;margin:0 0 21px 21px;padding: 7px;position: relative;}
#thumbnailList > li.active {background-color: #ffffc8;}
#thumbnailList > li.active:hover .imageOptions {background-color: #ffffc8 !important;}
#thumbnailList > li.imageError {background-color: #c95145;border-color: #913d37;}
#thumbnailList > li .imageOptions {display: none;position: absolute;bottom: 7px;left: 7px;background-color: #fcfdfe !important;}
#thumbnailList > li:hover .imageOptions {display: block;padding: 3px;background-color: rgba(255,255,255,0);}
#thumbnailList > li.jsImageUpload {position: relative;}
#thumbnailList > li.jsImageUpload > input {position: absolute;height: 100px;width: 100px;right: 7px;opacity: 0;top: 7px;z-index: 100;}
#thumbnailList > li.jsImageUpload > input, #thumbnailList > li.jsImageUpload > span {cursor: pointer !important;}
#thumbnailList > li > .icon32 {position: absolute;right: 40px;top: 40px;}
#thumbnailList > li > progress {bottom: 7px;position: absolute;width: 100px;}
#thumbnailList > li, #thumbnailList > li > img {height: 100px;width: 100px;}
#image {text-align: center;}
#image > img {max-height: 800px;max-width: 100%;}
.galleryOverwriteIcon {margin-right: 7px;}
.galleryPreviewTag > img {background-color: #ffffff;border: 1px solid #cccccc;padding: 7px;}
.galleryPreviewTagBox {min-height: 160px;}
.galleryPreviewTagBox > .galleryPreviewTag {float:right;}
.galleryPreviewTagBox > div {margin-right: 174px;}
.galleryPreviewTagList {margin-left: -7px;margin-bottom: -7px;}
.galleryPreviewTagList::before, .galleryPreviewTagList::after {display: table;content: "";}
.galleryPreviewTagList::after {clear: both;}
.galleryPreviewTagList > li {float:right;margin:0 0 7px 7px;}
#galleryImageThumbnailAreaSelector {position: relative;}
#galleryImageThumbnailAreaSelector:not(.disabled) {cursor: move;}
#galleryImageThumbnailAreaSelector > .galleryImageThumbnailArea {box-sizing: border-box;border: #ffffc8 3px solid;width: 100%;height: 100%;position: absolute;}
#galleryImageThumbnailAreaButtons {bottom: 25px;cursor: pointer;position: fixed;left: 25px;z-index: 400;}
.galleryImageSeries {max-width: 560px;}
.galleryImageSeries .slideshowButtonList {text-align: center;width: 100%;}
.galleryImageSeries .galleryImageSeriesImage:not(:only-child) {padding-top: 21px;}
.galleryImageSeries .galleryImageSeriesImage .galleryImageSeriesHeadline {border-bottom: 1px solid #cccccc;margin-bottom: 7px;}
.galleryImageSeries .galleryImageSeriesImage .containerHeadline:not(:first-child) p {height: 1.5em;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.galleryNewImageBagde {background-color: #4674a4;color: #ffffff;font-weight: bold;right: -15px;letter-spacing: 1px;padding: 1px 0;position: absolute;text-align: center;top: 10px;white-space: nowrap;width: 80px;-webkit-backface-visibility: hidden;-webkit-transform: rotate(-40deg);-moz-transform: rotate(-40deg);-ms-transform: rotate(-40deg);-o-transform: rotate(-40deg);}
html[dir='rtl'] .galleryNewImageBagde {-webkit-transform: rotate(40deg);-moz-transform: rotate(40deg);-ms-transform: rotate(40deg);-o-transform: rotate(40deg);}
.galleryImageInfoWindow .boxHeadline {margin-top: 0;white-space: nowrap;}
.galleryImageInfoWindow > ul {font-size: 0;}
.galleryImageInfoWindow > ul > li {display: inline-block;margin-left: 7px;margin-top: 7px;}
.galleryImageInfoWindow > ul > li img {max-height: 50px;vertical-align: bottom;}
#galleryImagesInMotion {height: 500px;overflow: hidden;position: relative;}
#galleryImagesInMotion.loading:before {content: "\f110";margin:-24px -24px 0 0;right: 50%;position: absolute;top: 50%;color: #666666;display: inline-block;font-family: FontAwesome;font-weight: normal !important;font-style: normal !important;line-height: 1em;text-align: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;text-shadow:-0 1px 0 rgba(255,255,255,0.8);font-size: 42px;height: 48px;width: 48px;height: auto;-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
#galleryImagesInMotion.loading:before.disabled {opacity: .3;}
#galleryImagesInMotion.loading:before:hover {text-decoration: none;}
#galleryImagesInMotion.loading:before.green {color: #009900;}
#galleryImagesInMotion.loading:before.red {color: #cc0000;}
#galleryImagesInMotion.loading:before.black {color: #333;}
#galleryImagesInMotion.loading:before.brown {color: #c63;}
#galleryImagesInMotion.loading:before.orange {color: #f90;}
#galleryImagesInMotion.loading:before.yellow {color: #ff0;}
#galleryImagesInMotion.loading:before.blue {color: #369;}
#galleryImagesInMotion.loading:before.purple {color: #c0f;}
#galleryImagesInMotion.loading:before.pink {color: #f0c;}
#galleryImagesInMotion:hover > .primary > figcaption {opacity: 1;}
#galleryImagesInMotion:hover > a {opacity: 1;}
#galleryImagesInMotion > canvas {border-radius: 6px;bottom: 0;right: 0;overflow: hidden;position: absolute;left: 0;top: 0;z-index: 0;}
#galleryImagesInMotion > canvas.secondary {z-index: 1;}
#galleryImagesInMotion > a {background-color: rgba(0,0,0,0.4);border-radius:0 0 6px 6px;bottom: 0;height: 52px;right: 0;opacity: 0;padding: 10px;position: absolute;left: 0;text-decoration: none;z-index: 2;transition: opacity linear .3s;}
#galleryImagesInMotion > a > img {height: 48px;width: 48px;}
#galleryImagesInMotion > a > h1 {color: #ffffff;font-size: 1.8rem;font-weight: normal;margin:10px 65px 0 0;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
#galleryImagesInMotion > img {display: none;}
#galleryImageGrid {height: 420px;overflow: hidden;display: -ms-flexbox;-ms-flex-wrap: wrap;display: -webkit-flex;-webkit-flex-wrap: wrap;display: flex;flex-wrap: wrap;}
#galleryImageGrid > .imageGridMain {background-color: #ffffff;border: 1px solid #cccccc;box-sizing: border-box;height: 420px;min-width: 560px;padding: 1px;position: relative;-ms-flex: 1 0 auto;-webkit-flex: 1 0 auto;flex: 1 0 auto;}
#galleryImageGrid > .imageGridMain > a {bottom: 1px;right: 1px;opacity: 0;overflow: hidden;position: absolute;left: 1px;text-decoration: none;top: 1px;z-index: 1;transition: opacity 1.5s linear;}
#galleryImageGrid > .imageGridMain > a.active {opacity: 1;z-index: 2;}
#galleryImageGrid > .imageGridMain > a.active:hover > span::before {-webkit-transform: none;transform: none;}
#galleryImageGrid > .imageGridMain > a.active > span::before {background-color: rgba(0,0,0,0.5);bottom: 0;content: attr(data-title);color: #ffffff;display: block;font-size: 1.4rem;right: 0;padding: 14px 21px;position: absolute;left: 0;-webkit-transform: translateY(100%);transform: translateY(100%);transition: -webkit-transform .3s linear;transition: transform .3s linear;}
#galleryImageGrid > .imageGridMain > a > span {background-position: center;background-repeat: no-repeat;background-size: 100%;display: block;height: 100%;opacity: 1;transition: opacity .3s linear;}
#galleryImageGrid > .imageGridMain > a > span.imageLoading {opacity: 0;}
#galleryImageGrid > .imageGridColumn {height: 420px;overflow: hidden;display: -ms-flexbox;-ms-flex: 0 282px;-ms-flex-wrap: wrap;display: -webkit-flex;-webkit-flex: 0 282px;-webkit-flex-wrap: wrap;display: flex;flex: 0 282px;flex-wrap: wrap;}
#galleryImageGrid > .imageGridColumn > li {background-color: #ffffff;border: 1px solid #cccccc;box-sizing: border-box;margin:0 10px 10px 0;max-height: 210px;padding: 1px;position: relative;transition: margin-top 1s cubic-bezier(.17,.67,.48,1.22);}
#galleryImageGrid > .imageGridColumn > li.imageGridItemOffset {margin-top: -100%;}
#galleryImageGrid > .imageGridColumn > li > a {display: block;overflow: hidden;position: relative;text-decoration: none;}
#galleryImageGrid > .imageGridColumn > li > a:hover::before {-webkit-transform: none;transform: none;}
#galleryImageGrid > .imageGridColumn > li > a::before {background-color: rgba(0,0,0,0.5);bottom: 0;content: attr(data-title);color: #ffffff;display: block;right: 0;padding: 7px 14px;position: absolute;left: 0;-webkit-transform: translateY(100%);transform: translateY(100%);transition: -webkit-transform .3s linear;transition: transform .3s linear;}
#galleryImageGrid > .imageGridColumn > li > a > img {height: 201px;opacity: 1;width: 268px;transition: opacity .3s linear;}
#galleryImageGrid > .imageGridColumn > li > a > img.imageLoading {opacity: 0;}
#galleryImageGrid > .imageGridMain:not(.hideLoading)::before, #galleryImageGrid > .imageGridColumn > li::before {content: "\f110";display: block;font-family: FontAwesome;font-size: 28px;right: 50%;margin:-14px -14px 0 0;position: absolute;top: 50%;height: auto;-moz-animation: spin 2s infinite linear;-o-animation: spin 2s infinite linear;-webkit-animation: spin 2s infinite linear;animation: spin 2s infinite linear;}
html.touch #galleryImageGrid > .imageGridMain > a.active > span::before, html.touch #galleryImageGrid > .imageGridColumn > li > a::before {-webkit-transform: none;transform: none;}
@media only screen and (max-width: 800px) {
#galleryImageGrid > .imageGridMain > a.active > span::before {-webkit-transform: none;transform: none;}
}
.galleryImageBrowserContainerList > li {height: 96px;}
.galleryImageBrowserContainerList > li > .box64 > .framed > img {width: 64px;height: 64px;}
.galleryImageBrowserContainerList > li > .box64 > .details {padding-top: 7px;}
.galleryImageBrowserContainerList > li > .box64 > .details > .containerHeadline > h3 {overflow: hidden;padding-left: 21px;text-overflow: ellipsis;white-space: nowrap;}
.galleryImageBrowserContainerList > li > .box64 > .details > nav > .buttonList {opacity: 1;}
@media only screen and (min-width: 801px) {
#galleryImageBrowser > div.container {min-height: 530px;min-width: 720px;}
}
@media only screen and (max-width: 800px) {
.galleryImageList {margin-left: 0;}
#galleryImagesInMotion {margin-right: 7px;margin-left: 7px;}
.galleryImageHeadline {padding-left: 30px;}
.galleryImageContainer {padding: 0 7px;}
.galleryAlbumList ul.galleryAlbumCoverImages {margin-bottom: 0;margin-left: 0;}
.galleryAlbumList ul.galleryAlbumCoverImages > li:first-child {width: 295px;overflow: hidden;}
.galleryAlbumList ul.galleryAlbumCoverImages > li:first-child > a > img {top: 0;height: 295px;right: -49px;}
}
@media only screen and (max-width: 1200px) {
#galleryImagesInMotion {height: 300px;}
}
.galleryImageMarker.icon32 {height: auto;width: auto;}
.galleryImageMarkerContainer {position: relative;}
.galleryImageMarkerContainer .galleryImageMarker {border: 2px solid #ffffff;position: absolute;opacity: 0.5;height: 35px;width: 35px;box-shadow:  -0 0 2px 0 #000000;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .25s;transition-duration: .25s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.galleryImageMarkerContainer .galleryImageMarker:hover {opacity: 1;}
.galleryImageMarkerContainer .galleryImageMarker.jsMarked {border-color: #ffff66;opacity: 1;}
#userNotifications:not([data-count="0"]) > a > span.icon, #userNotifications > a > span.icon.animated {-moz-animation: fa-ring 5s ease infinite;-o-animation: fa-ring 5s ease infinite;-webkit-animation: fa-ring 5s ease infinite;animation: fa-ring 5s ease infinite;-moz-transform-origin: 50% 4px initial;-o-transform-origin: 50% 4px;-webkit-transform-origin: 50% 4px initial;-ms-transform-origin: 50% 4px initial;transform-origin: 50% 4px;}
@-webkit-keyframes fa-ring {0% {-webkit-transform: rotate(0);}
1% {-webkit-transform: rotate(30deg);}
3% {-webkit-transform: rotate(-28deg);}
5% {-webkit-transform: rotate(34deg);}
7% {-webkit-transform: rotate(-32deg);}
9% {-webkit-transform: rotate(30deg);}
11% {-webkit-transform: rotate(-28deg);}
13% {-webkit-transform: rotate(26deg);}
15% {-webkit-transform: rotate(-24deg);}
17% {-webkit-transform: rotate(22deg);}
19% {-webkit-transform: rotate(-20deg);}
21% {-webkit-transform: rotate(18deg);}
23% {-webkit-transform: rotate(-16deg);}
25% {-webkit-transform: rotate(14deg);}
27% {-webkit-transform: rotate(-12deg);}
29% {-webkit-transform: rotate(10deg);}
31% {-webkit-transform: rotate(-8deg);}
33% {-webkit-transform: rotate(6deg);}
35% {-webkit-transform: rotate(-4deg);}
37% {-webkit-transform: rotate(2deg);}
39% {-webkit-transform: rotate(-1deg);}
41% {-webkit-transform: rotate(1deg);}
43% {-webkit-transform: rotate(0deg);}
100% {-webkit-transform: rotate(0deg);}
}
@-moz-keyframes fa-ring {0% {-moz-transform: rotate(0);}
1% {-moz-transform: rotate(30deg);}
3% {-moz-transform: rotate(-28deg);}
5% {-moz-transform: rotate(34deg);}
7% {-moz-transform: rotate(-32deg);}
9% {-moz-transform: rotate(30deg);}
11% {-moz-transform: rotate(-28deg);}
13% {-moz-transform: rotate(26deg);}
15% {-moz-transform: rotate(-24deg);}
17% {-moz-transform: rotate(22deg);}
19% {-moz-transform: rotate(-20deg);}
21% {-moz-transform: rotate(18deg);}
23% {-moz-transform: rotate(-16deg);}
25% {-moz-transform: rotate(14deg);}
27% {-moz-transform: rotate(-12deg);}
29% {-moz-transform: rotate(10deg);}
31% {-moz-transform: rotate(-8deg);}
33% {-moz-transform: rotate(6deg);}
35% {-moz-transform: rotate(-4deg);}
37% {-moz-transform: rotate(2deg);}
39% {-moz-transform: rotate(-1deg);}
41% {-moz-transform: rotate(1deg);}
43% {-moz-transform: rotate(0deg);}
100% {-moz-transform: rotate(0deg);}
}
@-ms-keyframes fa-ring {0% {-ms-transform: rotate(0);}
1% {-ms-transform: rotate(30deg);}
3% {-ms-transform: rotate(-28deg);}
5% {-ms-transform: rotate(34deg);}
7% {-ms-transform: rotate(-32deg);}
9% {-ms-transform: rotate(30deg);}
11% {-ms-transform: rotate(-28deg);}
13% {-ms-transform: rotate(26deg);}
15% {-ms-transform: rotate(-24deg);}
17% {-ms-transform: rotate(22deg);}
19% {-ms-transform: rotate(-20deg);}
21% {-ms-transform: rotate(18deg);}
23% {-ms-transform: rotate(-16deg);}
25% {-ms-transform: rotate(14deg);}
27% {-ms-transform: rotate(-12deg);}
29% {-ms-transform: rotate(10deg);}
31% {-ms-transform: rotate(-8deg);}
33% {-ms-transform: rotate(6deg);}
35% {-ms-transform: rotate(-4deg);}
37% {-ms-transform: rotate(2deg);}
39% {-ms-transform: rotate(-1deg);}
41% {-ms-transform: rotate(1deg);}
43% {-ms-transform: rotate(0deg);}
100% {-ms-transform: rotate(0deg);}
}
@-o-keyframes fa-ring {0% {-o-transform: rotate(0);}
1% {-o-transform: rotate(30deg);}
3% {-o-transform: rotate(-28deg);}
5% {-o-transform: rotate(34deg);}
7% {-o-transform: rotate(-32deg);}
9% {-o-transform: rotate(30deg);}
11% {-o-transform: rotate(-28deg);}
13% {-o-transform: rotate(26deg);}
15% {-o-transform: rotate(-24deg);}
17% {-o-transform: rotate(22deg);}
19% {-o-transform: rotate(-20deg);}
21% {-o-transform: rotate(18deg);}
23% {-o-transform: rotate(-16deg);}
25% {-o-transform: rotate(14deg);}
27% {-o-transform: rotate(-12deg);}
29% {-o-transform: rotate(10deg);}
31% {-o-transform: rotate(-8deg);}
33% {-o-transform: rotate(6deg);}
35% {-o-transform: rotate(-4deg);}
37% {-o-transform: rotate(2deg);}
39% {-o-transform: rotate(-1deg);}
41% {-o-transform: rotate(1deg);}
43% {-o-transform: rotate(0deg);}
100% {-o-transform: rotate(0deg);}
}
@keyframes fa-ring {0% {transform: rotate(0);}
1% {transform: rotate(30deg);}
3% {transform: rotate(-28deg);}
5% {transform: rotate(34deg);}
7% {transform: rotate(-32deg);}
9% {transform: rotate(30deg);}
11% {transform: rotate(-28deg);}
13% {transform: rotate(26deg);}
15% {transform: rotate(-24deg);}
17% {transform: rotate(22deg);}
19% {transform: rotate(-20deg);}
21% {transform: rotate(18deg);}
23% {transform: rotate(-16deg);}
25% {transform: rotate(14deg);}
27% {transform: rotate(-12deg);}
29% {transform: rotate(10deg);}
31% {transform: rotate(-8deg);}
33% {transform: rotate(6deg);}
35% {transform: rotate(-4deg);}
37% {transform: rotate(2deg);}
39% {transform: rotate(-1deg);}
41% {transform: rotate(1deg);}
43% {transform: rotate(0deg);}
100% {transform: rotate(0deg);}
}
.externalLinkMessage {width: 500px;height: 80px;position: absolute;top: 50%;right: 50%;margin-top: -40x;margin-right: -250px;display: table;}
.externalLinkMessage > div {text-align: center;display: table-cell;vertical-align: middle;}
.externalLinkMessage .bold {font-weight: bold;}
.externalLinkMessage .button, .externalLinkMessage button:not([disabled]) {text-shadow: none;}
.externalLinkMessage .info:after, .externalLinkMessage .error:after, .externalLinkMessage .success:after, .externalLinkMessage .warning:after {display: none;}
.externalLinkMessage .success {color: #ffffff;}
.externalLinkMessage .error {color: #ffffff;}
.notifybox {width: 170px;position: fixed;right: 21px;padding: 10px 10px;z-index: 500;opacity: 0.80;text-decoration: none !important;}
.notifybox .notifyboxAuthor {font-weight: bold;font-size: 1.1rem;display: block;}
.notifybox a {text-decoration: none;}
.notifybox:hover {opacity: 1;color: #ffffff !important;}
.notifybox:hover small {text-decoration: underline;}
.notifybox:after {content: '' !important;background-image: none !important;}
#shoutbox {overflow: hidden;position: relative;background-color: #f1f5fa;padding: 10px;border-bottom-right-radius: 4px;border-bottom-left-radius: 4px;}
#shoutbox .shoutboxContent {overflow: auto;}
#shoutbox > div {border-top-right-radius: 0;border-top-left-radius: 0;}
#shoutbox > div > ul {overflow: hidden;}
#shoutbox > div > ul > li {overflow: hidden;padding: 0;padding-left: 2px;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#shoutbox > div > ul > li:hover {background-color: #d8e7f5;}
#shoutbox .shoutboxOptions {position: absolute;bottom: 0;left: 0;}
#shoutbox .shoutboxEntry {position: relative;}
#shoutbox .shoutboxEntry > .userAvatar {float:right;margin: 4px;}
#shoutbox .shoutboxEntry time, #shoutbox .shoutboxEntry .shoutboxOptions {opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#shoutbox .shoutboxEntry:hover time, #shoutbox .shoutboxEntry:hover .shoutboxOptions {opacity: 1;}
#shoutbox #shoutboxMessage {padding: 10px;width: 100%;margin-top: 10px;}
#shoutbox .shoutboxContent {height: 200px;}
#shoutbox .shoutboxContent.fadeOut:after {height: 40px;width: 96%;position: absolute;content: "";right: 0;}
#shoutbox .shoutboxContent.asc:after {bottom: 57px;background: -moz-linear-gradient(top,rgba(240,244,250,0) 0%,#f0f4fa 100%);background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(240,244,250,0)),color-stop(100%,#f0f4fa));background: -webkit-linear-gradient(top,rgba(240,244,250,0) 0%,#f0f4fa 100%);background: -o-linear-gradient(top,rgba(240,244,250,0) 0%,#f0f4fa 100%);background: -ms-linear-gradient(top,rgba(240,244,250,0) 0%,#f0f4fa 100%);background: linear-gradient(to bottom,rgba(240,244,250,0) 0%,#f0f4fa 100%);}
#shoutbox .shoutboxContent.desc:after {top: 10px;background: -moz-linear-gradient(top,#f0f4fa 0%,rgba(240,244,250,0) 100%);background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#f0f4fa),color-stop(100%,rgba(240,244,250,0)));background: -webkit-linear-gradient(top,#f0f4fa 0%,rgba(240,244,250,0) 100%);background: -o-linear-gradient(top,#f0f4fa 0%,rgba(240,244,250,0) 100%);background: -ms-linear-gradient(top,#f0f4fa 0%,rgba(240,244,250,0) 100%);background: linear-gradient(to bottom,#f0f4fa 0%,rgba(240,244,250,0) 100%);}
#shoutbox.noForm .shoutboxContent.fadeOut:after {bottom: 0;}
#shoutbox.sidebar .shoutboxContent.fadeOut:after {width: 90%;}
#shoutbox.sidebar .shoutboxContent {height: 250px;}
#shoutbox.sidebar #submitLink span {display: none;}
#shoutbox.sidebar #submitLink:after {content: "\f0da";font-family: FontAwesome;}
#shoutbox #shoutboxEntryAddForm {position: relative;}
#shoutbox #shoutboxEntryAddForm .shoutboxExtend {position: absolute;top: 0;left: 3px;opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#shoutbox #shoutboxEntryAddForm .shoutboxExtend .shoutboxButton {margin: -3px;margin-top: 10px;border-radius: 0;height: 38px;line-height: 38px;padding: 0 13px;}
#shoutbox #shoutboxEntryAddForm:hover .shoutboxExtend {opacity: 1;}
.shoutboxBoxContent:hover header .shoutboxHeadlineOptions, .shoutboxBoard:hover header .shoutboxHeadlineOptions {opacity: 1;}
.shoutboxBoxContent header, .shoutboxBoard header {position: relative;}
.shoutboxBoxContent header .shoutboxHeadlineOptions, .shoutboxBoard header .shoutboxHeadlineOptions {position: absolute;top: 8px;left: 6px;opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.shoutboxBoxContent header .shoutboxHeadlineOptions a, .shoutboxBoard header .shoutboxHeadlineOptions a {display: inline-block;margin-right: 3px;}
@media only screen and (max-width: 800px) {
#shoutbox .shoutboxContent.desc:after, #shoutbox .shoutboxContent.asc:after {display: none;}
#shoutbox #shoutboxEntryAddForm .shoutboxExtend {opacity: 1;}
#submitLink span {display: none;}
#submitLink:after {content: "\f0da";font-family: FontAwesome;}
}
.userTrophies {margin: 7px 0 0;overflow: hidden;padding: 7px 0 0;}
.userTrophies .trophyList > li {display: inline;}
.userTrophies .trophyList > li:not(:last-child):after {content: "";}
.jsTrophyRow > .columnUserTrophyIcon {text-align: center;}
.trophy-badge {display: inline-block;}
.trophy-badge > .icon16, .trophy-badge .icon32, .trophy-badge .icon48, .trophy-badge .icon96 {padding: 2px;}
.trophy-badge > .icon16 {font-size: 16px;}
.trophy-badge > .icon32 {font-size: 32px;}
.trophy-badge > .icon48 {font-size: 48px;}
.trophy-badge > .icon96 {font-size: 96px;}
.trophy-badge-circle {border-radius: 50%;padding: 5px;}
.trophy-badge-square {padding: 4px;}
.extendedDropdownMenu {background-color: #e4eef8;max-height: 300px;overflow: auto;}
.extendedDropdownMenu::before {border-bottom-color: #e4eef8;}
.extendedDropdownMenu > li {text-align: center;font-size: 1.2rem;}
.extendedDropdownMenu > li > a {color: #336699;}
.extendedMainMenu .iconExtendedDropdownMenu {color: #488ed4 !important;}
.extendedMainMenu li.active .iconExtendedDropdownMenu, .extendedMainMenu li a:hover .iconExtendedDropdownMenu {color: #336699 !important;}
.extendedMainMenuIconList {cursor: move !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer {max-height: 400px;background-color: #ffffff;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li {background-color: #ffffff;-webkit-transition-property: background-color, background-position;transition-property: background-color, background-position;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li.loading, .interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li.noItems {font-size: 1.2rem;padding: 21px 14px;text-align: center;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li:not(.loading):not(.noItems) {overflow: hidden;padding: 4px 0;position: relative;text-shadow:-0 1px 0 rgba(255,255,255,0.8);}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li:not(.loading):not(.noItems):not(:last-child) {border-bottom: 0;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li:not(.loading):not(.noItems):hover {background-color: #d8e7f5;cursor: pointer;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li:not(.loading):not(.noItems).notificationItem .userLink {font-weight: bold;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32 {padding: 0 11px;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchSingleLine {min-height: 0;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchSingleLine div h3 {float:right;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;max-width: 280px;padding-left: 4px;word-wrap: normal;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchSingleLine div small {float:left;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchSingleLine > :first-child {float: none;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchPath {min-height: 36px;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchPath div small.path {clear: both;float: none;display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;max-width: 315px;padding-left: 4px;word-wrap: normal;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchIconPath div:nth-child(2) small {float:left;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32.extendedSearchIconPath div:nth-child(2) small.path {float: none;display: inline-block;max-width: 230px;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32 div small {color: #808080;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .box32 div h3 span.extendedSearchHighlightString {font-weight: bold;color: #336699;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .interactiveDropdownDividerTitle {padding: 4px 11px !important;font-weight: bold;border-bottom: 1px solid #cccccc !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li .interactiveDropdownDividerTitle:hover {cursor: auto !important;background-color: #ffffff !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems) {padding-bottom: 0 !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:hover {background-color: #ffffff !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.extendedNotificationItem {padding-top: 0 !important;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.extendedSearchLeft {float:right;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.extendedSearchRight {float:left;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.noFloat {float: none;}
@media only screen and (min-width: 801px) {
.interactiveDropdown[data-source="extendedSearch"] {min-width: 500px;}
.interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading) {max-width: 500px;}
}
#personalNoteLabelFilter {margin-bottom: 14px;}
.personalNoteLabelList {margin-bottom: 14px;}
.personalNoteLabelList li:not(:last-child) {margin-bottom: 4px;}
.personalNoteLabelList~small {display: block;}
#tplPersonalNote #personalNotes {display: none;}
#tplPersonalNote #personalNotesTabMenu {display: none;}
.personalNoteContent .sortableNode {cursor: pointer !important;}
.personalNoteContent .personalNoteCopyButton {cursor: pointer;float:left;}
.sidebar fieldset.personalnoteQuota > div {text-align: center;}
.personalnoteUsageBar {background-color: #666666;border-radius: 5px;height: 20px;padding: 4px;box-shadow: inset -0 1px 5px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .5);}
.personalnoteUsageBar > span {border-radius: 3px;color: transparent;display: block;height: 100%;box-shadow: inset -0 1px 0 rgba(255, 255, 255, .5);background-color: #a5df41;background-image: -webkit-linear-gradient(#a5df41,#4ca916);background-image: linear-gradient(#a5df41,#4ca916);}
.personalnoteUsageBar.yellow > span {background-color: #fecf23;background-image: -webkit-linear-gradient(#fecf23,#fd9215);background-image: linear-gradient(#fecf23,#fd9215);}
.personalnoteUsageBar.red > span {background-color: #f0a3a3;background-image: -webkit-linear-gradient(#f0a3a3,#f42323);background-image: linear-gradient(#f0a3a3,#f42323);}
.table tr.multiFound > td {background-color: #ffffc8 !important;}
@media only screen and (max-width: 800px) {
.navigation.navigationHeader > ul.navigationIcons, .navigation.navigationHeader > ul.navigationItems {display: inline-block;}
.message.messageSidebarOrientationLeft .newMessageBadge, .message.messageSidebarOrientationRight .newMessageBadge {border-radius: 11px;box-shadow: none;display: block;right: auto;left: 7px;padding: 3px 7px;text-transform: none;top: 14px;}
.message.messageSidebarOrientationLeft .newMessageBadge::before, .message.messageSidebarOrientationRight .newMessageBadge::before {content: none;}
.navigation.navigationFooter > ul.navigationItems {border-left-width: 0;display: inline-block;}
.navigation.navigationFooter > ul.navigationItems > li.styleChooser {display: list-item !important;}
.navigation.navigationFooter > ul.navigationItems > li:not(.styleChooser) {display: none;}
.wbbBoardList .wbbSubBoards {display: block !important;}
.message .messageBody .messageSignature {display: block;}
.codeBox > div > ol {list-style-type: decimal;margin-right: 3.4em;overflow: visible;}
.message .messageHeader .messageQuickOptions {display: block;}
#tplThread .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li, #tplConversationList .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li {margin-top: 0;}
#tplThread .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li .button.jsDropdownEnabled, #tplConversationList .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li .button.jsDropdownEnabled {display: block !important;}
#tplConversationList .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li {margin-right: 7px;}
.conversationList thead, .wbbThreadList thead {display: table-header-group;}
.conversationList thead .columnReplies, .conversationList thead .columnLastPost, .conversationList thead .columnLikes, .wbbThreadList thead .columnReplies, .wbbThreadList thead .columnLastPost, .wbbThreadList thead .columnLikes {display: none;}
.conversationList tbody .columnMark, .wbbThreadList tbody .columnMark {display: table-cell;}
.jsClipboardEditor > ul {margin-left: 0 !important;text-align:left;}
.jsClipboardEditor > ul > li {margin-top: 7px;}
.navigation.navigationFooter > ul.navigationItems {border-left-width: 0;display: inline-block;}
.navigation.navigationFooter > ul.navigationItems > li {display: none;}
.navigation.navigationFooter > ul.navigationItems > li[title] {display: list-item !important;}
.wbbBoardList .wbbBoardDescription {display: block !important;}
.wbbBoardList .wbbUsersOnline {display: block !important;}
.wbbBoardList .wbbStats {display: block !important;position: static;width: auto;}
.wbbBoardList .wbbStats > .statsDataList {display: inline-block;}
.wbbBoardList .wbbStats > .statsDataList > dt, .wbbBoardList .wbbStats > .statsDataList > dd {display: inline-block;float: none;width: auto;}
.wbbBoardList .wbbStats > .statsDataList > dt::after {content: ":";}
.wbbBoardList .wbbStats > .statsDataList:not(:last-child) > dd::after {content: ",";}
.content > .breadcrumbs > ul > li {float:right;}
.content > .breadcrumbs > ul > li:first-child {display: list-item;}
.content > .breadcrumbs > ul > li:first-child > a > span {display: none;}
.content > .breadcrumbs > ul > li:first-child > a::before {content: "\f015";margin: 0;padding: 0;}
.content > .breadcrumbs > ul > li:first-child:not(:last-child) > a {border-left: 1px solid #cccccc;}
.navigation.navigationFooter > ul.navigationIcons {display: inline-block;}
.navigation.navigationFooter > ul.navigationItems {border-left-width: 1px;}
.wbbThreadList tbody .columnSubject .statusDisplay {display: block;}
.pageNavigation > ul > li:not(.skip):not(.active) {display: block;}
.pageNavigation > ul > li.active > span.invisible {display: none;}
.pageNavigation > ul > li.active > span:not(.invisible) {display: inline-block;}
.conversationList thead .columnLikes, .conversationList tbody .columnLikes, .wbbThreadList thead .columnLikes, .wbbThreadList tbody .columnLikes {display: table-cell;}
}
@media only screen and (max-width: 800px) and (max-width: 400px) {
#tplConversationList .contentNavigation > nav:not(.pageNavigation) > ul:not(.buttonGroup) > li.dropdown {margin-top: 7px;}
}
.tweetList .tweet:hover .timelineOptions li {opacity: 1;}
.tweetList .tweet:hover .timelineOptions li > a > span.icon {color: #666666;}
.timelineOptions li > a > span.icon:hover {color: #336699 !important;}
.tweetList .tweetOptions > ul > li {float:right;opacity: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.tweetOptions {display: inline-block;}
.tweetOptions > ul > li {float:right;opacity: 0;transition-property: opacity;transition-duration: 0.1s;transition-timing-function: linear;min-width: 20px;}
li.socialnetworks {margin-right: -5px;}
.socialnetworks {float:right;}
.socialnetworks .icon {font-size: 40px;}
.socialnetworks a {display: inline-block;margin-right: 5px;margin-bottom: 5px;}
.wbbBoardList li[data-board-id="4"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="4"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="4"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="4"] > .icon.icon-folder-close-alt::before {content: "\f186";}
.wbbBoardList li[data-board-id="4"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="4"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="4"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="4"] > .icon.icon-folder-close::before {content: "\f186";}
.wbbBoardList li[data-board-id="5"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="5"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="5"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="5"] > .icon.icon-folder-close-alt::before {content: "\f0e9";}
.wbbBoardList li[data-board-id="5"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="5"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="5"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="5"] > .icon.icon-folder-close::before {content: "\f0e9";}
.wbbBoardList li[data-board-id="7"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="7"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="7"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="7"] > .icon.icon-folder-close-alt::before {content: "\f10b";}
.wbbBoardList li[data-board-id="7"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="7"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="7"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="7"] > .icon.icon-folder-close::before {content: "\f10b";}
.wbbBoardList li[data-board-id="9"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="9"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="9"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="9"] > .icon.icon-folder-close-alt::before {content: "\f109";}
.wbbBoardList li[data-board-id="9"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="9"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="9"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="9"] > .icon.icon-folder-close::before {content: "\f109";}
.wbbBoardList li[data-board-id="10"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="10"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="10"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="10"] > .icon.icon-folder-close-alt::before {content: "\f044";}
.wbbBoardList li[data-board-id="10"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="10"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="10"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="10"] > .icon.icon-folder-close::before {content: "\f044";}
.wbbBoardList li[data-board-id="12"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="12"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="12"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="12"] > .icon.icon-folder-close-alt::before {content: "\f12e";}
.wbbBoardList li[data-board-id="12"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="12"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="12"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="12"] > .icon.icon-folder-close::before {content: "\f12e";}
.wbbBoardList li[data-board-id="13"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="13"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="13"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="13"] > .icon.icon-folder-close-alt::before {content: "\f0f0";}
.wbbBoardList li[data-board-id="13"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="13"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="13"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="13"] > .icon.icon-folder-close::before {content: "\f0f0";}
.wbbBoardList li[data-board-id="15"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="15"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="15"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="15"] > .icon.icon-folder-close-alt::before {content: "\f0a1";}
.wbbBoardList li[data-board-id="15"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="15"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="15"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="15"] > .icon.icon-folder-close::before {content: "\f0a1";}
.wbbBoardList li[data-board-id="30"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="30"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="30"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="30"] > .icon.icon-folder-close-alt::before {content: "\f0c3";}
.wbbBoardList li[data-board-id="30"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="30"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="30"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="30"] > .icon.icon-folder-close::before {content: "\f0c3";}
.wbbBoardList li[data-board-id="37"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="37"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="37"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="37"] > .icon.icon-folder-close-alt::before {content: "\f12a";}
.wbbBoardList li[data-board-id="37"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="37"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="37"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="37"] > .icon.icon-folder-close::before {content: "\f12a";}
.wbbBoardList li[data-board-id="46"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="46"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="46"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="46"] > .icon.icon-folder-close-alt::before {content: "\f11b";}
.wbbBoardList li[data-board-id="46"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="46"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="46"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="46"] > .icon.icon-folder-close::before {content: "\f11b";}
.wbbBoardList li[data-board-id="52"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="52"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="52"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="52"] > .icon.icon-folder-close-alt::before {content: "\f0f4";}
.wbbBoardList li[data-board-id="52"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="52"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="52"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="52"] > .icon.icon-folder-close::before {content: "\f0f4";}
.wbbBoardList li[data-board-id="62"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="62"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="62"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="62"] > .icon.icon-folder-close-alt::before {content: "\f085";}
.wbbBoardList li[data-board-id="62"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="62"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="62"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="62"] > .icon.icon-folder-close::before {content: "\f085";}
.wbbBoardList li[data-board-id="67"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="67"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="67"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="67"] > .icon.icon-folder-close-alt::before {content: "\f0e6";}
.wbbBoardList li[data-board-id="67"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="67"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="67"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="67"] > .icon.icon-folder-close::before {content: "\f0e6";}
.wbbBoardList li[data-board-id="73"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="73"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="73"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="73"] > .icon.icon-folder-close-alt::before {content: "\f05a";}
.wbbBoardList li[data-board-id="73"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="73"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="73"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="73"] > .icon.icon-folder-close::before {content: "\f05a";}
.wbbBoardList li[data-board-id="83"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="83"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="83"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="83"] > .icon.icon-folder-close-alt::before {content: "\f083";}
.wbbBoardList li[data-board-id="83"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="83"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="83"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="83"] > .icon.icon-folder-close::before {content: "\f083";}
.wbbBoardList li[data-board-id="89"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="89"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="89"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="89"] > .icon.icon-folder-close-alt::before {content: "\f123";}
.wbbBoardList li[data-board-id="89"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="89"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="89"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="89"] > .icon.icon-folder-close::before {content: "\f123";}
.wbbBoardList li[data-board-id="92"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="92"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="92"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="92"] > .icon.icon-folder-close-alt::before {content: "\f044";}
.wbbBoardList li[data-board-id="92"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="92"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="92"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="92"] > .icon.icon-folder-close::before {content: "\f044";}
.wbbBoardList li[data-board-id="96"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="96"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="96"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="96"] > .icon.icon-folder-close-alt::before {content: "\f17d";}
.wbbBoardList li[data-board-id="96"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="96"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="96"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="96"] > .icon.icon-folder-close::before {content: "\f17d";}
.wbbBoardList li[data-board-id="99"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="99"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="99"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="99"] > .icon.icon-folder-close-alt::before {content: "\f072";}
.wbbBoardList li[data-board-id="99"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="99"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="99"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="99"] > .icon.icon-folder-close::before {content: "\f072";}
.wbbBoardList li[data-board-id="107"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="107"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="107"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="107"] > .icon.icon-folder-close-alt::before {content: "\f004";}
.wbbBoardList li[data-board-id="107"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="107"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="107"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="107"] > .icon.icon-folder-close::before {content: "\f004";}
.wbbBoardList li[data-board-id="111"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="111"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="111"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="111"] > .icon.icon-folder-close-alt::before {content: "\f0f5";}
.wbbBoardList li[data-board-id="111"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="111"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="111"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="111"] > .icon.icon-folder-close::before {content: "\f0f5";}
.wbbBoardList li[data-board-id="125"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="125"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="125"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="125"] > .icon.icon-folder-close-alt::before {content: "\f108";}
.wbbBoardList li[data-board-id="125"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="125"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="125"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="125"] > .icon.icon-folder-close::before {content: "\f108";}
.wbbBoardList li[data-board-id="137"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="137"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="137"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="137"] > .icon.icon-folder-close-alt::before {content: "\f0e3";}
.wbbBoardList li[data-board-id="137"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="137"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="137"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="137"] > .icon.icon-folder-close::before {content: "\f0e3";}
.wbbBoardList li[data-board-id="146"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="146"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="146"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="146"] > .icon.icon-folder-close-alt::before {content: "\f008";}
.wbbBoardList li[data-board-id="146"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="146"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="146"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="146"] > .icon.icon-folder-close::before {content: "\f008";}
.wbbBoardList li[data-board-id="153"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="153"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="153"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="153"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="153"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="153"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="153"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="153"] > .icon.icon-folder-close::before {content: "\f07a";}
.wbbBoardList li[data-board-id="162"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="162"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="162"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="162"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="162"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="162"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="162"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="162"] > .icon.icon-folder-close::before {content: "\f07a";}
.wbbBoardList li[data-board-id="167"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="167"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="167"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="167"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="167"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="167"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="167"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="167"] > .icon.icon-folder-close::before {content: "\f07a";}
.wbbBoardList li[data-board-id="175"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="175"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="175"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="175"] > .icon.icon-folder-close-alt::before {content: "\f187";}
.wbbBoardList li[data-board-id="175"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="175"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="175"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="175"] > .icon.icon-folder-close::before {content: "\f187";}
.wbbBoardList li[data-board-id="178"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="178"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="178"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="178"] > .icon.icon-folder-close-alt::before {content: "\f14b";}
.wbbBoardList li[data-board-id="178"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="178"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="178"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="178"] > .icon.icon-folder-close::before {content: "\f14b";}
.wbbBoardList li[data-board-id="179"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="179"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="179"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="179"] > .icon.icon-folder-close-alt::before {content: "\f0b1";}
.wbbBoardList li[data-board-id="179"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="179"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="179"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="179"] > .icon.icon-folder-close::before {content: "\f0b1";}
.wbbBoardList li[data-board-id="181"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="181"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="181"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="181"] > .icon.icon-folder-close-alt::before {content: "\f013";}
.wbbBoardList li[data-board-id="181"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="181"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="181"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="181"] > .icon.icon-folder-close::before {content: "\f013";}
.wbbBoardList li[data-board-id="185"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="185"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="185"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="185"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="185"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="185"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="185"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="185"] > .icon.icon-folder-close::before {content: "\f07a";}
.wbbBoardList li[data-board-id="202"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="202"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="202"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="202"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="202"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="202"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="202"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="202"] > .icon.icon-folder-close::before {content: "\f07a";}
.wbbBoardList li[data-board-id="204"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="204"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="204"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="204"] > .icon.icon-folder-close-alt::before {content: "\f024";}
.wbbBoardList li[data-board-id="204"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="204"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="204"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="204"] > .icon.icon-folder-close::before {content: "\f024";}
.wbbBoardList li[data-board-id="231"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="231"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="231"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="231"] > .icon.icon-folder-close-alt::before {content: "\f0eb";}
.wbbBoardList li[data-board-id="231"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="231"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="231"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="231"] > .icon.icon-folder-close::before {content: "\f0eb";}
.wbbBoardList li[data-board-id="233"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="233"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="233"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="233"] > .icon.icon-folder-close-alt::before {content: "\f187";}
.wbbBoardList li[data-board-id="233"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="233"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="233"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="233"] > .icon.icon-folder-close::before {content: "\f187";}
.wbbBoardList li[data-board-id="235"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="235"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="235"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="235"] > .icon.icon-folder-close-alt::before {content: "\f080";}
.wbbBoardList li[data-board-id="235"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="235"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="235"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="235"] > .icon.icon-folder-close::before {content: "\f080";}
.wbbBoardList li[data-board-id="241"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="241"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="241"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="241"] > .icon.icon-folder-close-alt::before {content: "\f187";}
.wbbBoardList li[data-board-id="241"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="241"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="241"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="241"] > .icon.icon-folder-close::before {content: "\f187";}
.wbbBoardList li[data-board-id="246"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="246"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="246"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="246"] > .icon.icon-folder-close-alt::before {content: "\f187";}
.wbbBoardList li[data-board-id="246"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="246"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="246"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="246"] > .icon.icon-folder-close::before {content: "\f187";}
.wbbBoardList li[data-board-id="247"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="247"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="247"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="247"] > .icon.icon-folder-close-alt::before {content: "\f187";}
.wbbBoardList li[data-board-id="247"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="247"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="247"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="247"] > .icon.icon-folder-close::before {content: "\f187";}
.wbbBoardList li[data-board-id="269"] > .wbbBoard > .icon.icon-folder-close-alt, .wbbSubBoards li[data-board-id="269"] > .icon.icon-folder-close-alt {background-image: none;}
.wbbBoardList li[data-board-id="269"] > .wbbBoard > .icon.icon-folder-close-alt::before, .wbbSubBoards li[data-board-id="269"] > .icon.icon-folder-close-alt::before {content: "\f07a";}
.wbbBoardList li[data-board-id="269"] > .wbbBoard > .icon.icon-folder-close, .wbbSubBoards li[data-board-id="269"] > .icon.icon-folder-close {background-image: none;}
.wbbBoardList li[data-board-id="269"] > .wbbBoard > .icon.icon-folder-close::before, .wbbSubBoards li[data-board-id="269"] > .icon.icon-folder-close::before {content: "\f07a";}
.mejs-offscreen {clip: rect(1px 1px 1px 1px);clip: rect(1px,1px,1px,1px);clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);position: absolute !important;height: 1px;width: 1px;overflow: hidden;}
.mejs-container {position: relative;background: #000;font-family: "Helvetica", Arial, serif;text-align:right;vertical-align: top;text-indent: 0;}
.mejs-fill-container, .mejs-fill-container .mejs-container {width: 100%;height: 100%;}
.mejs-fill-container {overflow: hidden;}
.mejs-container:focus {outline: none;}
.me-plugin {position: absolute;}
.mejs-embed, .mejs-embed body {width: 100%;height: 100%;margin: 0;padding: 0;background: #000;overflow: hidden;}
.mejs-fullscreen {overflow: hidden !important;}
.mejs-container-fullscreen {position: fixed;right: 0;top: 0;left: 0;bottom: 0;overflow: hidden;z-index: 1000;}
.mejs-container-fullscreen .mejs-mediaelement, .mejs-container-fullscreen video {width: 100%;height: 100%;}
.mejs-clear {clear: both;}
.mejs-background {position: absolute;top: 0;right: 0;}
.mejs-mediaelement {position: absolute;top: 0;right: 0;width: 100%;height: 100%;}
.mejs-poster {position: absolute;top: 0;right: 0;background-size: contain;background-position:50% 50%;background-repeat: no-repeat;}
:root .mejs-poster img {display: none;}
.mejs-poster img {border: 0;padding: 0;}
.mejs-overlay {position: absolute;top: 0;right: 0;}
.mejs-overlay-play {cursor: pointer;}
.mejs-overlay-button {position: absolute;top: 50%;right: 50%;width: 100px;height: 100px;margin:-50px -50px 0 0;background: url("../images/mejs/bigplay.svg") no-repeat;}
.no-svg .mejs-overlay-button {background-image: url("../images/mejs/bigplay.png");}
.mejs-overlay:hover .mejs-overlay-button {background-position: 0 -100px;}
.mejs-overlay-loading {position: absolute;top: 50%;right: 50%;width: 80px;height: 80px;margin:-40px -40px 0 0;background: #333;background: url("../images/mejs/background.png");background: rgba(0,0,0,0.9);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(50,50,50,0.9)),to(rgba(0,0,0,0.9)));background: -webkit-linear-gradient(top,rgba(50,50,50,0.9),rgba(0,0,0,0.9));background: -moz-linear-gradient(top,rgba(50,50,50,0.9),rgba(0,0,0,0.9));background: -o-linear-gradient(top,rgba(50,50,50,0.9),rgba(0,0,0,0.9));background: -ms-linear-gradient(top,rgba(50,50,50,0.9),rgba(0,0,0,0.9));background: linear-gradient(rgba(50,50,50,0.9),rgba(0,0,0,0.9));}
.mejs-overlay-loading span {display: block;width: 80px;height: 80px;background: transparent url("../images/mejs/loading.gif") 50% 50% no-repeat;}
.mejs-container .mejs-controls {position: absolute;list-style-type: none;margin: 0;padding: 0;bottom: 0;right: 0;background: url("../images/mejs/background.png");background: rgba(0,0,0,0.7);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(50,50,50,0.7)),to(rgba(0,0,0,0.7)));background: -webkit-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -moz-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -o-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -ms-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: linear-gradient(rgba(50,50,50,0.7),rgba(0,0,0,0.7));height: 30px;width: 100%;}
.mejs-container .mejs-controls  div {list-style-type: none;background-image: none;display: block;float:right;margin: 0;padding: 0;width: 26px;height: 26px;font-size: 11px;line-height: 11px;font-family: "Helvetica", Arial, serif;border: 0;}
.mejs-controls .mejs-button button {cursor: pointer;display: block;font-size: 0;line-height: 0;text-decoration: none;margin: 7px 5px;padding: 0;position: absolute;height: 16px;width: 16px;border: 0;background: transparent url("../images/mejs/controls.svg") no-repeat;}
.no-svg .mejs-controls .mejs-button button {background-image: url("../images/mejs/controls.png");}
.mejs-controls .mejs-button button:focus {outline: dotted 1px #999;}
.mejs-container .mejs-controls .mejs-time {color: #fff;display: block;height: 17px;width: auto;padding:10px 3px 0 3px;overflow: hidden;text-align: center;-moz-box-sizing: content-box;-webkit-box-sizing: content-box;box-sizing: content-box;}
.mejs-container .mejs-controls .mejs-time a {color: #fff;font-size: 11px;line-height: 12px;display: block;float:right;margin:1px 0 0 2px;width: auto;}
.mejs-controls .mejs-play button {background-position: 0 0;}
.mejs-controls .mejs-pause button {background-position: 0 -16px;}
.mejs-controls .mejs-stop button {background-position: -112px 0;}
.mejs-controls div.mejs-time-rail {direction: ltr;width: 200px;padding-top: 5px;}
.mejs-controls .mejs-time-rail span, .mejs-controls .mejs-time-rail a {display: block;position: absolute;width: 180px;height: 10px;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;cursor: pointer;}
.mejs-controls .mejs-time-rail .mejs-time-total {margin: 5px;background: #333;background: rgba(50,50,50,0.8);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(30,30,30,0.8)),to(rgba(60,60,60,0.8)));background: -webkit-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -moz-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -o-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -ms-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: linear-gradient(rgba(30,30,30,0.8),rgba(60,60,60,0.8));}
.mejs-controls .mejs-time-rail .mejs-time-buffering {width: 100%;background-image: -o-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image: -webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image: -webkit-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image: -moz-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image: -ms-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image: linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);-webkit-background-size: 15px 15px;-moz-background-size: 15px 15px;-o-background-size: 15px 15px;background-size: 15px 15px;-webkit-animation: buffering-stripes 2s linear infinite;-moz-animation: buffering-stripes 2s linear infinite;-ms-animation: buffering-stripes 2s linear infinite;-o-animation: buffering-stripes 2s linear infinite;animation: buffering-stripes 2s linear infinite;}
@-webkit-keyframes buffering-stripes {from {background-position: 0 0;}
to {background-position: 30px 0;}
}
@-moz-keyframes buffering-stripes {from {background-position: 0 0;}
to {background-position: 30px 0;}
}
@-ms-keyframes buffering-stripes {from {background-position: 0 0;}
to {background-position: 30px 0;}
}
@-o-keyframes buffering-stripes {from {background-position: 0 0;}
to {background-position: 30px 0;}
}
@keyframes buffering-stripes {from {background-position: 0 0;}
to {background-position: 30px 0;}
}
.mejs-controls .mejs-time-rail .mejs-time-loaded {background: #3caac8;background: rgba(60,170,200,0.8);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(44,124,145,0.8)),to(rgba(78,183,212,0.8)));background: -webkit-linear-gradient(top,rgba(44,124,145,0.8),rgba(78,183,212,0.8));background: -moz-linear-gradient(top,rgba(44,124,145,0.8),rgba(78,183,212,0.8));background: -o-linear-gradient(top,rgba(44,124,145,0.8),rgba(78,183,212,0.8));background: -ms-linear-gradient(top,rgba(44,124,145,0.8),rgba(78,183,212,0.8));background: linear-gradient(rgba(44,124,145,0.8),rgba(78,183,212,0.8));width: 0;}
.mejs-controls .mejs-time-rail .mejs-time-current {background: #fff;background: rgba(255,255,255,0.8);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(255,255,255,0.9)),to(rgba(200,200,200,0.8)));background: -webkit-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -moz-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -o-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -ms-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: linear-gradient(rgba(255,255,255,0.9),rgba(200,200,200,0.8));width: 0;}
.mejs-controls .mejs-time-rail .mejs-time-handle {display: none;position: absolute;margin: 0;width: 10px;background: #fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;cursor: pointer;border: solid 2px #333;top: -2px;text-align: center;}
.mejs-controls .mejs-time-rail .mejs-time-float {position: absolute;display: none;background: #eee;width: 36px;height: 17px;border: solid 1px #333;top: -26px;margin-right: -18px;text-align: center;color: #111;}
.mejs-controls .mejs-time-rail .mejs-time-float-current {margin: 2px;width: 30px;display: block;text-align: center;right: 0;}
.mejs-controls .mejs-time-rail .mejs-time-float-corner {position: absolute;display: block;width: 0;height: 0;line-height: 0;border: solid 5px #eee;border-color:#eee transparent transparent transparent;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;top: 15px;right: 13px;}
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float {width: 48px;}
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-current {width: 44px;}
.mejs-long-video .mejs-controls .mejs-time-rail .mejs-time-float-corner {right: 18px;}
.mejs-controls .mejs-fullscreen-button button {background-position: -32px 0;}
.mejs-controls .mejs-unfullscreen button {background-position: -32px -16px;}
.mejs-controls .mejs-mute button {background-position: -16px -16px;}
.mejs-controls .mejs-unmute button {background-position: -16px 0;}
.mejs-controls .mejs-volume-button {position: relative;}
.mejs-controls .mejs-volume-button .mejs-volume-slider {display: none;height: 115px;width: 25px;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;top: -115px;right: 0;z-index: 1;position: absolute;margin: 0;}
.mejs-controls .mejs-volume-button:hover {-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total {position: absolute;right: 11px;top: 8px;width: 2px;height: 100px;background: #ddd;background: rgba(255,255,255,0.5);margin: 0;}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-current {position: absolute;right: 11px;top: 8px;width: 2px;height: 100px;background: #ddd;background: rgba(255,255,255,0.9);margin: 0;}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-handle {position: absolute;right: 4px;top: -3px;width: 16px;height: 6px;background: #ddd;background: rgba(255,255,255,0.9);cursor: N-resize;-webkit-border-radius: 1px;-moz-border-radius: 1px;border-radius: 1px;margin: 0;}
.mejs-controls a.mejs-horizontal-volume-slider {height: 26px;width: 56px;position: relative;display: block;float:right;vertical-align: middle;}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {position: absolute;right: 0;top: 11px;width: 50px;height: 8px;margin: 0;padding: 0;font-size: 1px;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;background: #333;background: rgba(50,50,50,0.8);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(30,30,30,0.8)),to(rgba(60,60,60,0.8)));background: -webkit-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -moz-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -o-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: -ms-linear-gradient(top,rgba(30,30,30,0.8),rgba(60,60,60,0.8));background: linear-gradient(rgba(30,30,30,0.8),rgba(60,60,60,0.8));}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {position: absolute;right: 0;top: 11px;width: 50px;height: 8px;margin: 0;padding: 0;font-size: 1px;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;background: #fff;background: rgba(255,255,255,0.8);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(255,255,255,0.9)),to(rgba(200,200,200,0.8)));background: -webkit-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -moz-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -o-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: -ms-linear-gradient(top,rgba(255,255,255,0.9),rgba(200,200,200,0.8));background: linear-gradient(rgba(255,255,255,0.9),rgba(200,200,200,0.8));}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {display: none;}
.mejs-controls .mejs-captions-button {position: relative;}
.mejs-controls .mejs-captions-button button {background-position: -48px 0;}
.mejs-controls .mejs-captions-button .mejs-captions-selector {visibility: hidden;position: absolute;bottom: 26px;left: -51px;width: 85px;height: 100px;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);border: solid 1px transparent;padding:10px 10px 0 10px;overflow: hidden;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.mejs-controls .mejs-captions-button:hover  .mejs-captions-selector {visibility: visible;}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul {margin: 0;padding: 0;display: block;list-style-type: none !important;overflow: hidden;}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li {margin:0 0 6px 0;padding: 0;list-style-type: none !important;display: block;color: #fff;overflow: hidden;}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li input {clear: both;float:right;margin:3px 5px 0 3px;}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li label {width: 55px;float:right;padding:4px 0 0 0;line-height: 15px;font-family: "Helvetica", Arial, serif;font-size: 10px;}
.mejs-controls .mejs-captions-button .mejs-captions-translations {font-size: 10px;margin:0 0 5px 0;}
.mejs-chapters {position: absolute;top: 0;right: 0;border-left: solid 1px #fff;width: 10000px;z-index: 1;}
.mejs-chapters .mejs-chapter {position: absolute;float:right;background: #222;background: rgba(0,0,0,0.7);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(50,50,50,0.7)),to(rgba(0,0,0,0.7)));background: -webkit-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -moz-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -o-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: -ms-linear-gradient(top,rgba(50,50,50,0.7),rgba(0,0,0,0.7));background: linear-gradient(rgba(50,50,50,0.7),rgba(0,0,0,0.7));filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,startColorstr=#323232,endColorstr=#000000);overflow: hidden;border: 0;}
.mejs-chapters .mejs-chapter .mejs-chapter-block {font-size: 11px;color: #fff;padding: 5px;display: block;border-left: solid 1px #333;border-bottom: solid 1px #333;cursor: pointer;}
.mejs-chapters .mejs-chapter .mejs-chapter-block-last {border-left: none;}
.mejs-chapters .mejs-chapter .mejs-chapter-block:hover {background: #666;background: rgba(102,102,102,0.7);background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgba(102,102,102,0.7)),to(rgba(50,50,50,0.6)));background: -webkit-linear-gradient(top,rgba(102,102,102,0.7),rgba(50,50,50,0.6));background: -moz-linear-gradient(top,rgba(102,102,102,0.7),rgba(50,50,50,0.6));background: -o-linear-gradient(top,rgba(102,102,102,0.7),rgba(50,50,50,0.6));background: -ms-linear-gradient(top,rgba(102,102,102,0.7),rgba(50,50,50,0.6));background: linear-gradient(rgba(102,102,102,0.7),rgba(50,50,50,0.6));filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,startColorstr=#666666,endColorstr=#323232);}
.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-title {font-size: 12px;font-weight: bold;display: block;white-space: nowrap;text-overflow: ellipsis;margin:0 0 3px 0;line-height: 12px;}
.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-timespan {font-size: 12px;line-height: 12px;margin:3px 0 4px 0;display: block;white-space: nowrap;text-overflow: ellipsis;}
.mejs-captions-layer {position: absolute;bottom: 0;right: 0;text-align: center;line-height: 20px;font-size: 16px;color: #fff;}
.mejs-captions-layer  a {color: #fff;text-decoration: underline;}
.mejs-captions-layer[lang=ar] {font-size: 20px;font-weight: normal;}
.mejs-captions-position {position: absolute;width: 100%;bottom: 15px;right: 0;}
.mejs-captions-position-hover {bottom: 35px;}
.mejs-captions-text {padding: 0;background: url("../images/mejs/background.png");background: rgba(20,20,20,0.5);white-space: pre-wrap;-webkit-box-shadow:  -5px 0 0 rgba(20,20,20,0.5), -5px 0 0 rgba(20,20,20,0.5);box-shadow:  -5px 0 0 rgba(20,20,20,0.5), -5px 0 0 rgba(20,20,20,0.5);}
.me-cannotplay a {color: #fff;font-weight: bold;}
.me-cannotplay span {padding: 15px;display: block;}
.mejs-controls .mejs-loop-off button {background-position: -64px -16px;}
.mejs-controls .mejs-loop-on button {background-position: -64px 0;}
.mejs-controls .mejs-backlight-off button {background-position: -80px -16px;}
.mejs-controls .mejs-backlight-on button {background-position: -80px 0;}
.mejs-controls .mejs-picturecontrols-button {background-position: -96px 0;}
.mejs-contextmenu {position: absolute;width: 150px;padding: 10px;border-radius: 4px;top: 0;right: 0;background: #fff;border: solid 1px #999;z-index: 1001;}
.mejs-contextmenu .mejs-contextmenu-separator {height: 1px;font-size: 0;margin: 5px 6px;background: #333;}
.mejs-contextmenu .mejs-contextmenu-item {font-family: "Helvetica", Arial, serif;font-size: 12px;padding: 4px 6px;cursor: pointer;color: #333;}
.mejs-contextmenu .mejs-contextmenu-item:hover {background: #2C7C91;color: #fff;}
.mejs-controls .mejs-sourcechooser-button {position: relative;}
.mejs-controls .mejs-sourcechooser-button button {background-position: -128px 0;}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector {position: absolute;bottom: 26px;left: -10px;width: 130px;height: 100px;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);border: solid 1px transparent;padding: 10px;overflow: hidden;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul {margin: 0;padding: 0;display: block;list-style-type: none !important;overflow: hidden;}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li {margin:0 0 6px 0;padding: 0;list-style-type: none !important;display: block;color: #fff;overflow: hidden;}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li input {clear: both;float:right;margin:3px 5px 0 3px;}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li label {width: 100px;float:right;padding:4px 0 0 0;line-height: 15px;font-family: "Helvetica", Arial, serif;font-size: 10px;}
.mejs-postroll-layer {position: absolute;bottom: 0;right: 0;width: 100%;height: 100%;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);z-index: 1000;overflow: hidden;}
.mejs-postroll-layer-content {width: 100%;height: 100%;}
.mejs-postroll-close {position: absolute;left: 0;top: 0;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);color: #fff;padding: 4px;z-index: 100;cursor: pointer;}
div.mejs-speed-button {width: 46px !important;position: relative;}
.mejs-controls .mejs-button.mejs-speed-button button {background: transparent;width: 36px;font-size: 11px;line-height: normal;color: #ffffff;}
.mejs-controls .mejs-speed-button .mejs-speed-selector {display: none;position: absolute;top: -100px;right: -10px;width: 60px;height: 100px;background: url("../images/mejs/background.png");background: rgba(50,50,50,0.7);border: solid 1px transparent;padding: 0;overflow: hidden;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
.mejs-controls .mejs-speed-button:hover > .mejs-speed-selector {display: block;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul li label.mejs-speed-selected {color: #21f8f8;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul {margin: 0;padding: 0;display: block;list-style-type: none !important;overflow: hidden;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul li {margin:0 0 6px 0;padding: 0 10px;list-style-type: none !important;display: block;color: #fff;overflow: hidden;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul li input {clear: both;float:right;margin:3px 5px 0 3px;display: none;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul li label {width: 60px;float:right;padding:4px 0 0 0;line-height: 15px;font-family: "Helvetica", Arial, serif;font-size: 11px;color: white;margin-right: 5px;cursor: pointer;}
.mejs-controls .mejs-speed-button .mejs-speed-selector ul li:hover {background-color: #c8c8c8 !important;background-color: rgba(255,255,255,0.4) !important;}
.mejs-controls .mejs-button.mejs-jump-forward-button {background: transparent url("../images/mejs/jumpforward.png") no-repeat 3px 3px;}
.mejs-controls .mejs-button.mejs-jump-forward-button button {background: transparent;font-size: 9px;line-height: normal;color: #ffffff;}
.mejs-controls .mejs-button.mejs-skip-back-button {background: transparent url("../images/mejs/skipback.png") no-repeat 3px 3px;}
.mejs-controls .mejs-button.mejs-skip-back-button button {background: transparent;font-size: 9px;line-height: normal;color: #ffffff;}
.mejs-ted .mejs-controls {background: #eee;height: 65px;}
.mejs-ted .mejs-button, .mejs-ted .mejs-time {position: absolute;background: #ddd;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-total {background-color: none;background: url(../images/mejs/controls-ted.png) repeat-x 0 -52px;height: 6px;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-buffering {height: 6px;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-loaded {background-color: none;background: url(../images/mejs/controls-ted.png) repeat-x 0 -52px;width: 0;height: 6px;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-current {width: 0;height: 6px;background-color: none;background: url(../images/mejs/controls-ted.png) repeat-x 0 -59px;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-handle {display: block;margin: 0;width: 14px;height: 21px;top: -7px;border: 0;background: url(../images/mejs/controls-ted.png) no-repeat 0 0;}
.mejs-ted .mejs-controls .mejs-time-rail .mejs-time-float {display: none;}
.mejs-ted .mejs-controls .mejs-playpause-button {top: 29px;right: 9px;width: 49px;height: 28px;}
.mejs-ted .mejs-controls .mejs-playpause-button  button {width: 49px;height: 28px;background: url(../images/mejs/controls-ted.png) no-repeat -50px -23px;margin: 0;padding: 0;}
.mejs-ted .mejs-controls .mejs-pause button {background-position: 0 -23px;}
.mejs-ted .mejs-controls .mejs-fullscreen-button {top: 34px;left: 9px;width: 17px;height: 15px;background: none;}
.mejs-ted .mejs-controls .mejs-fullscreen-button  button {width: 19px;height: 17px;background: transparent url(../images/mejs/controls-ted.png) no-repeat 0 -66px;margin: 0;padding: 0;}
.mejs-ted .mejs-controls .mejs-unfullscreen  button {background: transparent url(../images/mejs/controls-ted.png) no-repeat -21px -66px;margin: 0;padding: 0;}
.mejs-ted .mejs-controls .mejs-volume-button {top: 30px;left: 35px;width: 24px;height: 22px;}
.mejs-ted .mejs-controls .mejs-mute button {background: url(../images/mejs/controls-ted.png) no-repeat -15px 0;width: 24px;height: 22px;margin: 0;padding: 0;}
.mejs-ted .mejs-controls .mejs-unmute button {background: url(../images/mejs/controls-ted.png) no-repeat -40px 0;width: 24px;height: 22px;margin: 0;padding: 0;}
.mejs-ted  .mejs-controls .mejs-volume-button .mejs-volume-slider {background: #fff;border: solid 1px #aaa;border-width:1px 1px 0 1px;width: 22px;height: 65px;top: -65px;}
.mejs-ted  .mejs-controls .mejs-volume-button .mejs-volume-total {background: url(../images/mejs/controls-ted.png) repeat-y -41px -66px;right: 8px;width: 6px;height: 50px;}
.mejs-ted  .mejs-controls .mejs-volume-button .mejs-volume-current {right: 8px;width: 6px;background: url(../images/mejs/controls-ted.png) repeat-y -48px -66px;height: 50px;}
.mejs-ted  .mejs-controls .mejs-volume-button .mejs-volume-handle {display: none;}
.mejs-ted .mejs-controls .mejs-time span {color: #333;}
.mejs-ted .mejs-controls .mejs-currenttime-container {position: absolute;top: 32px;left: 100px;border: solid 1px #999;background: #fff;color: #333;padding-top: 2px;border-radius: 3px;}
.mejs-ted .mejs-controls .mejs-duration-container {position: absolute;top: 32px;left: 65px;border: solid 1px #999;background: #fff;color: #333;padding-top: 2px;border-radius: 3px;}
.mejs-ted .mejs-controls .mejs-time  button {color: #333;}
.mejs-ted .mejs-controls .mejs-captions-button {display: none;}
.mejs-wmp .mejs-controls {background: transparent url(../images/mejs/controls-wmp-bg.png) center 16px no-repeat;height: 65px;}
.mejs-wmp .mejs-button, .mejs-wmp .mejs-time {position: absolute;background: transparent;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-total {background-color: transparent;border: solid 1px #ccc;height: 3px;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-buffering {height: 3px;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-loaded {background-color: rgba(255,255,255,0.3);width: 0;height: 3px;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-current {width: 0;height: 1px;background-color: #014CB6;border: solid 1px #7FC9FA;border-width: 1px 0;border-color:#7FC9FA #fff #619FF2 #fff;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-handle {display: block;margin: 0;width: 16px;height: 9px;top: -3px;border: 0;background: url(../images/mejs/controls-wmp.png) no-repeat 0 -80px;}
.mejs-wmp .mejs-controls .mejs-time-rail .mejs-time-float {display: none;}
.mejs-wmp .mejs-controls .mejs-playpause-button {top: 10px;right: 50%;margin:10px -20px 0 0;width: 40px;height: 40px;}
.mejs-wmp .mejs-controls .mejs-playpause-button  button {width: 40px;height: 40px;background: url(../images/mejs/controls-wmp.png) no-repeat 0 0;margin: 0;padding: 0;}
.mejs-wmp .mejs-controls .mejs-pause button {background-position: 0 -40px;}
.mejs-wmp .mejs-controls .mejs-currenttime-container {position: absolute;top: 25px;right: 50%;margin-right: -93px;}
.mejs-wmp .mejs-controls .mejs-duration-container {position: absolute;top: 25px;right: 50%;margin-right: -58px;}
.mejs-wmp .mejs-controls .mejs-volume-button {top: 32px;left: 50%;margin-left: -55px;width: 20px;height: 15px;}
.mejs-wmp .mejs-controls .mejs-volume-button button {margin: 0;padding: 0;background: url(../images/mejs/controls-wmp.png) no-repeat -42px -17px;width: 20px;height: 15px;}
.mejs-wmp .mejs-controls .mejs-unmute button {margin: 0;padding: 0;background: url(../images/mejs/controls-wmp.png) no-repeat -42px 0;width: 20px;height: 15px;}
.mejs-wmp .mejs-controls .mejs-volume-button .mejs-volume-slider {background: rgba(102,102,102,0.6);}
.mejs-wmp .mejs-controls .mejs-fullscreen-button {top: 32px;left: 50%;margin-left: -82px;width: 15px;height: 14px;}
.mejs-wmp .mejs-controls .mejs-fullscreen-button  button {margin: 0;padding: 0;background: url(../images/mejs/controls-wmp.png) no-repeat -63px 0;width: 15px;height: 14px;}
.mejs-wmp .mejs-controls .mejs-captions-button {display: none;}
@media all and (max-width: 800px) {
.styleMedia {max-width: 300px;width: 100%;min-height: 169px;}
}
@media all and (min-width: 801px) {
.styleMedia {max-width: 560px;width: 100%;min-height: 315px;}
}
@media all and (min-width: 801px) {
#easyMoodButton {position: fixed;cursor: pointer;z-index: 799;}
#easyMoodButton.easyMoodPositionLeft {right: 0px;top: 35%;height: 0px;}
#easyMoodButton.easyMoodPositionLeft > div {-webkit-transform: rotate(90deg) translatex(-50px);-webkit-transform-origin: left bottom;-moz-transform: rotate(90deg) translatex(-50px);-moz-transform-origin: left bottom;-ms-transform: rotate(90deg) translatex(-50px);-ms-transform-origin: left bottom;-o-transform: rotate(90deg) translatex(-50px);-o-transform-origin: left bottom;}
#easyMoodButton.easyMoodPositionLeft > div > span {-moz-transform: rotate(-180deg);-ms-transform: rotate(-180deg);-o-transform: rotate(-180deg);-webkit-transform: rotate(-180deg);display: block;padding: 5px 15px 10px;border-radius:0 0 6px 6px;}
#easyMoodButton.easyMoodPositionRight {left: 0px;top: 35%;height: 0px;}
#easyMoodButton.easyMoodPositionRight > div {-webkit-transform: rotate(-90deg) translatex(50px);-webkit-transform-origin: right bottom;-moz-transform: rotate(-90deg) translatex(50px);-moz-transform-origin: right bottom;-ms-transform: rotate(-90deg) translatex(50px);-ms-transform-origin: right bottom;-o-transform: rotate(-90deg) translatex(50px);-o-transform-origin: right bottom;}
#easyMoodButton.easyMoodPositionRight > div > span {-moz-transform: rotate(-180deg);-ms-transform: rotate(-180deg);-o-transform: rotate(-180deg);-webkit-transform: rotate(-180deg);display: block;padding: 5px 15px 10px;border-radius:0 0 6px 6px;}
#easyMoodButton.easyMoodPositionBottom {right: 30px;bottom: 0px;}
#easyMoodButton.easyMoodPositionBottom.easyMoodTickerActive {bottom: 30px;}
#easyMoodButton.easyMoodPositionBottom > div > span {display: block;padding: 5px 15px 5px;border-radius:6px 6px 0 0;}
#easyMoodButton > div {width: auto;display: inline-block;}
#easyMoodButton > div > span {display: block;background-color: rgba(0,0,0,0.5);color: #ffffff;font-weight: bold;box-shadow:  -0 2px 3px rgba(51,51,51,0.5);-webkit-transition-property: background-color, border, box-shadow, color;transition-property: background-color, border, box-shadow, color;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#easyMoodButton > div > span:hover {background-color: rgba(0,0,0,0.5);box-shadow:  -0 2px 4px rgba(0,0,0,0.5);}
#easyMoodContainer {position: fixed;background-color: rgba(0,0,0,0.5);box-shadow:  -2px 0px 3px rgba(51,51,51,0.5);padding: 5px;z-index: 800;}
#easyMoodContainer.easyMoodPositionLeft {right: 25px;top: 35%;margin-top: -19px;border-radius:6px 0 6px 6px;}
#easyMoodContainer.easyMoodPositionRight {left: 25px;top: 35%;margin-top: -19px;border-radius:0 6px 6px 6px;}
#easyMoodContainer.easyMoodPositionBottom {right: 30px;bottom: 22px;margin-top: -19px;border-radius:6px 6px 0 6px;}
#easyMoodContainer.easyMoodPositionBottom.easyMoodTickerActive {bottom: 52px;}
#easyMoodContainer > div {position: relative;width: 220px;padding: 14px;}
#easyMoodContainer > div span.captionTitle {display: block;margin-bottom: 6px;text-transform: uppercase;}
#easyMoodContainer > div .easyMoodCloseButton {color: #666666;cursor: pointer;display: inline-block;font-family: FontAwesome;font-size: 28px;height: 32px;position: absolute;left: 2px;text-align: center;text-decoration: none;top: 0px;width: 32px;}
#easyMoodContainer > div .easyMoodCloseButton span {display: none;}
#easyMoodContainer > div .easyMoodCloseButton:before {content: "\f057";}
#easyMoodContainer > div .easyMoodCloseButton:hover {color: #336699;}
#easyMoodContainer > div .icon-ok-circle {color: #74a446;}
#easyMoodContainer > div .icon-remove-circle {color: #c95145;}
#easyMoodMarquee {display: block !important;width: 100%;height: 20px;position: fixed;bottom: 0px;overflow: hidden;z-index: 799;background-color: rgba(0,0,0,0.5);box-shadow:  -2px 0px 3px rgba(51,51,51,0.5);color: #ffffff;padding: 5px;}
#easyMoodMarquee ul > li, #easyMoodMarquee .ticker-content {display: inline-block;margin-left: 0px;}
#easyMoodMarquee ul > li a, #easyMoodMarquee .ticker-content a {color: #ffffff;}
#pageFooter {margin-bottom: 25px;}
}
@media all and (max-width: 800px) {
#easyMoodButton {position: fixed;right: 10px;bottom: 0px;cursor: pointer;z-index: 799;}
#easyMoodButton > div {width: auto;display: inline-block;}
#easyMoodButton > div > span {display: block;padding: 5px 15px 5px;background-color: rgba(0,0,0,0.5);color: #ffffff;font-weight: bold;border-radius:6px 6px 0 0;}
#easyMoodContainer {position: fixed;right: 10px;bottom: 22px;background-color: rgba(0,0,0,0.5);padding: 5px;margin-top: -19px;z-index: 799;border-radius:6px 6px 0 6px;}
#easyMoodContainer > div {position: relative;width: 220px;padding: 14px;}
#easyMoodContainer > div span.captionTitle {display: block;margin-bottom: 6px;text-transform: uppercase;}
#easyMoodContainer > div .easyMoodCloseButton {color: #ffffff;cursor: pointer;display: inline-block;font-family: FontAwesome;font-size: 28px;height: 32px;position: absolute;left: 2px;text-align: center;text-decoration: none;top: 0px;width: 32px;}
#easyMoodContainer > div .easyMoodCloseButton span {display: none;}
#easyMoodContainer > div .easyMoodCloseButton:before {content: "\f057";}
#easyMoodContainer > div .easyMoodCloseButton:hover {color: #336699;}
#easyMoodContainer > div .icon-ok-circle {color: #74a446;}
#easyMoodContainer > div .icon-remove-circle {color: #c95145;}
}
#tplEasyMoodList .message, #tplUser .easyMoodListUserProfile .message {background-color: #fcfdfe;}
#tplEasyMoodList .message .messageContent, #tplUser .easyMoodListUserProfile .message .messageContent {background-color: #fcfdfe;}
#tplEasyMoodList .messageCollapsed, #tplUser .easyMoodListUserProfile .messageCollapsed {padding: 1px;opacity: 1;}
#tplEasyMoodList .messageOptions, #tplUser .easyMoodListUserProfile .messageOptions {text-align:left;}
#tplEasyMoodList .messageOptions > nav, #tplUser .easyMoodListUserProfile .messageOptions > nav {left: -23px;bottom: -3px;}
#tplEasyMoodList .messageOptions.enableComment > nav ul.smallButtons > li:first-child a.button, #tplUser .easyMoodListUserProfile .messageOptions.enableComment > nav ul.smallButtons > li:first-child a.button {border-top-right-radius: 14px;border-bottom-right-radius: 14px;}
#tplEasyMoodList .permalink, #tplUser .easyMoodListUserProfile .permalink {color: #808080;}
.easyMoodInfoBox ul > li {padding: 5px 0px;}
.easyMoodInfoBox ul > li:not(:last-child) {border-bottom: 1px dotted rgba(102,102,102,0.6);}
.easymoodCopyright {font-size: .85rem;margin-top: 2px;color: #808080;text-align:left;}
.easymoodCopyright > a {color: #808080;}
#scroller_container, .easymood_marquee {position: fixed;z-index: 799;background-color: rgba(0,0,0,0.5);box-shadow:  -2px 0px 3px rgba(51,51,51,0.4);color: #ffffff;padding:7px 5px 3px 5px;bottom: 0px;width: 100%;height: 20px;text-align:left;}
#scroller_container a, .easymood_marquee a {color: #ffffff;}
#scroller_container > div, .easymood_marquee > div {height: 100%;}
#scroller_container #scroller, .easymood_marquee #scroller {top: 6px !important;width: 100%;text-align:left;}
#pageFooter {margin-bottom: 25px;}
.easymood_marquee.variant2 {position: fixed;z-index: 799;background-color: rgba(0,0,0,0.5);box-shadow:  -2px 0px 3px rgba(51,51,51,0.4);color: #ffffff;padding:7px 5px 3px 5px;bottom: 0px;width: 100%;height: 20px;text-align:left;overflow: hidden;}
.easymood_marquee.variant2 ul > li {overflow: hidden;white-space: nowrap;display: none;margin-left: 10px;text-overflow: ellipsis;}
#easymood-toogle {position: fixed;right: 0px;bottom: 0px;z-index: 799;color: #ffffff;text-shadow:-0 0 8px #ffffff;cursor: pointer;}
.borderRadius {-moz-border-radius: 5px;border-radius: 5px;}
.borderRadiusTp {-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.borderRadiusBtm {-moz-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px;}
.ddcommon {position: relative;display: -moz-inline-stack;zoom: 1;display: inline-block;*display: inline;cursor: default;}
.ddcommon ul {padding: 0;margin: 0;}
.ddcommon ul li {list-style-type: none;}
.ddcommon .disabled img, .ddcommon .disabled span, .ddcommon.disabledAll {opacity: .5;-ms-filter: "alpha(opacity=50)";filter: alpha(opacity=50);-khtml-opacity: .5;-moz-opacity: .5;color: #999999;}
.ddcommon .clear {clear: both;}
.ddcommon .shadow {-moz-box-shadow:  -5px 5px 5px -5px #888888;-webkit-box-shadow:  -5px 5px 5px -5px #888888;box-shadow:  -5px 5px 5px -5px #888888;}
.ddcommon input.text {color: #7e7e7e;padding:0 0 0 0;position: absolute;background: #fff;display: block;width: 98%;height: 98%;right: 2px;top: 0;border: none;}
.ddOutOfVision {position: relative;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;}
.borderRadius .shadow {-moz-box-shadow:  -5px 5px 5px -5px #888888;-webkit-box-shadow:  -5px 5px 5px -5px #888888;box-shadow:  -5px 5px 5px -5px #888888;}
.borderRadiusBtm .shadow {-moz-box-shadow:  5px -5px 5px -5px #888888;-webkit-box-shadow:  5px -5px 5px -5px #888888;box-shadow:  5px -5px 5px -5px #888888;}
.borderRadiusTp .border, .borderRadius .border {-moz-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px;}
.borderRadiusBtm .border {-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
img.fnone {float: none !important;}
.ddcommon .divider {width: 0;height: 100%;position: absolute;}
.ddcommon .ddArrow {display: inline-block;position: absolute;top: 50%;left: 4px;}
.ddcommon .ddArrow:hover {background-position: 0 100%;}
.ddcommon .ddTitle {padding: 0;position: relative;display: inline-block;width: 100%;}
.ddcommon .ddTitle .ddTitleText {display: block;}
.ddcommon .ddTitle .ddTitleText .ddTitleText {padding: 0;}
.ddcommon .ddTitle .description {display: block;}
.ddcommon .ddTitle .ddTitleText img {position: relative;vertical-align: middle;float:right;}
.ddcommon .ddChild {position: absolute;display: none;width: 100%;min-height: 148px;overflow-y: auto;overflow-x: hidden;zoom: 1;z-index: 9999;}
.ddcommon .ddChild li {clear: none;float:right;width: 39px;}
.ddcommon .ddChild li .description {display: block;}
.ddcommon .ddChild li img {border: 0 none;position: relative;vertical-align: middle;float:right;}
.ddcommon .ddChild li.optgroup {padding: 0;}
.ddcommon .ddChild li.optgroup .optgroupTitle {padding: 0 5px;font-weight: bold;font-style: italic;}
.ddcommon .ddChild li.optgroup ul li {padding:5px 15px 5px 5px;}
.ddcommon .noBorderTop {border-top: none 0 !important;padding: 0;margin: 0;}
.dd {border: 1px solid #c3c3c3;}
.dd .divider {border-right: 1px solid #c3c3c3;border-left: 1px solid #fff;left: 24px;}
.dd .ddArrow {width: 16px;height: 16px;margin-top: -8px;background: url(../images/easymood/dropdown/dd_arrow.gif) no-repeat;}
.dd .ddArrow:hover {background-position: 0 100%;}
.dd .ddTitle {color: #000;background: #e2e2e4 url(../images/easymood/dropdown/title-bg.gif) repeat-x left top;}
.dd .ddTitle .ddTitleText {padding:5px 5px 5px 20px;}
.dd .ddTitle .ddTitleText .ddTitleText {padding: 0;}
.dd .ddTitle .description {font-size: 12px;color: #666;}
.dd .ddTitle .ddTitleText img {padding-left: 5px;}
.dd .ddChild {border: 1px solid #c3c3c3;background-color: #fff;right: -1px;}
.dd .ddChild li {padding: 5px;background-color: #fff;border-bottom: 1px solid #c3c3c3;text-align: center;}
.dd .ddChild li {border-left: 1px solid #c3c3c3;}
.dd .ddChild li .description {color: #666;}
.dd .ddChild li .ddlabel {color: #333;}
.dd .ddChild li.hover {background-color: #f2f2f2;}
.dd .ddChild li img {padding:0 0 0 6px;}
.dd .ddChild li.optgroup {padding: 0;}
.dd .ddChild li.optgroup .optgroupTitle {padding: 0 5px;font-weight: bold;font-style: italic;}
.dd .ddChild li.optgroup ul li {padding:5px 15px 5px 5px;}
.dd .ddChild li.selected {background-color: #d5d5d5;color: #000;}
#advancedStyleChooser ~ #easyMoodMarquee {bottom: 28px;}
.jsShareWhatsApp:not(.disabled) > a > span > .fa-square {color: #43d854;}
.whatsapp-square {position: relative;display: inline-block;width: 2.2em;height: 2.2em;line-height: 2em;vertical-align: middle;}
.whatsapp-square-square, .whatsapp-square-icon {position: absolute;right: 0;width: 100%;text-align: center;}
.whatsapp-square-icon {line-height: inherit;}
.whatsapp-square-square {font-size: 2.2em;}
.messageShareButtons .whatsapp-square-inverse {color: #f1f5fa;}
.messageShareButtons:hover .whatsapp-square-inverse {color: #d8e7f5;}
.jsShareTelegram:not(.disabled) > a > span > .fa-square {color: #0088cc;}
.telegram-square {position: relative;display: inline-block;width: 2.2em;height: 2.2em;line-height: 2em;vertical-align: middle;}
.telegram-square-square, .telegram-square-icon {position: absolute;right: 0;width: 100%;text-align: center;}
.telegram-square-icon {line-height: inherit;}
.telegram-square-square {font-size: 2.2em;}
.messageShareButtons .telegram-square-inverse {color: #f1f5fa;}
.messageShareButtons:hover .telegram-square-inverse {color: #d8e7f5;}
#socialShare {position: relative;}
#socialShare::before {content: "\f0e5";color: #999999;font-family: FontAwesome;font-size: 14px;right: 11px;position: absolute;top: 12px;}
#socialShare:hover input[type='text']::-webkit-input-placeholder, #socialShare:hover::before {color: #666666;}
#socialShare #shareMessagePlaceholder, #socialShare #shareMessage {background-color: #ffffff;border: 1px solid #cccccc;color: #666666;height: 40px;padding:5px 33px 5px 12px;width: 100%;-webkit-appearance: textfield;box-shadow: none;cursor: pointer;}
#socialShare #shareMessage {display: none;height: 80px;padding:12px 33px 50px 12px;cursor: inherit;border-bottom: 0;border-bottom-right-radius: 0;border-bottom-left-radius: 0;}
#socialShare .shareButtons {display: none;}
#socialShare #shareCancel {margin-left: 8px;}
#socialShare .formSubmit {text-align:left;margin-top: 0;background: #f1f5fa;padding: 6px;border: 1px solid #d4d4d4;}
#socialShare .shareBBCodes {display: none;position: absolute;right: 10px;bottom: 2px;}
#socialShare .shareBBCodes li {display: inline-block;padding: 7px 3px;}
#socialShare .shareBBCodes .icon {cursor: pointer !important;}
#socialShare .shareDelete {color: #900;font-size: 14px;position: absolute;left: 5px;top: 5px;text-shadow:-1px 1px 0 rgba(0,0,0,0.3);cursor: pointer;}
.sidebar #socialShare .formSubmit {background: transparent;width: auto;border: 0;text-align:left;}
.sidebarWrapper {display: table;width: 100%;}
.sidebarWrapper .jsSelectItem.active {font-weight: bold;}
.sidebarWrapper .jsSelectItem.pointer {color: #336699;}
.sidebarWrapper .jsSelectItem.pointer:hover {color: #003366;text-decoration: underline;}
#sidebarWrapperMenu {display: table-cell;width: 20%;min-width: 200px;padding-left: 10px;vertical-align: top;}
#sidebarWrapperMenu .container {padding: 5px;}
#sidebarWrapperContent {display: table-cell;padding: 5px;}
#sidebarWrapperContent .container {padding: 5px;}
#sidebarWrapperMenu #sidebarWrapperButtons > li {width: 230px;}
.sidebarWrapperMenuInsert.sidebarWrapperMenuDepth1 {margin-right: 0px;}
.sidebarWrapperMenuInsert.sidebarWrapperMenuDepth2 {margin-right: 11px;}
.sidebarWrapperMenuInsert.sidebarWrapperMenuDepth3 {margin-right: 22px;}
.sidebarWrapperMenuInsert.sidebarWrapperMenuDepth4 {margin-right: 44px;}
.sidebarWrapperMenuTitle.sidebarWrapperMenuDepth0 {font-size: 110%;}
.sidebarWrapperMenuTitle.sidebarWrapperMenuDepth1, .sidebarWrapperMenuTitle.sidebarWrapperMenuDepth2, .sidebarWrapperMenuTitle.sidebarWrapperMenuDepth3, .sidebarWrapperMenuTitle.sidebarWrapperMenuDepth4 {font-size: 100%;}
#sidebarWrapperMenu #sidebarWrapperButtons > li.active >span {font-weight: bold;}
@media only screen and (max-width: 600px) {
#sidebarWrapperMenu {display: table-row !important;width: 100%;}
#sidebarWrapperContent {display: table-row !important;width: 100% !important;margin-top: 5px !important;}
}
.easymediaCategoryListContent ol > li ol {margin-right: 14px;}
.flexibleCategoryList.easymediaFlexibleCategoryList {position: relative;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li {margin-bottom: 14px;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > .containerHeadline + * {margin-top: 2px;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol {margin-right: 21px;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 100%;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol > li > ol > li {font-size: 100%;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 100%;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 100%;}
.flexibleCategoryList.easymediaFlexibleCategoryList > li > ol > li > ol > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 100%;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList {position: relative;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li {margin:0 0 0 0;margin-bottom: 14px;vertical-align: top;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > .containerHeadline + * {margin-top: 2px;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol {margin-right: 21px;font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li {font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol > li {font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol > li > ol > li {font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol > li > ol > li > ol {margin-top: 2px;margin-bottom: 7px;margin-right: 21px;font-size: 1.2rem;}
.flexibleCategoryList.easymediaFlexibleContentCategoryList > li > ol > li > ol > li > ol > li > ol > li > ol > li {font-size: 1.2rem;}
.easymediaPreview > img {background-color: #ffffff;border: 1px solid #cccccc;padding: 4px;}
.mapInfoImages li {display: inline-block;margin-bottom: 5px;}
.mapInfoVideos li {display: inline-block;margin-bottom: 5px;}
.easymediaAlbumList > li .containerHeadline > div {position: absolute;top: 3px;left: 0;opacity: .5;}
.easymediaAlbumList > li ul.sampleImages, .easymediaAlbumList > li ul.editorSampleImages {margin-right: 43px;margin-top: 3px;max-height: 64px;overflow: hidden;}
.easymediaAlbumList > li ul.sampleImages > li, .easymediaAlbumList > li ul.editorSampleImages > li {display: inline-block;}
.easymediaAlbumList > li ul.sampleImages > li img, .easymediaAlbumList > li ul.editorSampleImages > li img {width: 64px;}
.easymediaAlbumList > li ul.editorSampleImages {margin-right: 0px;}
.easymediaAlbumList > li:hover .containerHeadline > div {opacity: 1;}
#tplAlbum .sidebarMap {height: 265px;}
#tplAlbum .gm-style-iw div {overflow: hidden !important;width: auto !important;}
#tplAlbum .mapInfoImages li img, #tplAlbum .mapInfoVideos li img {max-width: 48px !important;}
.easymediaAlbumSortingImages, .easymediaAlbumSortingVideos {padding: 0 10px;margin:0 -14px 0 -14px;}
.easymediaAlbumSortingImages > li, .easymediaAlbumSortingVideos > li {position: relative;display: inline-block;margin:0 0 14px 14px;height: 180px;width: 240px;vertical-align: top;}
.easymediaAlbumSortingImages > li.easymediaSortableImagePlaceholder, .easymediaAlbumSortingImages > li.easymediaSortableVideoPlaceholder, .easymediaAlbumSortingVideos > li.easymediaSortableImagePlaceholder, .easymediaAlbumSortingVideos > li.easymediaSortableVideoPlaceholder {background-color: #efcb50;}
.easymediaAlbumSortingImages > li img, .easymediaAlbumSortingVideos > li img {width: 100%;}
.easymediaAlbumSortingImages > li > div, .easymediaAlbumSortingVideos > li > div {position: absolute;bottom: 0;width: 100%;background-color: rgba(0,0,0,0.4);color: #fff;padding: 5px 0;}
.easymediaAlbumSortingImages > li > div > p, .easymediaAlbumSortingVideos > li > div > p {padding: 0 5px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;}
.easymediaAlbumSortingVideos > li {width: 250px;}
ul.easymediaImageList.columns-1 > li, ul.easymediaVideoList.columns-1 > li {float: none;display: block;}
ul.easymediaImageList.columns-2 > li, ul.easymediaVideoList.columns-2 > li {float:right;width: 50%;}
ul.easymediaImageList.columns-2 > li:nth-child(2n+1), ul.easymediaVideoList.columns-2 > li:nth-child(2n+1) {clear: both;}
ul.easymediaImageList.columns-3 > li, ul.easymediaVideoList.columns-3 > li {float:right;width: 33%;}
ul.easymediaImageList.columns-3 > li:nth-child(3n+1), ul.easymediaVideoList.columns-3 > li:nth-child(3n+1) {clear: both;}
ul.easymediaImageList.columns-4 > li, ul.easymediaVideoList.columns-4 > li {float:right;width: 25%;}
ul.easymediaImageList.columns-4 > li:nth-child(4n+1), ul.easymediaVideoList.columns-4 > li:nth-child(4n+1) {clear: both;}
ul.easymediaImageList.columns-5 > li, ul.easymediaVideoList.columns-5 > li {float:right;width: 20%;}
ul.easymediaImageList.columns-5 > li:nth-child(5n+1), ul.easymediaVideoList.columns-5 > li:nth-child(5n+1) {clear: both;}
ul.easymediaImageList.columns-6 > li, ul.easymediaVideoList.columns-6 > li {float:right;width: 16.6%;}
ul.easymediaImageList.columns-6 > li:nth-child(6n+1), ul.easymediaVideoList.columns-6 > li:nth-child(6n+1) {clear: both;}
ul.easymediaImageList.columns-7 > li, ul.easymediaVideoList.columns-7 > li {float:right;width: 14.28%;}
ul.easymediaImageList.columns-7 > li:nth-child(7n+1), ul.easymediaVideoList.columns-7 > li:nth-child(7n+1) {clear: both;}
ul.easymediaImageList.columns-8 > li, ul.easymediaVideoList.columns-8 > li {float:right;width: 12.5%;}
ul.easymediaImageList.columns-8 > li:nth-child(8n+1), ul.easymediaVideoList.columns-8 > li:nth-child(8n+1) {clear: both;}
ul.easymediaImageList > li, ul.easymediaVideoList > li {position: relative;padding:0 10px 20px 10px;box-sizing: border-box;}
ul.easymediaImageList > li > div, ul.easymediaVideoList > li > div {position: relative;border-radius: 5px;padding: 1px;box-shadow:  -0px 2px 4px #d9d9d9, 0px 0px 1px #646464;overflow: hidden;transition: all linear .2s;}
ul.easymediaImageList > li > div:hover, ul.easymediaVideoList > li > div:hover {box-shadow:  -0px 2px 4px #bfbfbf, 0px 0px 1px #646464;}
ul.easymediaImageList > li > div > a, ul.easymediaVideoList > li > div > a {display: block;padding:4px 4px 0 4px;}
ul.easymediaImageList > li > div > a img, ul.easymediaVideoList > li > div > a img {width: 100%;}
ul.easymediaImageList > li > div > div.videoListContainer, ul.easymediaVideoList > li > div > div.videoListContainer {overflow: hidden;padding-top: 4px;}
ul.easymediaImageList > li > div > div.videoListContainer > a, ul.easymediaVideoList > li > div > div.videoListContainer > a {display: block;padding: 0;width: 100%;height: 100%;}
ul.easymediaImageList > li > div > div.videoListContainer > img, ul.easymediaVideoList > li > div > div.videoListContainer > img {width: 100%;height: 100%;}
ul.easymediaImageList > li > div > div:not(.videoListContainer), ul.easymediaVideoList > li > div > div:not(.videoListContainer) {padding-top: 5px;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) > a, ul.easymediaVideoList > li > div > div:not(.videoListContainer) > a {display: block;font-weight: bold;padding: 0 4px;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) > a p, ul.easymediaVideoList > li > div > div:not(.videoListContainer) > a p {text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) > div > small, ul.easymediaVideoList > li > div > div:not(.videoListContainer) > div > small {padding: 0 5px;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList {overflow: hidden;background: rgba(200,200,200,0.2);box-shadow:  -0 -1px 0 rgba(0,0,0,0.1);margin-top: 2px;padding:2px 4px 0 4px;border-radius:0 0 5px 5px;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList > dt::after, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList > dt::after {display: none;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList > dd.ratingInfoData, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList > dd.ratingInfoData {position: relative;top: -1px;right: 0;z-index: 1;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList.imageBigRows > dd, ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList.videoBigRows > dd, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList.imageBigRows > dd, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList.videoBigRows > dd {margin:0 -1px 0 5px;}
ul.easymediaImageList > li > div > div:not(.videoListContainer) dl.inlineDataList:not(.imageBigRows):not(.videoBigRows) > dd, ul.easymediaVideoList > li > div > div:not(.videoListContainer) dl.inlineDataList:not(.imageBigRows):not(.videoBigRows) > dd {margin:0 -1px 0 0;}
ul.easymediaImageList > li > div .jsClipboardItem, ul.easymediaVideoList > li > div .jsClipboardItem {position: absolute;left: 20px;bottom: 0px;z-index: 2;}
ul.easymediaImageList > li > div .easymediaImageEditLink, ul.easymediaImageList > li > div .easymediaVideoEditLink, ul.easymediaVideoList > li > div .easymediaImageEditLink, ul.easymediaVideoList > li > div .easymediaVideoEditLink {position: absolute;left: 2px;bottom: 0px;}
ul.easymediaImageList > li > div .easymediaNewImageBagde, ul.easymediaImageList > li > div .easymediaNewVideoBagde, ul.easymediaVideoList > li > div .easymediaNewImageBagde, ul.easymediaVideoList > li > div .easymediaNewVideoBagde {background-color: #c95145;color: #ffffff;font-weight: bold;left: -25px;letter-spacing: 1px;padding: 2px 0;position: absolute;text-align: center;top: 8px;white-space: nowrap;width: 90px;box-shadow:  -1px 1px 2px rgba(0,0,0,0.3), inset -1px -1px 0 rgba(255,255,255,0.2);-webkit-backface-visibility: hidden;-webkit-transform: rotate(40deg);-moz-transform: rotate(40deg);-ms-transform: rotate(40deg);-o-transform: rotate(40deg);}
ul.easymediaImageList > li > div .easymediaDisabledImageBagde, ul.easymediaImageList > li > div .easymediaDisabledVideoBagde, ul.easymediaVideoList > li > div .easymediaDisabledImageBagde, ul.easymediaVideoList > li > div .easymediaDisabledVideoBagde {right: 5px;top: 5px;left: 5px;padding: 5px 4px;width: auto;background-color: rgba(0,0,0,0.6);color: #fff;box-shadow: inset 1px -1px 0 rgba(255,255,255,0.2);font-weight: bold;letter-spacing: 1px;position: absolute;text-align: center;white-space: nowrap;}
ul.easymediaImageList > li.imageNotPublished > div, ul.easymediaImageList > li.videoNotPublished > div, ul.easymediaVideoList > li.imageNotPublished > div, ul.easymediaVideoList > li.videoNotPublished > div {background-color: rgba(173,216,230,0.3);color: #1e90ff;}
ul.easymediaImageList > li.imageNotPublished > div a, ul.easymediaImageList > li.videoNotPublished > div a, ul.easymediaVideoList > li.imageNotPublished > div a, ul.easymediaVideoList > li.videoNotPublished > div a {color: #1e90ff;}
ul.easymediaImageList > li.imageNotPublished > div .icon, ul.easymediaImageList > li.videoNotPublished > div .icon, ul.easymediaVideoList > li.imageNotPublished > div .icon, ul.easymediaVideoList > li.videoNotPublished > div .icon {color: #1e90ff;text-shadow: none;}
ul.easymediaImageList > li.imageDisabled > div, ul.easymediaImageList > li.videoDisabled > div, ul.easymediaVideoList > li.imageDisabled > div, ul.easymediaVideoList > li.videoDisabled > div {background-color: rgba(238,255,238,0.3);color: #009900;}
ul.easymediaImageList > li.imageDisabled > div a, ul.easymediaImageList > li.videoDisabled > div a, ul.easymediaVideoList > li.imageDisabled > div a, ul.easymediaVideoList > li.videoDisabled > div a {color: #009900;}
ul.easymediaImageList > li.imageDisabled > div .icon, ul.easymediaImageList > li.videoDisabled > div .icon, ul.easymediaVideoList > li.imageDisabled > div .icon, ul.easymediaVideoList > li.videoDisabled > div .icon {color: #009900;text-shadow: none;}
ul.easymediaImageList > li.imageDeleted > div, ul.easymediaImageList > li.videoDeleted > div, ul.easymediaVideoList > li.imageDeleted > div, ul.easymediaVideoList > li.videoDeleted > div {background-color: rgba(255,238,238,0.3);color: #cc0000;}
ul.easymediaImageList > li.imageDeleted > div a, ul.easymediaImageList > li.videoDeleted > div a, ul.easymediaVideoList > li.imageDeleted > div a, ul.easymediaVideoList > li.videoDeleted > div a {color: #cc0000;}
ul.easymediaImageList > li.imageDeleted > div .icon, ul.easymediaImageList > li.videoDeleted > div .icon, ul.easymediaVideoList > li.imageDeleted > div .icon, ul.easymediaVideoList > li.videoDeleted > div .icon {color: #cc0000;text-shadow: none;}
ul.easymediaImageList > li.jsMarked > div, ul.easymediaVideoList > li.jsMarked > div {background-color: rgba(255,255,200,0.9);color: #666666;}
ul.easymediaImageList > li.jsMarked > div a, ul.easymediaVideoList > li.jsMarked > div a {color: #666666;}
ul.easymediaImageList > li.jsMarked > div .icon, ul.easymediaVideoList > li.jsMarked > div .icon {color: #666666;text-shadow: none;}
ul.easymediaImageList .video-container .youtube-player img, ul.easymediaImageList .video-container .vimeo-player img, ul.easymediaImageList .video-container .dailymotion-player img, ul.easymediaVideoList .video-container .youtube-player img, ul.easymediaVideoList .video-container .vimeo-player img, ul.easymediaVideoList .video-container .dailymotion-player img {max-height: 280px !important;}
div.easymediaImageSlider.imageNotPublished, div.easymediaImageSlider.videoNotPublished, div.easymediaVideoSlider.imageNotPublished, div.easymediaVideoSlider.videoNotPublished {background-color: rgba(173,216,230,0.3);}
div.easymediaImageSlider.imageNotPublished > div, div.easymediaImageSlider.videoNotPublished > div, div.easymediaVideoSlider.imageNotPublished > div, div.easymediaVideoSlider.videoNotPublished > div {background-color: rgba(173,216,230,0.3);color: #1e90ff;}
div.easymediaImageSlider.imageNotPublished > div a, div.easymediaImageSlider.videoNotPublished > div a, div.easymediaVideoSlider.imageNotPublished > div a, div.easymediaVideoSlider.videoNotPublished > div a {color: #1e90ff;}
div.easymediaImageSlider.imageNotPublished > div .icon, div.easymediaImageSlider.videoNotPublished > div .icon, div.easymediaVideoSlider.imageNotPublished > div .icon, div.easymediaVideoSlider.videoNotPublished > div .icon {color: #1e90ff;text-shadow: none;}
div.easymediaImageSlider.imageDisabled, div.easymediaImageSlider.videoDisabled, div.easymediaVideoSlider.imageDisabled, div.easymediaVideoSlider.videoDisabled {background-color: rgba(238,255,238,0.3);}
div.easymediaImageSlider.imageDisabled > div, div.easymediaImageSlider.videoDisabled > div, div.easymediaVideoSlider.imageDisabled > div, div.easymediaVideoSlider.videoDisabled > div {background-color: rgba(238,255,238,0.3);color: #009900;}
div.easymediaImageSlider.imageDisabled > div a, div.easymediaImageSlider.videoDisabled > div a, div.easymediaVideoSlider.imageDisabled > div a, div.easymediaVideoSlider.videoDisabled > div a {color: #009900;}
div.easymediaImageSlider.imageDisabled > div .icon, div.easymediaImageSlider.videoDisabled > div .icon, div.easymediaVideoSlider.imageDisabled > div .icon, div.easymediaVideoSlider.videoDisabled > div .icon {color: #009900;text-shadow: none;}
div.easymediaImageSlider.imageDeleted, div.easymediaImageSlider.videoDeleted, div.easymediaVideoSlider.imageDeleted, div.easymediaVideoSlider.videoDeleted {background-color: rgba(255,238,238,0.3);}
div.easymediaImageSlider.imageDeleted > div, div.easymediaImageSlider.videoDeleted > div, div.easymediaVideoSlider.imageDeleted > div, div.easymediaVideoSlider.videoDeleted > div {background-color: rgba(255,238,238,0.3);color: #cc0000;}
div.easymediaImageSlider.imageDeleted > div a, div.easymediaImageSlider.videoDeleted > div a, div.easymediaVideoSlider.imageDeleted > div a, div.easymediaVideoSlider.videoDeleted > div a {color: #cc0000;}
div.easymediaImageSlider.imageDeleted > div .icon, div.easymediaImageSlider.videoDeleted > div .icon, div.easymediaVideoSlider.imageDeleted > div .icon, div.easymediaVideoSlider.videoDeleted > div .icon {color: #cc0000;text-shadow: none;}
.boxHeadline.switchItems {overflow: visible;}
.boxHeadline.switchItems h1 {display: inline-block;}
.boxHeadline.switchItems nav.buttonGroupNavigation {display: inline;}
.boxHeadline.switchItems nav.buttonGroupNavigation ul#switchItemContainer {float:left;}
ul.easymediaPreviewList li {display: inline-block;margin-left: 10px;}
#tplImage .imageHeadline {overflow: visible;position: relative;}
#tplImage .boxHeadline > h1 {position: relative;}
#tplImage .boxHeadline > h1 div.ratingInfo, #tplImage .boxHeadline > h1 span.ratingInfo {display: block;position: relative;width: 150px;}
#tplImage .boxHeadline > nav {text-align:left;}
#tplImage .easymediaImage {position: relative;text-align: center;}
#tplImage .easymediaImage img {width: 92%;}
#tplImage .easymediaImage .previousImageButton, #tplImage .easymediaImage .nextImageButton {position: absolute;top: 50%;margin-top: -20px;opacity: .15;padding: 4px;transition: all linear .2s;cursor: default !important;}
#tplImage .easymediaImage .previousImageButton > span, #tplImage .easymediaImage .nextImageButton > span {cursor: default !important;}
#tplImage .easymediaImage .previousImageButton.active, #tplImage .easymediaImage .nextImageButton.active {opacity: .5;cursor: pointer !important;}
#tplImage .easymediaImage .previousImageButton.active > span, #tplImage .easymediaImage .nextImageButton.active > span {cursor: pointer !important;}
#tplImage .easymediaImage .previousImageButton.active:hover, #tplImage .easymediaImage .nextImageButton.active:hover {opacity: 1 !important;}
#tplImage .easymediaImage .previousImageButton {right: 7px;}
#tplImage .easymediaImage .nextImageButton {left: 7px;}
#tplImage .easymediaImage:hover .easymediaImageMarker {opacity: 1 !important;background-color: rgba(0,0,0,0);}
#tplImage .easymediaImage:hover .easymediaImageMarker:before {content: "\f1db";}
#tplImage .easymediaImageMarker {transition: color linear .2s;color: #cccccc;background-color: rgba(0,0,0,0.3);border-radius: 24px;}
#tplImage .easymediaImageMarker:before {content: "";}
#tplImage .easymediaImageMarker.active, #tplImage .easymediaImageMarker:hover {opacity: 1;color: #ffaa22 !important;background-color: rgba(0,0,0,0);}
#tplImage .easymediaImageMarker.active:before, #tplImage .easymediaImageMarker:hover:before {content: "\f1db";}
#tplImage .easymediaImageMarker.invisible {display: none;}
#tplImage dl.dataList dd {white-space: nowrap;text-overflow: ellipsis;max-width: 130px;overflow: hidden;}
#tplImage .sidebarMap {height: 170px;}
#tplImage .sidebarImageNavigation > ul {height: 90px;position: relative;overflow: hidden;}
#tplImage .sidebarImageNavigation > ul > li {display: inline-block;position: absolute;}
#tplImage .sidebarImageNavigation > ul > li:first-child, #tplImage .sidebarImageNavigation > ul > li:last-child {background-color: rgba(155,194,229,0.75);height: 90px;vertical-align: top;z-index: 10;}
#tplImage .sidebarImageNavigation > ul > li:first-child.disabled, #tplImage .sidebarImageNavigation > ul > li:last-child.disabled {opacity: 0.4;}
#tplImage .sidebarImageNavigation > ul > li:first-child.disabled > .icon, #tplImage .sidebarImageNavigation > ul > li:last-child.disabled > .icon {cursor: not-allowed;}
#tplImage .sidebarImageNavigation > ul > li:first-child > .icon, #tplImage .sidebarImageNavigation > ul > li:last-child > .icon {padding: 37px 2px;}
#tplImage .sidebarImageNavigation > ul > li:first-child {margin-left: 3px;right: 0;}
#tplImage .sidebarImageNavigation > ul > li:nth-child(2) {height: 90px;vertical-align: top;right: 0px;position: relative;}
#tplImage .sidebarImageNavigation > ul > li:last-child {left: 0;}
#tplImage .sidebarImageNavigation > ul > li > ul {height: 90px;width: 99999px;position: absolute;overflow: hidden;}
#tplImage .sidebarImageNavigation > ul > li > ul > li {display: inline-block;margin: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
#tplImage .sidebarImageNavigation > ul > li > ul > li:not(.active) {opacity: 0.7;}
#tplImage .sidebarImageNavigation > ul > li > ul > li:hover {opacity: 1;}
#tplImage .sidebarImageNavigation > ul > li > ul > li > a {display: block;}
#tplImage .sidebarImageNavigation > ul > li > ul > li > a > img {width: 90px;}
#tplImage .ratingHeadline {display: inline-block;margin-left: 5px;}
#tplImage .ratingHeadline ~ .userRating {position: relative;top: -7px;display: inline-block;}
.jsImageUpload {position: relative;border: 2px dashed rgba(0,0,0,0.2);}
.jsImageUpload > .uploadMessage {position: absolute;top: 50%;margin-top: -15px;width: 100%;line-height: 30px;text-align: center;vertical-align: middle;font-size: 1.6rem;font-weight: bold;font-style: italic;opacity: .5;}
.jsImageUpload > input {position: relative;display: block;padding:25px 15px 25px 0px;width: 95%;}
.jsImageUpload > input:focus {outline: 0;}
@media only screen and (max-width: 1280px) {
.jsImageUpload > .uploadMessage {left: 30px;text-align:left;}
}
#imageUploadList .sortableNode {cursor: move;}
#imageUploadList fieldset {position: relative;}
#imageUploadList fieldset span.jsDeleteButton {cursor: pointer;}
#imageUploadList fieldset > div.imagePreview {float:right;}
#imageUploadList fieldset > div.imagePreview > img {width: 200px;height: 150px;}
#imageUploadList fieldset > div.imageDetails {margin-right: 200px;min-height: 170px;margin-bottom: 15px;}
#imageUploadList fieldset > div.imageDetails dl:not(.plain) > dd:after {clear: none;}
#tplImageEdit div.imagePreview {float:right;margin-left: 20px;max-width: 310px;}
#tplImageEdit div.imagePreview > img {max-width: 300px;max-height: 300px;}
#tplImageEdit div.imagePreview > ul.buttonList {text-align: center;margin-bottom: -15px;}
#tplImageEdit div.imagePreview #uploadErrorMessage {position: relative;}
#tplImageEdit div.imagePreview #uploadErrorMessage .innerError {position: absolute;left: 0;}
#tplImageEdit div.imagePreview #uploadErrorMessage .innerError:before, #tplImageEdit div.imagePreview #uploadErrorMessage .innerError:after {display: none;}
#tplImageMarker .boxHeadline > h1 {position: relative;overflow: visible;}
#tplImageMarker .boxHeadline > nav {text-align:left;}
#tplMap #mapButtonContainer {float:left;}
#tplVideo .videoHeadline {overflow: visible;position: relative;}
#tplVideo .boxHeadline > h1 {position: relative;}
#tplVideo .boxHeadline > h1 div.ratingInfo, #tplVideo .boxHeadline > h1 span.ratingInfo {display: block;position: relative;width: 150px;}
#tplVideo .boxHeadline > nav {text-align:left;}
#tplVideo .easymediaVideo {position: relative;text-align: center;}
#tplVideo .easymediaVideo #videoContainer {margin: 0 auto;min-height: 200px;}
#tplVideo .easymediaVideo #videoContainer .mejs-container {min-height: 200px;}
#tplVideo .easymediaVideo #videoContainer .mejs-container .mejs-overlay {width: 100%;height: 100%;}
#tplVideo .easymediaVideo .previousVideoButton, #tplVideo .easymediaVideo .nextVideoButton {position: absolute;top: 50%;margin-top: -20px;opacity: .15;padding: 4px;transition: all linear .2s;cursor: default !important;}
#tplVideo .easymediaVideo .previousVideoButton > span, #tplVideo .easymediaVideo .nextVideoButton > span {cursor: default !important;}
#tplVideo .easymediaVideo .previousVideoButton.active, #tplVideo .easymediaVideo .nextVideoButton.active {opacity: .5;cursor: pointer !important;}
#tplVideo .easymediaVideo .previousVideoButton.active > span, #tplVideo .easymediaVideo .nextVideoButton.active > span {cursor: pointer !important;}
#tplVideo .easymediaVideo .previousVideoButton.active:hover, #tplVideo .easymediaVideo .nextVideoButton.active:hover {opacity: 1 !important;}
#tplVideo .easymediaVideo .previousVideoButton {right: -20px;}
#tplVideo .easymediaVideo .nextVideoButton {left: -20px;}
#tplVideo dl.dataList dd {white-space: nowrap;text-overflow: ellipsis;max-width: 130px;overflow: hidden;}
#tplVideo .sidebarMap {height: 170px;}
#tplVideo .sidebarVideoNavigation > ul {height: 80px;position: relative;overflow: hidden;}
#tplVideo .sidebarVideoNavigation > ul > li {display: inline-block;position: absolute;}
#tplVideo .sidebarVideoNavigation > ul > li:first-child, #tplVideo .sidebarVideoNavigation > ul > li:last-child {background-color: rgba(155,194,229,0.75);height: 80px;vertical-align: top;z-index: 10;}
#tplVideo .sidebarVideoNavigation > ul > li:first-child.disabled, #tplVideo .sidebarVideoNavigation > ul > li:last-child.disabled {opacity: 0.4;}
#tplVideo .sidebarVideoNavigation > ul > li:first-child.disabled > .icon, #tplVideo .sidebarVideoNavigation > ul > li:last-child.disabled > .icon {cursor: not-allowed;}
#tplVideo .sidebarVideoNavigation > ul > li:first-child > .icon, #tplVideo .sidebarVideoNavigation > ul > li:last-child > .icon {padding: 32px 2px;}
#tplVideo .sidebarVideoNavigation > ul > li:first-child {margin-left: 3px;right: 0;}
#tplVideo .sidebarVideoNavigation > ul > li:nth-child(2) {height: 80px;vertical-align: top;right: 21px;position: relative;}
#tplVideo .sidebarVideoNavigation > ul > li:last-child {left: 0;}
#tplVideo .sidebarVideoNavigation > ul > li > ul {height: 80px;width: 99999px;position: absolute;overflow: hidden;}
#tplVideo .sidebarVideoNavigation > ul > li > ul > li {display: inline-block;margin: 0;-webkit-transition-property: opacity;transition-property: opacity;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
#tplVideo .sidebarVideoNavigation > ul > li > ul > li:not(.active) {opacity: 0.7;}
#tplVideo .sidebarVideoNavigation > ul > li > ul > li:hover {opacity: 1;}
#tplVideo .sidebarVideoNavigation > ul > li > ul > li > a {display: block;}
#tplVideo .sidebarVideoNavigation > ul > li > ul > li > a > img {width: 80px;}
.easymediaSidebarBoxList > li > .framed > img {max-width: 64px !important;width: 64px !important;height: 64px !important;}
.easymediaSidebarBoxList > li > .sidebarBoxHeadline {padding-top: 2px;}
.easymediaSidebarBoxList.easymediaCommentList .sidebarBoxHeadline p.commentListMessage {max-height: 32px;overflow: hidden;text-overflow: ellipsis;}
.easymediaSidebarImageList li, .easymediaSidebarVideoList li {display: inline-block;margin-bottom: 7px;}
.easymediaSidebarImageList li:nth-child(odd), .easymediaSidebarVideoList li:nth-child(odd) {margin-left: 4px;}
.easymediaSidebarImageList li a, .easymediaSidebarVideoList li a {display: block;}
.easymediaSidebarImageList li a img, .easymediaSidebarVideoList li a img {max-width: 132px !important;height: 100px !important;}
.easymediaSidebarImageList ~ .button.upload, .easymediaSidebarVideoList ~ .button.upload {margin:5px 0 0 3px;float:left;}
#easymediaBrowser .containerList > li > div > div > .buttonGroupNavigation > .buttonList {opacity: 1;}
#easymediaEditorAudioList li > div.box64 img, #easymediaEditorAlbumList li > div.box64 img, #easymediaEditorOwnAlbumList li > div.box64 img, #easymediaEditorOwnImageList li > div.box64 img, #easymediaEditorImageList li > div.box64 img, #easymediaEditorImageSearchResultList li > div.box64 img, #easymediaEditorOwnVideoList li > div.box64 img, #easymediaEditorVideoList li > div.box64 img, #easymediaEditorVideoSearchResultList li > div.box64 img {max-width: 64px !important;}
#easymediaEditorAudioList li > div.box96 img, #easymediaEditorAlbumList li > div.box96 img, #easymediaEditorOwnAlbumList li > div.box96 img, #easymediaEditorOwnImageList li > div.box96 img, #easymediaEditorImageList li > div.box96 img, #easymediaEditorImageSearchResultList li > div.box96 img, #easymediaEditorOwnVideoList li > div.box96 img, #easymediaEditorVideoList li > div.box96 img, #easymediaEditorVideoSearchResultList li > div.box96 img {max-width: 96px !important;}
#easymediaEditorAudioList li > div.box64 .containerHeadline > h3, #easymediaEditorAudioList li > div.box96 .containerHeadline > h3, #easymediaEditorAlbumList li > div.box64 .containerHeadline > h3, #easymediaEditorAlbumList li > div.box96 .containerHeadline > h3, #easymediaEditorOwnAlbumList li > div.box64 .containerHeadline > h3, #easymediaEditorOwnAlbumList li > div.box96 .containerHeadline > h3, #easymediaEditorOwnImageList li > div.box64 .containerHeadline > h3, #easymediaEditorOwnImageList li > div.box96 .containerHeadline > h3, #easymediaEditorImageList li > div.box64 .containerHeadline > h3, #easymediaEditorImageList li > div.box96 .containerHeadline > h3, #easymediaEditorImageSearchResultList li > div.box64 .containerHeadline > h3, #easymediaEditorImageSearchResultList li > div.box96 .containerHeadline > h3, #easymediaEditorOwnVideoList li > div.box64 .containerHeadline > h3, #easymediaEditorOwnVideoList li > div.box96 .containerHeadline > h3, #easymediaEditorVideoList li > div.box64 .containerHeadline > h3, #easymediaEditorVideoList li > div.box96 .containerHeadline > h3, #easymediaEditorVideoSearchResultList li > div.box64 .containerHeadline > h3, #easymediaEditorVideoSearchResultList li > div.box96 .containerHeadline > h3 {margin-left: 25px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
#easymediaEditorAudioList li > div.box64 p > small, #easymediaEditorAudioList li > div.box96 p > small, #easymediaEditorAlbumList li > div.box64 p > small, #easymediaEditorAlbumList li > div.box96 p > small, #easymediaEditorOwnAlbumList li > div.box64 p > small, #easymediaEditorOwnAlbumList li > div.box96 p > small, #easymediaEditorOwnImageList li > div.box64 p > small, #easymediaEditorOwnImageList li > div.box96 p > small, #easymediaEditorImageList li > div.box64 p > small, #easymediaEditorImageList li > div.box96 p > small, #easymediaEditorImageSearchResultList li > div.box64 p > small, #easymediaEditorImageSearchResultList li > div.box96 p > small, #easymediaEditorOwnVideoList li > div.box64 p > small, #easymediaEditorOwnVideoList li > div.box96 p > small, #easymediaEditorVideoList li > div.box64 p > small, #easymediaEditorVideoList li > div.box96 p > small, #easymediaEditorVideoSearchResultList li > div.box64 p > small, #easymediaEditorVideoSearchResultList li > div.box96 p > small {white-space: nowrap;display: block;overflow: hidden;text-overflow: ellipsis;}
#easymediaEditorAudioList li > div.box64 p > small .datetime, #easymediaEditorAudioList li > div.box96 p > small .datetime, #easymediaEditorAlbumList li > div.box64 p > small .datetime, #easymediaEditorAlbumList li > div.box96 p > small .datetime, #easymediaEditorOwnAlbumList li > div.box64 p > small .datetime, #easymediaEditorOwnAlbumList li > div.box96 p > small .datetime, #easymediaEditorOwnImageList li > div.box64 p > small .datetime, #easymediaEditorOwnImageList li > div.box96 p > small .datetime, #easymediaEditorImageList li > div.box64 p > small .datetime, #easymediaEditorImageList li > div.box96 p > small .datetime, #easymediaEditorImageSearchResultList li > div.box64 p > small .datetime, #easymediaEditorImageSearchResultList li > div.box96 p > small .datetime, #easymediaEditorOwnVideoList li > div.box64 p > small .datetime, #easymediaEditorOwnVideoList li > div.box96 p > small .datetime, #easymediaEditorVideoList li > div.box64 p > small .datetime, #easymediaEditorVideoList li > div.box96 p > small .datetime, #easymediaEditorVideoSearchResultList li > div.box64 p > small .datetime, #easymediaEditorVideoSearchResultList li > div.box96 p > small .datetime {display: inline;}
#easymediaEditorOwnVideoList li > div.box96 img, #easymediaEditorVideoList li > div.box96 img, #easymediaEditorVideoSearchResultList li > div.box96 img {min-width: 96px;max-height: 64px !important;}
.easymediaEditorImageSlideshow {max-width: 500px;}
.easymediaEditorImageSlideshow .slideshowButtonList {padding: 5px;background-color: rgba(0,0,0,0.3);border-bottom-right-radius: 10px;}
.easymediaEditorImageSlideshow.floating {width: 500px;}
#tplImage .icon72, #tplImageMarker .icon72 {font-size: 66px;height: 72px;width: 72px;}
#tplImage .icon128, #tplImageMarker .icon128 {font-size: 120px;height: 128px;width: 128px;}
@media only screen and (max-width: 800px) {
#tplImageEdit div.imagePreview {float: none;margin:0 0 15px 0;}
#tplImageEdit div.imagePreview > img {max-width: 100%;max-height: 100%;}
.jsImageUpload > .uploadMessage {display: none;}
#imageUploadList .sortableNode {cursor: move;}
#imageUploadList fieldset > div.imagePreview {float: none;text-align: center;}
#imageUploadList fieldset > div.imagePreview > img {width: 200px;height: 150px;}
#imageUploadList fieldset > div.imageDetails {margin-right: 0;}
.easymediaAlbumList > li .containerHeadline > div {display: none;}
}
.slick-slider {position: relative;display: block;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-ms-touch-action: pan-y;touch-action: pan-y;-webkit-tap-highlight-color: transparent;}
.slick-list {position: relative;overflow: hidden;display: block;margin: 0;padding: 0;}
.slick-list:focus {outline: none;}
.slick-list.dragging {cursor: pointer;cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-o-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
.slick-track {position: relative;right: 0;top: 0;display: block;}
.slick-track:before, .slick-track:after {content: "";display: table;}
.slick-track:after {clear: both;}
.slick-loading .slick-track {visibility: hidden;}
.slick-slide {display: inline-block !important;float:right;height: 100%;min-height: 300px;position: relative;padding:0 10px 20px 10px;box-sizing: border-box;outline: none;display: none;}
[dir="rtl"] .slick-slide {float:left;}
.slick-slide > div {position: relative;border-radius: 5px;padding: 1px;margin-top: 1px;margin-bottom: 15px;box-shadow:  -0px 2px 4px #d9d9d9, 0px 0px 1px #646464;overflow: hidden;transition: all linear .2s;}
.slick-slide > div:hover {box-shadow:  -0px 2px 4px #bfbfbf, 0px 0px 1px #646464;}
.slick-slide > div > a, .slick-slide > div > div > div > a {display: block;padding:4px 4px 0 4px;outline: none;}
.slick-slide > div > a > img, .slick-slide > div > div > div > a > img {outline: none;display: block;width: 100%;height: 100%;}
.slick-slide > div > div, .slick-slide > div > div > div > div {padding-top: 5px;}
.slick-slide > div > div > a, .slick-slide > div > div > div > div > a {display: block;font-weight: bold;padding: 0 4px;}
.slick-slide > div > div > a > p, .slick-slide > div > div > div > div > a > p {text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.slick-slide > div > div > div > small, .slick-slide > div > div > div > div > div > small {padding: 0 5px;}
.slick-slide > div > div dl.inlineDataList, .slick-slide > div > div > div > div dl.inlineDataList {overflow: hidden;background: rgba(200,200,200,0.2);box-shadow:  -0 -1px 0 rgba(0,0,0,0.1);margin-top: 2px;padding:2px 4px 0 4px;border-radius:0 0 5px 5px;}
.slick-slide > div > div dl.inlineDataList > dt, .slick-slide > div > div > div > div dl.inlineDataList > dt {color: #808080;display: inline-block;margin: 0;text-align:right;width: auto;}
.slick-slide > div > div dl.inlineDataList > dt:after, .slick-slide > div > div > div > div dl.inlineDataList > dt:after {display: none;}
.slick-slide > div > div dl.inlineDataList > dd, .slick-slide > div > div > div > div dl.inlineDataList > dd {margin:0 -1px 0 0;}
.slick-slide > div > .easymediaNewImageBagde, .slick-slide > div > div > div > .easymediaNewImageBagde, .slick-slide > div > .easymediaNewVideoBagde, .slick-slide > div > div > div > .easymediaNewVideoBagde {background-color: #c95145;color: #ffffff;font-weight: bold;left: -25px;letter-spacing: 1px;padding: 2px 0;position: absolute;text-align: center;top: 8px;white-space: nowrap;width: 90px;box-shadow:  -1px 1px 2px rgba(0,0,0,0.3), inset -1px -1px 0 rgba(255,255,255,0.2);-webkit-backface-visibility: hidden;-webkit-transform: rotate(40deg);-moz-transform: rotate(40deg);-ms-transform: rotate(40deg);-o-transform: rotate(40deg);}
.slick-slide > div .easymediaDisabledImageBagde, .slick-slide > div > div > div > .easymediaDisabledImageBagde, .slick-slide > div .easymediaDisabledVideoBagde, .slick-slide > div > div > div > .easymediaDisabledVideoBagde {right: 5px;top: 5px;left: 5px;padding: 5px 4px;width: auto;background-color: rgba(0,0,0,0.6);color: #fff;box-shadow: inset 1px -1px 0 rgba(255,255,255,0.2);font-weight: bold;letter-spacing: 1px;position: absolute;text-align: center;white-space: nowrap;}
.slick-slide.slick-loading img {display: none;}
.slick-slide.dragging img {pointer-events: none;}
.slick-initialized .slick-slide {display: block;}
.slick-loading .slick-slide {visibility: hidden;}
.slick-vertical .slick-slide {display: block;height: auto;border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}
#easymediaVideoSlider .slick-slide {min-height: 220px;}
@font-face {font-family: 'slick';font-weight: normal;font-style: normal;src: url('../font/slick/slick.eot');src: url('../font/slick/slick.eot?#iefix') format('embedded-opentype'), url('../font/slick/slick.woff') format('woff'), url('../font/slick/slick.ttf') format('truetype'), url('../font/slick/slick.svg#slick') format('svg');}
.slick-prev, .slick-next {position: absolute;display: block;height: 20px;width: 20px;line-height: 0px;font-size: 0px;cursor: pointer;background: transparent !important;background-image: none !important;box-shadow: none !important;color: transparent;top: 50%;margin-top: -10px \9;-webkit-transform: translate(0,-50%);-ms-transform: translate(0,-50%);transform: translate(0,-50%);padding: 0;border: none;outline: none;}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {outline: none;background: transparent !important;background-image: none !important;box-shadow: none !important;color: transparent;}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {opacity: 1;}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {opacity: 0.25;}
.slick-prev:before, .slick-next:before {font-family: "slick";font-size: 20px;line-height: 1;color: rgba(102,102,102,0.8);opacity: 0.75;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.slick-prev {right: -20px;}
.slick-prev[dir="rtl"] {right: auto;left: -20px;}
.slick-prev:before {content: "←";}
.slick-prev:before[dir="rtl"] {content: "→";}
.slick-next {left: -20px;}
.slick-next[dir="rtl"] {right: -20px;left: auto;}
.slick-next:before {content: "→";}
.slick-next:before[dir="rtl"] {content: "←";}
.slick-slider {margin-bottom: 0px;}
.slick-dots {position: absolute;bottom: -10px;list-style: none;display: block;text-align: center;padding: 0;width: 100%;}
.slick-dots li {position: relative;display: inline-block;height: 20px;width: 20px;margin: 0 5px;padding: 0;cursor: pointer;}
.slick-dots li button {border: 0;background: transparent;display: block;height: 20px;width: 20px;outline: none;line-height: 0px;font-size: 0px;color: transparent;padding: 5px;cursor: pointer;box-shadow: none;}
.slick-dots li button:hover, .slick-dots li button:focus {outline: none;box-shadow: none;background: transparent;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity: 1;}
.slick-dots li button:before {position: absolute;top: 0;right: 0;content: "•";width: 20px;height: 20px;font-family: "slick";font-size: 10px;line-height: 20px;text-align: center;color: rgba(102,102,102,0.8);opacity: 0.25;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before {color: rgba(102,102,102,0.8);opacity: 0.75;}
.easymediaInfoBox > div:not(:last-child) {margin-bottom: 7px;}
.easymediaInfoBox > div .userInfoLegend {display: inline-block;color: #666666;text-shadow:-0 1px 0 rgba(255,255,255,0.8);margin-bottom: 3px;padding: 0px;text-transform: uppercase;}
.easymediaInfoBox > div .userInfoUsageBar {height: 16px;padding: 1px;border-radius: 3px;background-color: #666666;box-shadow: inset -0 1px 5px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .5);}
.easymediaInfoBox > div .userInfoUsageBar:not(.disabled) > span {display: block;height: 100%;border-radius: 2px;background-color: #b1e587;background-image: -webkit-linear-gradient(#b1e587,#8dbc6b);background-image: linear-gradient(#b1e587,#8dbc6b);box-shadow: inset -0 1px 2px rgba(0, 0, 0, .3);color: transparent;}
.easymediaInfoBox > div .userInfoUsageBar.yellow > span {background-color: #f2f28e;background-image: -webkit-linear-gradient(#f2f28e,#c9c372);background-image: linear-gradient(#f2f28e,#c9c372);}
.easymediaInfoBox > div .userInfoUsageBar.orange > span {background-color: #ffbf72;background-image: -webkit-linear-gradient(#ffbf72,#ff920a);background-image: linear-gradient(#ffbf72,#ff920a);}
.easymediaInfoBox > div .userInfoUsageBar.red > span {background-color: #ff7272;background-image: -webkit-linear-gradient(#ff7272,#ff0a0a);background-image: linear-gradient(#ff7272,#ff0a0a);}
.easymediaInfoBox > div .userInfoUsageBar~ p {text-align: center;color: #808080;}
.easymediaInfoBox .buttonGroupNavigation {text-align: center;margin: 10px 0;}
.sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfo'] > legend, .sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfoImage'] > legend, .sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfoVideo'] > legend {display: none;}
.sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfo'] > div, .sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfoImage'] > div, .sidebar fieldset.dashboardBox[data-box-name='com.cls.easymedia.userInfoVideo'] > div {margin-top: -7px;}
.easymediaBBCode.easymediaVideo > a {position: relative;}
.easymediaBBCode.easymediaVideo > a span.icon {position: absolute;width: 100%;height: 100%;right: 0;top: -30px;color: rgba(255,255,255,0.8);}
body, .tabularBox, .dialogTitlebar {background-image: url(../images/blueTemptation/blueTemptationHeader.png);background-repeat: repeat-x;}
.mainMenu > ul {background-color: rgba(0,0,0,0.4);}
.mainMenu > ul > li > a {border-width: 0 !important;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .3s;transition-duration: .3s;-webkit-transition-timing-function: ease;transition-timing-function: ease;text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.mainMenu > ul > li > a:hover {color: #ffffff;}
.mainMenu > ul > li.active > a {background-color: #e4eef8;background-image: -webkit-linear-gradient(#ffffff,#e4eef8);background-image: linear-gradient(#ffffff,#e4eef8);}
.mainMenu > ul > li:hover {color: #336699;}
@media all and (min-width: 801px) {
.mainMenu {margin: 14px 9px 0;}
.mainMenu > ul {border-radius:5px 5px 0 0;}
.mainMenu > ul > li.active > a {border-radius:5px 5px 0 0;position: relative;}
.mainMenu > ul > li.active > a::after {border-bottom-right-radius: 6px;border-width:0 1px 1px 0;bottom: 0;content: "";height: 7px;position: absolute;left: -7px;width: 7px;box-shadow:  2px 2px 0 0 #e4eef8;}
.mainMenu > ul > li.active > a::before {border-bottom-left-radius: 6px;border-width:0 0 1px 1px;bottom: 0;content: "";height: 7px;right: -7px;position: absolute;width: 7px;box-shadow:  -2px 2px 0 0 #e4eef8;}
}
@media all and (min-width: 801px) {
.navigation {border-color: #b8d3ed;}
.navigation > ul.navigationIcons > li > a:hover {background-color: #d8e7f5;}
.navigation > ul.navigationItems {border-color: #93bde3;}
.navigationHeader {border-top-width: 0;border-radius:6px 6px 0 0;}
.navigationFooter {border-radius:0 0 6px 6px;}
}
@media all and (min-width: 801px) {
.sidebar > div > fieldset:not(:last-child), .sidebar > div > div:not(:last-child) {border-color: #b8d3ed;}
.sidebar fieldset > nav ul > li.active {box-shadow:  -0 0 2px 0 rgba(0,0,0,0.1);}
.sidebar fieldset > nav ul > li > a {-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
#main > div > div > .sidebar > span > .collapsibleButton {border-width:1px 1px 1px 0;border-style: solid;border-color: #b8d3ed;clip: rect(-5px 25px 31px -5px);box-shadow:  -0 0 2px 0 rgba(0,0,0,0.1);}
#main.sidebarOrientationLeft .sidebar {border-left: 1px solid #b8d3ed;}
#main.sidebarOrientationLeft .sidebar > div {width: 301px;}
#main.sidebarOrientationLeft .sidebar > div fieldset {width: 301px;}
#main.sidebarOrientationRight .sidebar {border-right: 1px solid #b8d3ed;}
}
button, input[type='reset'], input[type='submit'], input[type='button'], .button {font-weight: bold;}
.button, input[type='reset']:not([disabled]), input[type='submit']:not([disabled]), input[type='button']:not([disabled]), button:not([disabled]) {border-color: #cdcdcd #bbbbbb #a9a9a9;box-shadow:  -0 1px 3px 0 rgba(0,0,0,0.1);background-color: #f0f0f0;background-image: -webkit-linear-gradient(90deg,#fcfcfc,#f0f0f0 2px,#e3e3e3);background-image: linear-gradient(180deg,#fcfcfc,#f0f0f0 2px,#e3e3e3);-webkit-transition-property: background-color, background-image, border, box-shadow, color;transition-property: background-color, background-image, border, box-shadow, color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.button .icon, input[type='reset']:not([disabled]) .icon, input[type='submit']:not([disabled]) .icon, input[type='button']:not([disabled]) .icon, button:not([disabled]) .icon {-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.button.buttonPrimary, input[type='submit']:not([disabled]), input[type='button']:not([disabled]).buttonPrimary, button:not([disabled]).buttonPrimary {border-color: #81abd5 #6699cc #4b87c3;box-shadow:  -0 1px 3px rgba(0, 0, 0, .1), 0 0 10px #6699cc;background-color: #ecf3fa;background-image: -webkit-linear-gradient(90deg,#ffffff,#ecf3fa 2px,#d8e7f5);background-image: linear-gradient(180deg,#ffffff,#ecf3fa 2px,#d8e7f5);}
.button:hover, input[type='reset']:not([disabled]):hover, input[type='submit']:not([disabled]):hover, input[type='button']:not([disabled]):hover, button:not([disabled]):hover, .button.buttonPrimary:hover, input[type='submit']:not([disabled]):hover, input[type='button']:not([disabled]).buttonPrimary:hover, button:not([disabled]).buttonPrimary:hover {border-color: #ffb846 #ffaa22 #fd9c00;color: #666666;box-shadow:  -0 1px 3px rgba(0, 0, 0, .1), 0 0 10px #ffaa22;background-color: #fff1e1;background-image: -webkit-linear-gradient(90deg,#fffdfb,#fff1e1 2px,#ffe5c8);background-image: linear-gradient(180deg,#fffdfb,#fff1e1 2px,#ffe5c8);}
.button:hover .icon, input[type='reset']:not([disabled]):hover .icon, input[type='submit']:not([disabled]):hover .icon, input[type='button']:not([disabled]):hover .icon, button:not([disabled]):hover .icon, .button.buttonPrimary:hover .icon, input[type='submit']:not([disabled]):hover .icon, input[type='button']:not([disabled]).buttonPrimary:hover .icon, button:not([disabled]).buttonPrimary:hover .icon {color: #666666;}
.button.active, input[type='button'].active, button.active, .button.active:hover, input[type='button'].active:hover, button.active:hover {border-color: #8c8c8c;color: #f0f0f0;box-shadow:  -0 1px 3px 0 rgba(0,0,0,0.1);background-color: #999999;background-image: -webkit-linear-gradient(#808080,#999999 3px);background-image: linear-gradient(#808080,#999999 3px);text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
.button.active .icon, input[type='button'].active .icon, button.active .icon, .button.active:hover .icon, input[type='button'].active:hover .icon, button.active:hover .icon {color: #f0f0f0;text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
@media only screen and (min-width: 801px) {
.breadcrumbs {background-color: #ffffff;border: 1px solid #cccccc;border-radius: 6px;}
.breadcrumbs > ul > li {padding-left: 0;-webkit-transition-property: max-width;transition-property: max-width;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.breadcrumbs > ul > li:hover {max-width: 100%;}
.breadcrumbs > ul > li:hover > a {background-color: #f1f5fa;position: relative;z-index: 10;}
.breadcrumbs > ul > li:hover > .pointer > span {border-color:transparent #f1f5fa transparent transparent;}
.breadcrumbs > ul > li > .pointer {border-color:transparent #cccccc transparent transparent;border-style:inset solid inset none;border-width: 15px;display: block;height: 0;padding: 0;left: -15px;top: -3px;width: 0;z-index: 20;}
.breadcrumbs > ul > li > .pointer > span {border-color:transparent #ffffff transparent transparent;border-style:inset solid inset none;border-width: 15px;display: block;height: 0;right: -16px;overflow: hidden;position: absolute;text-indent: -9000px;top: -15px;width: 0;-webkit-transition-property: border-color;transition-property: border-color;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.breadcrumbs > ul > li > a {padding-right: 20px;-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.breadcrumbs > ul > li:first-child > a {border-radius:0 4px 4px 0;padding-right: 9px;}
}
.userPanel {border-bottom: 1px solid rgba(0,0,0,0.1);box-shadow:  -0 3px 7px 0 rgba(0,0,0,0.3);}
.userPanel > div > .searchBar > form input[type="search"]:focus, .userPanel > div > .searchBar > form input[type="search"]:active {box-shadow:  -0 0 0 0 transparent;}
@media only screen and (max-width: 800px) {
.userPanel {background-color: #19324c;}
.userPanel > div > .searchBar {background-color: #0c1926;}
}
@media all and (min-width: 801px) {
.container, .message, .dropdownMenu, .attachmentThumbnail, .attachmentThumbnail > img, .attachmentThumbnail > a > img, .box64 .attachmentTinyThumbnail {border-radius: 6px;}
.containerList > li:first-child {border-top-right-radius: 5px;border-top-left-radius: 5px;}
.containerList > li:last-child {border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;}
.message.messageSidebarOrientationLeft .messageContent {border-radius:5px 0 0 5px;}
.message.messageSidebarOrientationRight .messageContent {border-radius:0 5px 5px 0;}
.message.messageReduced .messageContent {border-radius: 5px;}
.messageOptions nav ul.smallButtons > li:first-child a.button {border-top-right-radius: 14px;}
.message.messageSidebarOrientationLeft .messageOptions nav ul.smallButtons > li:last-child a.button, .message.messageReduced .messageOptions nav ul.smallButtons > li:last-child a.button {border-bottom-left-radius: 6px;}
.tabularBox {border-radius: 6px;}
.tabularBox:not(.tabularBoxTitle) .table thead tr:first-child th:first-child {border-top-right-radius: 4px;}
.tabularBox:not(.tabularBoxTitle) .table thead tr:first-child th:last-child {border-top-left-radius: 4px;}
.tabularBox .table tbody tr:last-child td:first-child {border-bottom-right-radius: 4px;}
.tabularBox .table tbody tr:last-child td:last-child {border-bottom-left-radius: 4px;}
.container > .table > tbody > tr:first-child > td:first-child {border-top-right-radius: 4px;}
.container > .table > tbody > tr:first-child > td:last-child {border-top-left-radius: 4px;}
.container > .table > tbody > tr:last-child > td:first-child {border-bottom-right-radius: 4px;}
.container > .table > tbody > tr:last-child > td:last-child {border-bottom-left-radius: 4px;}
.attachmentThumbnail > div {border-radius:0 0 4px 4px;}
.wbbBoardList:not(.wbbBoardListReduced) > li.wbbDepth1 > div {border-top-right-radius: 4px;border-top-left-radius: 4px;}
.wbbBoardList:not(.wbbBoardListReduced) li.wbbLastBoxElement > div {border-bottom-right-radius: 4px;border-bottom-left-radius: 4px;}
.wbbBoardList:not(.wbbBoardListReduced) .tabularBox:not(.wbbDepth1) {border-top-right-radius: 0;border-top-left-radius: 0;}
.wbbBoardListReduced .tabularBox {border-radius: 0;}
.tabMenuContainer > .menu {border-radius:5px 5px 0 0;}
.pollContainer > .formSubmit {border-radius:0 0 5px 5px;}
.codeBox > div {border-radius:0 6px 6px 0;}
}
@media screen and (min-width: 1240px) {
.containerList.doubleColumned > li:last-child {border-radius: 0;}
.containerList.doubleColumned > li:first-child {border-radius:0 5px 0 0;}
.containerList.doubleColumned > li:nth-child(2) {border-top-left-radius: 5px;}
.containerList.doubleColumned > li:nth-child(even):last-child {border-bottom-left-radius: 5px;}
.containerList.doubleColumned > li:nth-child(odd):last-child, .containerList.doubleColumned > li:nth-child(odd):nth-last-child(2) {border-bottom-right-radius: 5px;}
}
@media all and (min-width: 801px) {
.tabMenu {padding: 0 10px;}
.tabMenu > ul {border-top-right-radius: 6px;border-top-left-radius: 6px;}
.tabMenu > ul > li.ui-state-active > a {border-top-left-radius: 6px;border-top-right-radius: 6px;}
.tabMenu > ul > li.ui-state-active > a::before {border: 1px solid #cccccc;border-bottom-left-radius: 6px;border-width:0 0 1px 1px;bottom: -1px;clip: rect(0,6px,6px,0);content: " ";height: 5px;right: -6px;position: absolute;width: 5px;box-shadow:  -2px 1px 0 0 #fcfdfe;}
.tabMenu > ul > li.ui-state-active > a::after {border: 1px solid #cccccc;border-bottom-right-radius: 6px;border-width:0 1px 1px 0;bottom: -1px;clip: rect(0,6px,6px,0);content: " ";height: 5px;position: absolute;left: -6px;width: 5px;box-shadow:  2px 1px 0 0 #fcfdfe;}
}
input[type='text'], input[type='search'], input[type='date'], input[type='datetime'], input[type='email'], input[type='number'], input[type='url'], input[type='password'], textarea, select[multiple] {border-color: #999999 #cccccc #e6e6e6;box-shadow: inset -0 1px 5px 0 rgba(0,0,0,0.1);-webkit-transition-property: background-color, border, box-shadow;transition-property: background-color, border, box-shadow;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
input[type='text']:active, input[type='search']:active, input[type='date']:active, input[type='datetime']:active, input[type='email']:active, input[type='number']:active, input[type='url']:active, input[type='password']:active, textarea:active, select[multiple]:active, input[type='text']:focus, input[type='search']:focus, input[type='date']:focus, input[type='datetime']:focus, input[type='email']:focus, input[type='number']:focus, input[type='url']:focus, input[type='password']:focus, textarea:focus, select[multiple]:focus {box-shadow:  -0 0 5px rgba(255,170,34,0.5) , inset 0 1px 5px rgba(0, 0, 0, .1);}
.formError input[type='text'], .formError input[type='search'], .formError input[type='email'], .formError input[type='number'], .formError input[type='url'], .formError input[type='password'], .formError textarea {background-color: #ffffff;border-color: #c95145;box-shadow:  -0 0 5px rgba(201,81,69,0.5) , inset 0 1px 5px rgba(0, 0, 0, .1);}
.formError input[type='text']:hover, .formError input[type='text']:focus, .formError input[type='search']:hover, .formError input[type='search']:focus, .formError input[type='email']:hover, .formError input[type='email']:focus, .formError input[type='number']:hover, .formError input[type='number']:focus, .formError input[type='url']:hover, .formError input[type='url']:focus, .formError input[type='password']:hover, .formError input[type='password']:focus, .formError textarea:hover, .formError textarea:focus {background-color: #fff9f4;}
.formSuccess input[type='text'], .formSuccess input[type='search'], .formSuccess input[type='email'], .formSuccess input[type='number'], .formSuccess input[type='url'], .formSuccess input[type='password'], .formSuccess textarea {background-color: #ffffff;border-color: #74a446;box-shadow:  -0 0 5px rgba(116,164,70,0.5) , inset 0 1px 5px rgba(0, 0, 0, .1);}
.formSuccess input[type='text']:hover, .formSuccess input[type='text']:focus, .formSuccess input[type='search']:hover, .formSuccess input[type='search']:focus, .formSuccess input[type='email']:hover, .formSuccess input[type='email']:focus, .formSuccess input[type='number']:hover, .formSuccess input[type='number']:focus, .formSuccess input[type='url']:hover, .formSuccess input[type='url']:focus, .formSuccess input[type='password']:hover, .formSuccess input[type='password']:focus, .formSuccess textarea:hover, .formSuccess textarea:focus {background-color: #fff9f4;}
.info, .error, .success, .warning {border-radius: 7px;border-width: 0;box-shadow:  -0 1px 2px rgba(0, 0, 0, .5), inset 0 0 1px rgba(0, 0, 0, .2);}
.info {background-color: #4674a4;background-image: -webkit-linear-gradient(#4674a4,#304d77);background-image: linear-gradient(#4674a4,#304d77);}
.error {background-color: #c95145;background-image: -webkit-linear-gradient(#c95145,#913d37);background-image: linear-gradient(#c95145,#913d37);}
.success {background-color: #74a446;background-image: -webkit-linear-gradient(#74a446,#4d7730);background-image: linear-gradient(#74a446,#4d7730);}
.warning {background-color: #efcb50;background-image: -webkit-linear-gradient(#efcb50,#e9bf2b);background-image: linear-gradient(#efcb50,#e9bf2b);}
.innerError {border-radius: 7px;border-width: 0;box-shadow:  -0 1px 2px rgba(0, 0, 0, .5), inset 0 0 1px rgba(0, 0, 0, .2);background-color: #c95145;background-image: -webkit-linear-gradient(#c95145,#913d37);background-image: linear-gradient(#c95145,#913d37);text-shadow:-0 1px 0 rgba(255,255,255,0.8);text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
@media only screen and (min-width: 801px) {
.message .messageSidebar .userAvatar > a > img {-webkit-box-reflect: below 1px -webkit-gradient(linear,left top,left bottom,from(transparent),color-stop(.6,transparent),to(rgba(0,0,0,0.3)));}
}
.message.dividers .userCredits {border-top: 1px solid #b8d3ed !important;box-shadow: inset -0 1px 0 0 #ffffff;}
.footerContent {text-shadow:-0 -1px 0 rgba(0,0,0,0.8);}
@media only screen and (min-width: 801px) {
.wbbBoardList .wbbLastPost {top: 7px;}
.wbbBoardList .wbbLastPost > div {background-color: #ffffff;border-radius: 6px;padding: 7px;margin-left: 7px;box-shadow: inset -0 1px 1px rgba(0, 0, 0, .1);}
}
@media only screen and (min-width: 801px) {
.messageList .messageGroupStarter > .message.messageSidebarOrientationLeft::before {border-top-right-radius: 6px;content: "";display: block;height: 128px;right: 0;position: absolute;top: 0;width: 128px;background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%);background-image: linear-gradient(135deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%);}
.messageList .messageGroupStarter > .message.messageSidebarOrientationRight::before {border-top-left-radius: 6px;content: "";display: block;height: 128px;left: 0;position: absolute;top: 0;width: 128px;background-image: -webkit-linear-gradient(225deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%);background-image: linear-gradient(225deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, 0) 40%);}
}
.attachmentThumbnail {box-shadow:  -0 1px 1px 0 rgba(0,0,0,0.2);-webkit-transition-property: box-shadow;transition-property: box-shadow;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.attachmentThumbnail:hover {box-shadow:  -0 0 20px 0 #ffaa22;}
.container, div.tabularBox, .wbbBoardList > li.tabularBox, .message {box-shadow:  -0 1px 2px 0 rgba(0,0,0,0.1);}
.container .container, .message .container {box-shadow: none;}
.dropdown .dropdownMenu li {-webkit-transition-property: background-color;transition-property: background-color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.dropdown .dropdownMenu li > a {-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: .1s;transition-duration: .1s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.table th > a {-webkit-transition-property: background-color, color, box-shadow;transition-property: background-color, color, box-shadow;-webkit-transition-duration: .2s;transition-duration: .2s;-webkit-transition-timing-function: linear;transition-timing-function: linear;}
.userTitleBadge {box-shadow:  -0 1px 0 rgba(255, 255, 255, 1), inset 0 1px 0 rgba(0, 0, 0, .2);}
.dashboardBoxSidebarButton > div > .button {-webkit-box-reflect: below 0px -webkit-gradient(linear,left top,left bottom,from(transparent),color-stop(.5,transparent),to(rgba(0,0,0,0.4)));}
.messageText {font-size: 16px;font-family: 'Amiri', Traditional Arabic, serif;}
body {font-family: 'Droid Arabic Kufi';}
@font-face {font-family: 'Droid Arabic Kufi';font-style: normal;font-weight: 400;src: url(https://themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Regular.eot);src: url(https://themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Regular.eot?#iefix) format('embedded-opentype'), url(https://themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Regular.woff2) format('x-woff2'), url(https://themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Regular.woff) format('woff'), url(https://themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Regular.ttf) format('truetype');}


/* === om77 mockup 4 layer, applied 2026-09-15T18:02:23Z === */
/* ==========================================================================
   om77.net , "الساحة في المجلس" style, layer 1: appearance
   --------------------------------------------------------------------------
   Implements the approved mockup 4 on top of the existing WoltLab Burning
   Board 4.1 markup, without touching a single template. Everything here is a
   CSS override keyed on the classes WBB already emits (wbbBoardContainer,
   wbbBoard, containerHeadline, sidebarBoxHeadline, pageHeader, userPanel...),
   so it can be switched on and off by swapping one stylesheet, and it cannot
   break a page's structure.

   Dark mode is carried by `html.om77-dark`, set by the small script that ships
   with this style and remembered per visitor.
   ========================================================================== */

/* Cairo, self-hosted from wcf/fonts/om77 (Google Fonts v31 variable files, OFL). The head preloads
   both files; display: optional means a cold first visit on a slow link paints the system Arabic
   face and never re-wraps (the swap was a CLS of 1.6 on a phone), and every later page has the
   font from cache. This sheet is appended to WoltLab's compiled one at wcf/style/, hence ../fonts. */
@font-face {
  font-family: 'Cairo'; font-style: normal; font-weight: 200 1000; font-display: optional;
  src: url('../fonts/om77/cairo-arabic.woff2?v=31') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Cairo'; font-style: normal; font-weight: 200 1000; font-display: optional;
  src: url('../fonts/om77/cairo-latin.woff2?v=31') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --om-bg: #f3f4f7;
  --om-panel: #ffffff;
  --om-panel2: #f1f2f5;
  --om-line: #e5e6ec;
  --om-ink: #15161a;
  --om-mute: #5f6674;
  --om-acc: #c8102e;
  --om-acc-ink: #ffffff;
  --om-chip: #fdeef1;
  --om-chip-ink: #a80d26;
  --om-green: #0a7a42;
  --om-gold: #b7791f;
  --om-radius: 16px;
  --om-shadow: 0 1px 2px rgba(16, 18, 27, .05), 0 8px 24px rgba(16, 18, 27, .05);
  --om-shadow-sm: 0 1px 2px rgba(16, 18, 27, .06);
}

/* The class is set in the head (headInclude.tpl) before the stylesheet loads, so the first paint is already
   the chosen theme; color-scheme makes the browser's own scrollbars and form controls follow it too. */
html { color-scheme: light; }
html.om77-dark { color-scheme: dark; }
/* WoltLab paints a white square behind every avatar image (transparent PNG avatars showed it as a white
   box on the dark post header, the operator's screenshot of 2026-09-15); the box takes the panel colour. */
html.om77-dark img.userAvatarImage, html.om77-dark .userAvatar img, html.om77-dark .framed img { background-color: var(--om-panel2) !important; }
html.om77-dark .messageSidebar .userAvatar, html.om77-dark .messageSidebar .framed, html.om77-dark .message .framed { background: transparent !important; background-image: none !important; box-shadow: none !important; }
/* The rest of the legacy stylesheet's white boxes, found by measuring every page in the dark theme
   (verify/crawl-pages.js, 2026-09-15): the post editor's toolbar (a light gradient) and its tab strip and
   smiley rows, and the calendar's day and event boxes. Text in them was already the dark theme's light
   ink, so they read as light grey on white until now. */
html.om77-dark .redactor-box, html.om77-dark .redactor-toolbar, html.om77-dark .redactor-toolbar li a,
html.om77-dark .messageTabMenuNavigation > ul, html.om77-dark .messageTabMenu .messageTabMenuContent,
html.om77-dark .messageTabMenu > .container, html.om77-dark .messageTabMenu div[id^="smilies"],
html.om77-dark .conversationUsageBar { background: var(--om-panel2) !important; border-color: var(--om-line) !important; }
html.om77-dark .conversationUsageBar > span { color: #fff; }
html.om77-dark .calendarDay, html.om77-dark .calendarEvents li.box24, html.om77-dark .calendarEvents li.box24 a {
  background: var(--om-panel2) !important; background-image: none !important; border-color: var(--om-line) !important; color: var(--om-ink) !important;
}
html.om77-dark .redactor-toolbar li a:hover, html.om77-dark .redactor-toolbar li a.redactor-act,
html.om77-dark .messageTabMenuNavigation > ul > li.active > a { background: var(--om-chip) !important; color: var(--om-chip-ink) !important; }
html.om77-dark .redactor-editor, html.om77-dark .redactor-box textarea { background: var(--om-bg) !important; color: var(--om-ink) !important; }
/* At phone width a file input and a picture inside a card kept their intrinsic width and ran past the
   right edge (avatar upload by 157px, album covers by 20px, measured at 412px). */
@media (max-width: 600px) {
  .om-shell input[type="file"] { max-width: 100%; width: 100%; box-sizing: border-box; }
  .om-shell .containerList img, .om-shell .albumList img, .om-shell .box128 img, .om-shell .box96 img { max-width: 100%; height: auto; }
  /* the gallery's album covers are floated 295px items with a side margin, which put their right edge
     20px outside a 412px screen: they flow as a centred row of pictures that fit */
  .om-shell .galleryAlbumCoverImages { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; }
  .om-shell .galleryAlbumCoverImages > li { float: none; margin: 0; max-width: 100%; }
  .om-shell .galleryAlbumCoverImages img { max-width: 100%; height: auto; }
}
html.om77-dark {
  --om-bg: #0f1115;
  --om-panel: #171a21;
  --om-panel2: #20242e;
  --om-line: #2a2f3b;
  --om-ink: #eaebef;
  --om-mute: #9aa1ae;
  --om-acc: #ff4d67;
  --om-acc-ink: #1a0308;
  --om-chip: #3a1521;
  --om-chip-ink: #ff8ea0;
  --om-green: #3ecf7a;
  --om-gold: #f5b041;
  --om-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 28px rgba(0, 0, 0, .35);
  --om-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
}

/* ---------- page ---------- */
html, body {
  background: var(--om-bg) !important;
  color: var(--om-ink) !important;
  font-family: 'Cairo', 'Noto Kufi Arabic', 'Segoe UI', Tahoma, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}
body { padding-bottom: 40px; }
a { color: inherit; }
a:hover { color: var(--om-acc); }
.layoutFluid { max-width: 1320px !important; margin: 0 auto !important; padding: 0 18px !important; }

/* ---------- header ---------- */
#pageHeader {
  background: var(--om-panel) !important;
  border-bottom: 1px solid var(--om-line) !important;
  box-shadow: var(--om-shadow-sm) !important;
  position: sticky; top: 0; z-index: 300;
}
#pageHeader .userPanel {
  background: transparent !important;
  border: 0 !important;
  min-height: 52px;
}
#pageHeader .userPanelItems > li > a,
#pageHeader .userPanelItems > li > span { color: var(--om-ink) !important; font-weight: 600; }
#pageHeader .userPanelItems > li > a:hover { color: var(--om-acc) !important; }
.pageHeaderLogo, #logo { padding: 14px 0 10px !important; }
.pageHeaderLogo img, #logo img { max-height: 68px; width: auto; }

/* main navigation as pill tabs */
#mainMenu, .mainMenu, .mainMenu > div, #mainMenu > div,
.boxHeadline.boxSubHeadline, #pageHeader .menuContainer {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#mainMenu, .mainMenu { margin-bottom: 14px; padding: 6px 0 !important; }
#mainMenu ul.menu, .mainMenu ul { display: flex !important; flex-wrap: wrap; gap: 6px; }
#mainMenu ul.menu > li > a,
.mainMenu ul > li > a {
  background: var(--om-panel) !important;
  border: 1px solid var(--om-line) !important;
  border-radius: 999px !important;
  padding: 8px 16px !important;
  font-weight: 700 !important;
  color: var(--om-ink) !important;
  box-shadow: var(--om-shadow-sm);
  transition: background .15s, color .15s, transform .15s;
}
#mainMenu ul.menu > li > a:hover,
.mainMenu ul > li > a:hover { transform: translateY(-1px); color: var(--om-acc) !important; }
#mainMenu ul.menu > li.active > a,
.mainMenu ul > li.active > a {
  background: var(--om-acc) !important;
  border-color: var(--om-acc) !important;
  color: var(--om-acc-ink) !important;
}

/* search box */
#pageHeaderSearch, .searchBar {
  background: var(--om-panel2) !important;
  border: 1px solid var(--om-line) !important;
  border-radius: 999px !important;
  overflow: hidden;
}
#pageHeaderSearch input, .searchBar input { background: transparent !important; border: 0 !important; }

/* The old style paints the page surfaces: #main is pale blue, .content and every board row are
   white. Measured in the browser rather than read off the source, because those colours come from
   the compiled style and win on specificity. The cards below need to float on the page colour, so
   the surfaces are cleared in both themes and only the cards carry a background. */
#main, .content, .sidebar, .contentNavigation, .boxContainer { background: transparent !important; }
.wbbBoard, .wbbBoardContainer > div, .messageGroupList > li { background: var(--om-panel) !important; }
.wbbBoard:hover, .messageGroupList > li:hover { background: var(--om-panel2) !important; }

/* ---------- every box becomes a card ---------- */
.tabularBox,
.wbbBoardContainer,
.sidebarBoxList,
.dashboardBox,
.container,
.marginTop.tabularBox,
fieldset {
  background: var(--om-panel) !important;
  border: 1px solid var(--om-line) !important;
  border-radius: var(--om-radius) !important;
  box-shadow: var(--om-shadow) !important;
  overflow: hidden;
  margin-bottom: 16px !important;
}
.containerHeadline > h3,
.tabularBoxTitle > h1,
.tabularBoxTitle > h2,
.sidebarBoxHeadline > h1,
.sidebarBoxHeadline > h2 {
  font-family: 'Cairo', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0;
}

/* section (category) header rows */
.wbbBoardContainer > .tabularBoxTitle,
.tabularBox > .tabularBoxTitle {
  background: var(--om-panel2) !important;
  border-bottom: 1px solid var(--om-line) !important;
  padding: 12px 16px !important;
}
.wbbBoardContainer > .tabularBoxTitle h2,
.wbbBoardContainer > .tabularBoxTitle h2 a { font-size: 17px !important; font-weight: 800 !important; }

/* board rows */
.wbbBoard {
  border-bottom: 1px solid var(--om-line) !important;
  padding: 14px 16px !important;
  transition: background .15s;
}
.wbbBoard:last-child { border-bottom: 0 !important; }
.wbbBoard:hover { background: var(--om-panel2) !important; }
.wbbBoardDescription { color: var(--om-mute) !important; font-size: 13.5px !important; }
.wbbTopicLink, .containerHeadline h3 a { font-weight: 700 !important; font-size: 16px !important; }

/* the folder glyph becomes a rounded gradient tile */
.wbbBoard .icon-folder-close-alt,
.wbbBoard .icon-folder-close,
.wbbBoard .icon-folder-open-alt,
.wbbBoard .icon48, .wbbBoard .icon32 {
  width: 42px !important; height: 42px !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, var(--om-acc), #8d0b20) !important;
  color: #fff !important;
  display: inline-grid !important; place-items: center !important;
  font-size: 19px !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.35);
}
.wbbBoardNode1 .icon-folder-close-alt { background: linear-gradient(135deg,#ef4444,#a02020) !important; }
.wbbBoardNode2 .icon-folder-close-alt { background: linear-gradient(135deg,#0b8a4b,#075c33) !important; }
.wbbDepth1 .icon-folder-close-alt { background: linear-gradient(135deg,#3b82f6,#1d4ed8) !important; }
.wbbDepth2 .icon-folder-close-alt { background: linear-gradient(135deg,#a855f7,#6d28d9) !important; }

/* counters */
.wbbStats, .statsDataList { color: var(--om-mute) !important; font-size: 13px !important; }
.wbbStats dd, .statsDataList dd { color: var(--om-ink) !important; font-weight: 700 !important; }
.badge {
  border-radius: 999px !important;
  background: var(--om-chip) !important;
  color: var(--om-chip-ink) !important;
  font-weight: 700 !important;
  padding: 2px 10px !important;
  border: 0 !important;
}
.badge.green { background: rgba(11,138,75,.12) !important; color: var(--om-green) !important; }

/* last post block */
.wbbLastPost { color: var(--om-mute) !important; font-size: 13px !important; }
.wbbLastPost .wbbTopicLink { font-size: 13.5px !important; }

/* avatars round everywhere */
.framed img, .userAvatarImage, .box16 > .framed img, .box24 > .framed img,
.box32 > .framed img, .box48 > .framed img, .box64 > .framed img {
  border-radius: 50% !important;
  border: 2px solid var(--om-panel) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}

/* ---------- sidebar ---------- */
.sidebar { padding-top: 0 !important; }
.sidebar .sidebarBoxHeadline { padding: 12px 16px 8px !important; }
.sidebar .sidebarBoxList { padding-bottom: 8px !important; }
.sidebar .sidebarBoxList li { padding: 7px 16px !important; }
.sidebar .sidebarBoxList li:hover { background: var(--om-panel2) !important; }

/* ---------- buttons and forms ---------- */
.button, input[type=submit], button, .buttonPrimary {
  border-radius: 999px !important;
  border: 1px solid var(--om-line) !important;
  background: var(--om-panel) !important;
  color: var(--om-ink) !important;
  font-weight: 700 !important;
  padding: 8px 18px !important;
  box-shadow: var(--om-shadow-sm);
  transition: transform .15s, background .15s;
}
.button:hover, button:hover { transform: translateY(-1px); }
.buttonPrimary, input[type=submit] {
  background: var(--om-acc) !important;
  border-color: var(--om-acc) !important;
  color: var(--om-acc-ink) !important;
}
input[type=text], input[type=password], input[type=email], input[type=search], textarea, select {
  background: var(--om-panel2) !important;
  border: 1px solid var(--om-line) !important;
  border-radius: 12px !important;
  color: var(--om-ink) !important;
  padding: 9px 14px !important;
}
input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--om-acc) !important;
  box-shadow: 0 0 0 3px rgba(200,16,46,.12) !important;
}

/* third-party login buttons: Google first and unmistakable */
.thirdPartyLoginButton { border-radius: 999px !important; font-weight: 700 !important; }
.thirdPartyLoginButton.googleLoginButton,
.thirdPartyLoginButton[class*="google"] { order: -1; }

/* ---------- messages and threads ---------- */
.message, .messageList > li, .wbbPost {
  background: var(--om-panel) !important;
  border: 1px solid var(--om-line) !important;
  border-radius: var(--om-radius) !important;
  box-shadow: var(--om-shadow) !important;
  margin-bottom: 14px !important;
  overflow: hidden;
}
.messageContent, .messageBody { padding: 4px 2px !important; }
.messageHeader, .messageFooter { background: transparent !important; border-color: var(--om-line) !important; }
.messageGroupList > li { border-bottom: 1px solid var(--om-line) !important; padding: 12px 16px !important; }
.messageGroupList > li:hover { background: var(--om-panel2) !important; }

/* ---------- pagination ---------- */
.pageNavigation .pageNavigationList > li > a,
.pageNavigation .pageNavigationList > li > span {
  border-radius: 10px !important;
  border: 1px solid var(--om-line) !important;
  background: var(--om-panel) !important;
  font-weight: 700 !important;
}
.pageNavigation .pageNavigationList > li.active > span {
  background: var(--om-acc) !important; color: var(--om-acc-ink) !important; border-color: var(--om-acc) !important;
}

/* ---------- footer ---------- */
#pageFooter, .footerContent {
  background: var(--om-panel) !important;
  border-top: 1px solid var(--om-line) !important;
  color: var(--om-mute) !important;
  border-radius: var(--om-radius) var(--om-radius) 0 0;
  margin-top: 24px;
}

/* ---------- the feed (om-feed page) ---------- */
.om-compose {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: var(--om-radius);
  box-shadow: var(--om-shadow); padding: 14px 16px; margin: 14px 0 8px;
  display: flex; gap: 12px; align-items: flex-start;
}
.om-compose-form { flex: 1; display: grid; gap: 8px; }
.om-compose-topic, .om-compose-body {
  width: 100%; background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important;
  border-radius: 12px !important; padding: 11px 15px !important; font-family: inherit !important;
  font-size: 15px !important; color: var(--om-ink) !important; resize: vertical;
}
.om-compose-topic { font-weight: 700 !important; }
.om-compose-body { display: none; min-height: 78px; }
.om-compose.om-open-composer .om-compose-body,
.om-compose.om-open-composer .om-compose-row { display: flex; }
.om-compose-row { display: none; gap: 8px; align-items: center; flex-wrap: wrap; }
.om-compose-board {
  flex: 1 1 200px; min-width: 0; background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important;
  border-radius: 999px !important; padding: 9px 14px !important; font-family: inherit !important;
  color: var(--om-ink) !important;
}
.om-compose-send { flex: none; }
.om-compose-hint { font-size: 12.5px; color: var(--om-mute); }


.om-feed-head { border: 0 !important; background: transparent !important; padding: 18px 0 6px !important; }
.om-feed-head h1 { font-size: 26px !important; font-weight: 800 !important; margin: 0 !important; }
.om-feed-stats { display: flex; gap: 18px; color: var(--om-mute); font-size: 13.5px; margin: 6px 0 0; padding: 0; }
.om-feed-stats strong { color: var(--om-ink); font-weight: 800; }

.om-feed-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 16px; }
.om-feed-tabs a {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 999px;
  padding: 8px 18px; font-weight: 700; font-size: 14px; color: var(--om-ink);
  box-shadow: var(--om-shadow-sm); transition: transform .15s, background .15s, color .15s;
}
.om-feed-tabs a:hover { transform: translateY(-1px); color: var(--om-acc); }
.om-feed-tabs a.active { background: var(--om-acc); border-color: var(--om-acc); color: var(--om-acc-ink); }
.om-feed-tabs .om-feed-sections { margin-inline-start: auto; color: var(--om-mute); }

.om-feed { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.om-card {
  background: var(--om-panel) !important; border: 1px solid var(--om-line);
  border-radius: var(--om-radius); box-shadow: var(--om-shadow);
  padding: 16px 18px; transition: transform .15s, box-shadow .15s;
}
.om-card:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(16,18,27,.06), 0 14px 34px rgba(16,18,27,.10); }
.om-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.om-avatar {
  width: 40px; height: 40px; border-radius: 50%; flex: none;
  background: linear-gradient(135deg, var(--om-acc), #8d0b20); color: #fff;
  display: grid; place-items: center; font-weight: 800; font-size: 17px;
  box-shadow: 0 2px 6px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.3);
}
.om-card-who b { display: block; font-size: 15px; font-weight: 700; }
.om-card-meta { font-size: 12.5px; color: var(--om-mute); }
.om-card-board { color: var(--om-chip-ink) !important; font-weight: 700; }
.om-chip {
  margin-inline-start: auto; background: var(--om-chip); color: var(--om-chip-ink);
  border-radius: 999px; padding: 3px 12px; font-size: 12px; font-weight: 700;
}
.om-chip-gold { background: rgba(183,121,31,.14); color: var(--om-gold); margin-inline-start: 0; }
.om-card-title { margin: 0 0 6px !important; font-size: 18px !important; line-height: 1.55 !important; }
.om-card-title a { font-weight: 700; }
.om-card-text { margin: 0 0 12px !important; color: var(--om-mute) !important; font-size: 14.5px !important; line-height: 1.8 !important; }
.om-card-foot { display: flex; align-items: center; gap: 10px; padding-top: 10px; border-top: 1px solid var(--om-line); }
.om-react, .om-stat {
  display: inline-flex; align-items: center; gap: 5px; background: var(--om-panel2);
  border-radius: 999px; padding: 5px 12px; font-size: 13px; font-weight: 700; color: var(--om-ink);
  cursor: pointer; transition: background .15s, transform .15s;
}
.om-react:hover, .om-stat:hover { transform: translateY(-1px); }
.om-react.om-reacted { background: var(--om-chip); color: var(--om-chip-ink); }
.om-open { margin-inline-start: auto; color: var(--om-acc) !important; font-weight: 800; font-size: 13.5px; }
.om-feed-more { display: flex; gap: 10px; justify-content: center; margin: 20px 0 40px; }
@media (min-width: 1100px) { .om-feed { grid-template-columns: 1fr 1fr; } }

/* ---------- the floating controls this style adds ---------- */
#om77ThemeToggle {
  position: fixed; inset-block-end: 22px; inset-inline-start: 22px;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--om-panel); color: var(--om-ink);
  border: 1px solid var(--om-line); box-shadow: var(--om-shadow);
  display: grid; place-items: center; cursor: pointer; z-index: 900;
  font-size: 20px; line-height: 1;
}
/* the composer's "publish then share" switch */
.om-compose-share { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--om-mute); cursor: pointer; }
.om-compose-share input { accent-color: var(--om-acc); width: 16px; height: 16px; }
@media (max-width: 600px) { .om-compose-share span { display: none; } }

/* the unread badge on the rail's watched row */
body.om-shell .om-rail a[data-om-badge] { position: relative; }
body.om-shell .om-rail a[data-om-badge]::after {
  content: attr(data-om-badge); position: absolute; inset-inline-end: 10px; top: 50%; transform: translateY(-50%);
  min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--om-acc); color: #fff;
  font-size: 11px; font-weight: 800; text-align: center; line-height: 1.6;
}

/* ---------- the member menu, and every interactive dropdown, in the dark theme ----------
   The operator, 2026-09-15: "when I click on my profile name on the dark theme the popup menu is not
   dark, it is white and looks ugly". WoltLab paints this dropdown from its own palette: the shell
   #f1f5fa, every row #ffffff, the hover #d8e7f5 and, for the search variant, a white container with
   a white-forced row. None of that is under the layer's dark rules, because the menu is built by
   script AFTER the page renders, so nothing that walks the page at load time ever sees it. Every one
   of those surfaces takes the panel colours here, in both the notification and the search dropdowns. */
html.om77-dark .interactiveDropdown,
html.om77-dark .interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer {
  background-color: var(--om-panel) !important; border-color: var(--om-line) !important; color: var(--om-ink) !important;
}
html.om77-dark .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li,
html.om77-dark .interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li,
html.om77-dark .interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li.dropdownDivider {
  background-color: var(--om-panel) !important; color: var(--om-ink) !important; border-color: var(--om-line) !important;
}
html.om77-dark .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems):hover,
html.om77-dark .interactiveDropdown > .interactiveDropdownItemsContainer > .interactiveDropdownItems > li:not(.loading):not(.noItems).interactiveDropdownItemMarkAsRead,
html.om77-dark .interactiveDropdown[data-source="extendedSearch"] > .interactiveDropdownItemsContainer > .interactiveDropdownItems li:not(.dropdownDivider):hover {
  background-color: var(--om-panel2) !important; background-image: none !important;
}
html.om77-dark .interactiveDropdown .interactiveDropdownHeader,
html.om77-dark .interactiveDropdown .interactiveDropdownShowAll,
html.om77-dark .interactiveDropdown .interactiveDropdownItemsContainer { background-color: var(--om-panel) !important; color: var(--om-ink) !important; }
html.om77-dark .interactiveDropdown a, html.om77-dark .interactiveDropdown .interactiveDropdownItemMessage { color: var(--om-ink) !important; }
html.om77-dark .interactiveDropdown small, html.om77-dark .interactiveDropdown .interactiveDropdownItemTime { color: var(--om-mute) !important; }
/* the plain dropdown menus (the language chooser's siblings, the moderation menu, a board's menu) */
html.om77-dark .dropdownMenu, html.om77-dark .dropdownMenu > li, html.om77-dark .dropdownMenu > li > a,
html.om77-dark .dropdownMenu > li > span { background-color: var(--om-panel) !important; color: var(--om-ink) !important; }
html.om77-dark .dropdownMenu > li:hover, html.om77-dark .dropdownMenu > li > a:hover { background-color: var(--om-panel2) !important; color: var(--om-acc) !important; }
html.om77-dark .dropdownMenu .dropdownDivider { border-color: var(--om-line) !important; }

/* ---------- THE MEMBER MENU, REBUILT ----------
   The operator, 2026-09-15: the popup was white on the dark theme, and once it was dark, "it is
   still ugly". It is WoltLab's own structure and cannot be replaced from a stylesheet, so it is
   re-dressed here: the dropdown becomes a card of the same family as every other card in this style
   (panel, 18px radius, soft shadow), the rows become rounded tiles with a coloured glyph tile, a
   bold title and its sub-links as small chips, the hairline dividers go because spacing does that
   job, and signing out sits at the foot as an accent row. Measured after: one width, one row
   height, no white anywhere in either theme. */
body.om-shell .interactiveDropdownUserMenu {
  width: 340px !important; max-width: calc(100vw - 24px) !important;
  border-radius: 18px !important; border: 1px solid var(--om-line) !important;
  background: var(--om-panel) !important; box-shadow: 0 24px 60px rgba(0, 0, 0, .28) !important;
  padding: 6px !important; overflow: hidden;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownHeader {
  padding: 8px 12px 4px !important; border: 0 !important; background: none !important;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownTitle {
  font-size: 11.5px !important; font-weight: 800 !important; letter-spacing: .04em;
  color: var(--om-mute) !important; text-transform: none;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownItemsContainer { background: none !important; max-height: 70vh !important; }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownItems { padding: 0 !important; margin: 0 !important; }
body.om-shell .interactiveDropdownUserMenu .dropdownDivider { display: none !important; }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownItems > li {
  background: none !important; border: 0 !important; border-radius: 14px !important;
  padding: 2px !important; margin: 0 0 2px !important; transition: background .15s ease;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownItems > li:hover { background: var(--om-panel2) !important; }

/* the member's own card at the top */
body.om-shell .interactiveDropdownUserMenu .box64 { padding: 10px 12px !important; align-items: center; gap: 12px; }
body.om-shell .interactiveDropdownUserMenu .box64 > a.framed, body.om-shell .interactiveDropdownUserMenu .box64 > a.framed img {
  width: 52px !important; height: 52px !important; border-radius: 50% !important; overflow: hidden; background: var(--om-panel2) !important;
}
body.om-shell .interactiveDropdownUserMenu .box64 > a.framed { box-shadow: 0 0 0 2px var(--om-acc); }
body.om-shell .interactiveDropdownUserMenu .box64 h3 { margin: 0 0 2px !important; font-size: 15px !important; font-weight: 800 !important; }
body.om-shell .interactiveDropdownUserMenu .box64 h3 a { color: var(--om-ink) !important; }

/* every other row: a glyph tile, a title, and its links as chips */
body.om-shell .interactiveDropdownUserMenu .box32 { padding: 9px 12px !important; align-items: center; gap: 12px; }
body.om-shell .interactiveDropdownUserMenu .box32 > div:first-child {
  width: 38px !important; height: 38px !important; border-radius: 12px; display: grid; place-items: center;
  background: var(--om-panel2); flex: 0 0 auto;
}
body.om-shell .interactiveDropdownUserMenu .box32 > div:first-child .icon {
  font-size: 17px !important; width: auto !important; height: auto !important; color: var(--om-acc) !important; opacity: 1 !important;
}
body.om-shell .interactiveDropdownUserMenu .box32 h3 { margin: 0 0 3px !important; font-size: 14px !important; font-weight: 800 !important; color: var(--om-ink) !important; }
body.om-shell .interactiveDropdownUserMenu .containerHeadline { min-width: 0; }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownUserMenuLinkList {
  display: flex !important; flex-wrap: wrap; gap: 4px !important; margin: 0 !important; padding: 0 !important; list-style: none !important;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownUserMenuLinkList > li { margin: 0 !important; padding: 0 !important; }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownUserMenuLinkList > li::after { content: none !important; }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownUserMenuLinkList a {
  display: inline-block; padding: 2px 9px; border-radius: 999px; background: var(--om-panel2);
  border: 1px solid var(--om-line); font-size: 11.5px; font-weight: 600; line-height: 1.7;
  color: var(--om-mute) !important; text-decoration: none !important;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownItems > li:hover .interactiveDropdownUserMenuLinkList a { background: var(--om-panel); }
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownUserMenuLinkList a:hover { color: var(--om-acc) !important; border-color: var(--om-acc); }

/* sign out */
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownShowAll {
  margin: 4px 2px 2px !important; border-radius: 12px !important; border: 0 !important;
  background: var(--om-chip) !important; color: var(--om-chip-ink) !important;
  font-weight: 800 !important; font-size: 13.5px !important; padding: 10px !important; text-align: center;
}
body.om-shell .interactiveDropdownUserMenu .interactiveDropdownShowAll:hover { background: var(--om-acc) !important; color: #fff !important; }
body.om-shell .interactiveDropdownUserMenu .pointer, body.om-shell .interactiveDropdownUserMenu .pointer span { border-bottom-color: var(--om-panel) !important; }
@media (max-width: 480px) { body.om-shell .interactiveDropdownUserMenu { width: calc(100vw - 20px) !important; } }

/* ---------- the live voice room ---------- */
body.om-shell .om-voice {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 12px 14px;
  margin-bottom: 12px; box-shadow: var(--om-shadow);
}
body.om-shell .om-voice.om-voice-on { border-color: var(--om-acc); }
body.om-shell .om-voice-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
body.om-shell .om-voice-live {
  display: inline-flex; align-items: center; gap: 6px; font-weight: 800; color: var(--om-acc); font-size: 14px;
}
body.om-shell .om-voice-live::before {
  content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--om-acc);
  box-shadow: 0 0 0 0 rgba(200,16,46,.5); animation: om-live 1.6s ease-out infinite;
}
@keyframes om-live { 70% { box-shadow: 0 0 0 9px rgba(200,16,46,0); } 100% { box-shadow: 0 0 0 0 rgba(200,16,46,0); } }
body.om-shell .om-voice-count { color: var(--om-mute); font-size: 13px; font-weight: 700; }
body.om-shell .om-voice-head .om-voice-join { margin-inline-start: auto; border-radius: 999px !important; padding: 0 16px !important; height: 34px !important; }
body.om-shell .om-voice-seats { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.om-shell .om-voice-seat {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px;
  background: var(--om-panel2); border: 1px solid var(--om-line); font-size: 12.5px; font-weight: 700; color: var(--om-ink);
}
body.om-shell .om-voice-seat.om-voice-me { border-color: var(--om-acc); color: var(--om-acc); }
body.om-shell .om-voice-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--om-green); }
body.om-shell .om-voice-note { margin: 10px 0 0; font-size: 12px; color: var(--om-mute); }
body.om-shell .om-voice audio { display: none; }

/* ---------- the thread summary ---------- */
body.om-shell .om-summary {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 14px 16px;
  box-shadow: var(--om-shadow);
}
body.om-shell .om-summary-head { margin: 0 0 8px; font-size: 15px; font-weight: 800; color: var(--om-ink); }
body.om-shell .om-summary-head span { color: var(--om-mute); font-weight: 600; font-size: 13px; }
body.om-shell .om-summary-list { margin: 0; padding-inline-start: 18px; display: grid; gap: 6px; }
body.om-shell .om-summary-list a { color: var(--om-ink) !important; text-decoration: none !important; line-height: 1.7; }
body.om-shell .om-summary-list a:hover { color: var(--om-acc) !important; }
body.om-shell .om-summary-note { margin: 10px 0 0; font-size: 12px; color: var(--om-mute); }

/* ---------- a poll as a card, the live counters, and the rooms box ---------- */
.om-card .om-poll { margin: 10px 0 4px; display: grid; gap: 6px; }
.om-card .om-poll-q { margin: 0 0 2px; font-weight: 800; color: var(--om-ink); }
.om-card .om-poll-row {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 12px; border-radius: 12px; background: var(--om-panel2); border: 1px solid var(--om-line);
  color: var(--om-ink) !important; text-decoration: none !important; font-weight: 600; overflow: hidden;
}
.om-card .om-poll-row:hover { border-color: var(--om-acc); }
.om-card .om-poll-bar { position: absolute; inset-block: 0; inset-inline-start: 0; background: var(--om-chip); z-index: 0; }
.om-card .om-poll-label, .om-card .om-poll-share { position: relative; z-index: 1; }
.om-card .om-poll-share { font-variant-numeric: tabular-nums; color: var(--om-mute); }
.om-card .om-poll-total { margin: 2px 0 0; font-size: 12.5px; color: var(--om-mute); }
.om-feed-stats .om-pulse strong { color: var(--om-acc); }
.om-feed-stats .om-pulse-online strong::before { content: "\25CF"; font-size: 9px; vertical-align: middle; margin-inline-end: 4px; color: var(--om-green); }
.om-box-rooms .om-rooms { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.om-box-rooms .om-rooms a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px;
  border-radius: 12px; background: var(--om-panel2); border: 1px solid var(--om-line);
  color: var(--om-ink) !important; text-decoration: none !important; font-weight: 700; font-size: 13.5px;
}
.om-box-rooms .om-rooms a:hover { border-color: var(--om-acc); color: var(--om-acc) !important; }
/* The count on a room. White on the green measured 2.02:1 in the dark theme, where --om-green is a
   light green (verify-contrast.js, 2026-09-15). It becomes the chip shape the rest of this style uses:
   the green as the TEXT on the panel, with a green edge, which clears AA in both themes. */
.om-box-rooms .om-room-count {
  min-width: 26px; text-align: center; font-size: 12px; font-weight: 800; padding: 2px 8px;
  border-radius: 999px; background: var(--om-panel); color: var(--om-green); border: 1px solid var(--om-green);
}

/* ---------- the voice note, its player, and a card's photo count ---------- */
.om-compose-glyphs [data-om-kind="voice"].om-recording { color: var(--om-acc); animation: om-pulse 1.1s ease-in-out infinite; }
@keyframes om-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.om-voice-bar { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px; border-radius: 999px; background: var(--om-chip); color: var(--om-chip-ink); font-weight: 700; }
.om-voice-bar .om-voice-time { font-variant-numeric: tabular-nums; }
.om-voice-bar .om-voice-stop { border: 0; background: var(--om-acc); color: #fff; border-radius: 999px; padding: 3px 12px; font-weight: 700; cursor: pointer; }
audio.om-voice-play { display: block; width: 100%; max-width: 420px; margin: 8px 0; }
/* the photo count on a card that leads with one picture of several (mockup 4: "1 / 6" and "+4") */
.om-card .om-has-count { position: relative; }
.om-card .om-photo-count, .om-card .om-photo-more {
  position: absolute; z-index: 2; font-size: 12px; font-weight: 800; color: #fff;
  background: rgba(0,0,0,.55); border-radius: 999px; padding: 3px 9px; backdrop-filter: blur(2px);
}
.om-card .om-photo-count { inset-block-start: 10px; inset-inline-end: 10px; }
.om-card .om-photo-more { inset-block-end: 10px; inset-inline-start: 10px; }

/* ---------- the bar's own light/dark button, the phone bottom bar and the chat sheet ---------- */
/* The mockup carries the theme switch in the top bar; the floating round button stays for a phone,
   where the bar is short and the thumb is at the bottom. */
.om-appbar .om-bar-theme {
  width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--om-line);
  background: var(--om-panel2); color: var(--om-ink); cursor: pointer; display: grid; place-items: center; flex: 0 0 auto;
}
.om-appbar .om-bar-theme::before { content: "\263C"; font-size: 17px; line-height: 1; }
html.om77-dark .om-appbar .om-bar-theme::before { content: "\263E"; }
.om-appbar .om-bar-theme:hover { border-color: var(--om-acc); color: var(--om-acc); }

/* The phone bottom bar: home, sections, the "+" that opens the composer, chat, account. */
.om-bottom {
  position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 950; display: none;
  background: var(--om-panel); border-top: 1px solid var(--om-line);
  padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px));
  grid-template-columns: repeat(5, 1fr); align-items: center; box-shadow: 0 -6px 20px rgba(0,0,0,.08);
}
.om-bottom .om-bottom-item {
  display: grid; place-items: center; gap: 2px; padding: 4px 0; color: var(--om-mute);
  text-decoration: none !important; font-size: 10.5px; font-weight: 700; min-height: 46px;
}
.om-bottom .om-bottom-item svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.om-bottom .om-bottom-item:hover, .om-bottom .om-bottom-item:focus-visible { color: var(--om-acc); }
.om-bottom .om-bottom-mid {
  color: #fff; background: var(--om-acc); border-radius: 999px; width: 52px; height: 40px; justify-self: center; align-self: center;
  box-shadow: 0 6px 16px rgba(200,16,46,.35);
}
.om-bottom .om-bottom-mid span { display: none; }
.om-bottom .om-bottom-mid svg { width: 24px; height: 24px; stroke-width: 2.2; }

/* The chat, pulled up from the bottom of a phone rather than replacing the page. */
.om-chat-sheet {
  position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 960; height: 76vh;
  background: var(--om-panel); border-radius: 18px 18px 0 0; border: 1px solid var(--om-line); border-bottom: 0;
  box-shadow: 0 -18px 50px rgba(0,0,0,.28); display: flex; flex-direction: column;
  transform: translateY(102%); transition: transform .22s ease; visibility: hidden;
}
.om-chat-sheet.om-open { transform: translateY(0); visibility: visible; }
.om-chat-sheet .om-chat-sheet-head {
  display: flex; align-items: center; justify-content: space-between; padding: 10px 14px;
  border-bottom: 1px solid var(--om-line); font-weight: 800; color: var(--om-ink);
}
.om-chat-sheet .om-chat-sheet-close { background: none; border: 0; font-size: 26px; line-height: 1; color: var(--om-mute); cursor: pointer; padding: 0 6px; }
.om-chat-sheet iframe { flex: 1; width: 100%; border: 0; background: var(--om-bg, var(--om-panel)); }
body.om-sheet-open { overflow: hidden; }

@media (max-width: 700px) {
  .om-bottom { display: grid; }
  /* the bottom bar takes the room the floating column used, so nothing sits under it */
  body.om-has-bottom { padding-bottom: 214px !important; }
  body.om-has-bottom #om77ThemeToggle { inset-block-end: 86px; }
  body.om-has-bottom #om77Push { inset-block-end: 146px; }
  body.om-has-bottom #om77Compose { inset-block-end: 86px; }
}
@media (min-width: 701px) { .om-chat-sheet { display: none !important; } }

#om77Compose {
  position: fixed; inset-block-end: 22px; inset-inline-end: 22px;
  height: 48px; padding: 0 20px; border-radius: 999px;
  background: var(--om-acc); color: var(--om-acc-ink);
  border: 0; box-shadow: 0 8px 22px rgba(200,16,46,.35);
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer; z-index: 900;
  font-family: 'Cairo', sans-serif; font-weight: 800; font-size: 15px;
}
#om77Compose:hover { filter: brightness(1.05); }

/* dark mode: repaint what WBB hardcodes.
   Burning Board 4.1 sets literal dark colours on text, headings and links, so a dark background
   alone leaves the board titles and counters unreadable. These rules re-colour the text layer
   without touching the accent, which stays the link colour. */
html.om77-dark body,
html.om77-dark .content,
html.om77-dark .sidebar,
html.om77-dark .tabularBox,
html.om77-dark .wbbBoardContainer,
html.om77-dark .wbbBoard,
html.om77-dark .dashboardBox,
html.om77-dark .sidebarBoxList,
html.om77-dark .message,
html.om77-dark .messageContent,
html.om77-dark .containerHeadline,
html.om77-dark .containerHeadline h3,
html.om77-dark .containerHeadline h3 a,
html.om77-dark .tabularBoxTitle h1,
html.om77-dark .tabularBoxTitle h2,
html.om77-dark .tabularBoxTitle h2 a,
html.om77-dark .sidebarBoxHeadline h1,
html.om77-dark .sidebarBoxHeadline h2,
html.om77-dark .wbbTopicLink,
html.om77-dark .userLink,
html.om77-dark .statsDataList dt,
html.om77-dark .statsDataList dd,
html.om77-dark .wbbStats dt,
html.om77-dark .wbbStats dd,
html.om77-dark .wbbLastPost,
html.om77-dark .wbbLastPost a,
html.om77-dark .sidebarBoxList li,
html.om77-dark .sidebarBoxList li a,
html.om77-dark p, html.om77-dark li, html.om77-dark dt, html.om77-dark dd,
html.om77-dark h1, html.om77-dark h2, html.om77-dark h3, html.om77-dark h4 { color: var(--om-ink) !important; }

html.om77-dark .wbbBoardDescription,
html.om77-dark .datetime,
html.om77-dark small,
html.om77-dark .wbbStats dt,
html.om77-dark .statsDataList dt { color: var(--om-mute) !important; }

html.om77-dark a:hover,
html.om77-dark .wbbTopicLink:hover,
html.om77-dark .containerHeadline h3 a:hover { color: var(--om-acc) !important; }

html.om77-dark .wbbBoard:hover,
html.om77-dark .sidebarBoxList li:hover,
html.om77-dark .messageGroupList > li:hover { background: var(--om-panel2) !important; }

html.om77-dark #mainMenu ul.menu > li > a,
html.om77-dark .mainMenu ul > li > a { background: var(--om-panel2) !important; color: var(--om-ink) !important; }
html.om77-dark #mainMenu ul.menu > li.active > a,
html.om77-dark .mainMenu ul > li.active > a { background: var(--om-acc) !important; color: var(--om-acc-ink) !important; }

/* Burning Board sets literal text colours deep in the tree with selectors more specific than a
   per-element override, so in dark mode the safe rule is to make the whole content tree inherit
   the container colour, then re-mute the secondary text and keep the accent for hover. Icons,
   badges and buttons are excluded because they carry their own palette. */
html.om77-dark .content, html.om77-dark .sidebar, html.om77-dark #main { color: var(--om-ink) !important; }
/* .highlight and mark are excluded for the same reason as .badge: they paint their own
   background and state the foreground that goes with it. Without the exclusion this rule wins on
   specificity (0,7,1 against 0,2,1) and the search hit rendered as the page's light text on the
   yellow marker, measured at 1.32:1 against WCAG's 4.5, which is what the operator reported. */
html.om77-dark .content *:not(.badge):not(.button):not(.buttonPrimary):not([class*="icon"]):not(.tile):not(.highlight):not(mark):not([class*="active"]):not(.om-avatar):not(.om-chat-av):not(.om-av-fallback),
html.om77-dark .sidebar *:not(.badge):not(.button):not([class*="icon"]):not(.highlight):not(mark):not([class*="active"]):not(.om-avatar):not(.om-chat-av):not(.om-av-fallback) { color: inherit !important; }
/* An element carrying "active" is one this layer paints with the accent, and the accent's own ink
   is the only readable colour on it: the feed's active tab measured 2.71:1 and the current page's
   pagination pill 1.90:1, both because `inherit` won. The pill's NUMBER is a child span with no
   class of its own, so it still inherits, which is why the colour is set on the li: inheriting the
   accent ink is exactly the right answer for it. */
html.om77-dark body.om-shell .pageNavigation > ul > li.active,
html.om77-dark body.om-shell .pageNavigation > ul > li.active > span,
html.om77-dark body.om-shell .pageNavigation > ul > li.active > a { color: var(--om-acc-ink) !important; }
html.om77-dark .om-feed-tabs a.active { color: var(--om-acc-ink) !important; }
html.om77-dark .wbbBoardDescription,
html.om77-dark .datetime,
html.om77-dark small,
html.om77-dark .wbbLastPost,
html.om77-dark .wbbStats dt,
html.om77-dark .statsDataList dt { color: var(--om-mute) !important; }
html.om77-dark .content a:hover, html.om77-dark .sidebar a:hover { color: var(--om-acc) !important; }
html.om77-dark .badge { background: var(--om-chip) !important; color: var(--om-chip-ink) !important; }

#om77ShareMenu {
  position: absolute; z-index: 960; background: var(--om-panel); border: 1px solid var(--om-line);
  border-radius: 14px; box-shadow: var(--om-shadow); padding: 6px; display: grid; min-width: 150px;
}
#om77ShareMenu a, #om77ShareMenu button {
  display: block; width: 100%; text-align: start; background: transparent; border: 0;
  padding: 9px 14px; border-radius: 10px; font-family: inherit; font-size: 14px; font-weight: 700;
  color: var(--om-ink); cursor: pointer;
}
#om77ShareMenu a:hover, #om77ShareMenu button:hover { background: var(--om-panel2); color: var(--om-acc); }
.om-share { display: inline-flex; align-items: center; background: var(--om-panel2); border-radius: 999px;
  padding: 5px 12px; cursor: pointer; color: var(--om-ink); }
.om-share:hover { color: var(--om-acc); }

#om77Push {
  position: fixed; inset-block-end: 82px; inset-inline-start: 22px; width: 48px; height: 48px;
  border-radius: 50%; background: var(--om-panel); color: var(--om-mute);
  border: 1px solid var(--om-line); box-shadow: var(--om-shadow); display: grid; place-items: center;
  cursor: pointer; z-index: 900;
}
#om77Push.om77-push-on { color: var(--om-acc); border-color: var(--om-acc); }

#om77Install {
  position: fixed; inset-inline: 12px; inset-block-end: 12px; z-index: 940;
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px;
  box-shadow: var(--om-shadow); padding: 12px 16px; display: flex; gap: 10px; align-items: center;
  font-weight: 700; font-size: 14px;
}
#om77Install span { flex: 1; }
#om77Install button {
  border: 0; border-radius: 999px; padding: 8px 16px; font-family: inherit; font-weight: 800;
  cursor: pointer; font-size: 13.5px;
}
#om77Install .om77-install-yes { background: var(--om-acc); color: var(--om-acc-ink); }
#om77Install .om77-install-no { background: var(--om-panel2); color: var(--om-mute); }

/* the toast the reaction client shows for guests */
#om77Toast {
  position: fixed; inset-block-end: 86px; inset-inline-start: 50%; transform: translateX(50%) translateY(20px);
  background: #15161a; color: #fff; border-radius: 999px; padding: 10px 22px; font-weight: 700;
  font-size: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.35); opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; z-index: 950;
}
#om77Toast.om77-toast-show { opacity: 1; transform: translateX(50%) translateY(0); }
.om-react-count { font-variant-numeric: tabular-nums; }
.om-react-more { color: var(--om-mute); font-weight: 800; }

/* dark mode: repaint what WBB hardcodes */
html.om77-dark #pageHeader,
html.om77-dark .tabularBox,
html.om77-dark .wbbBoardContainer,
html.om77-dark .sidebarBoxList,
html.om77-dark .dashboardBox { background: var(--om-panel) !important; }
html.om77-dark .tabularBoxTitle { background: var(--om-panel2) !important; }
html.om77-dark img.userAvatarImage { filter: none; }
html.om77-dark .message, html.om77-dark .wbbPost { background: var(--om-panel) !important; }

/* phone */
@media (max-width: 800px) {
  .layoutFluid { padding: 0 12px !important; }
  .wbbBoard { padding: 12px !important; }
  #om77Compose { inset-block-end: 16px; inset-inline-end: 16px; }
  #om77ThemeToggle { inset-block-end: 16px; inset-inline-start: 16px; }
}

/* ==========================================================================
   Layer 3: the sections strip, infinite scrolling, mentions and the live room
   --------------------------------------------------------------------------
   These are om77's own pages rather than overrides of WoltLab markup, so they
   are written as plain classes and read the same tokens as everything above.
   ========================================================================== */

/* ---------- the sections strip on the feed ---------- */
.om-sections {
  background: var(--om-panel);
  border: 1px solid var(--om-line);
  border-radius: var(--om-radius);
  box-shadow: var(--om-shadow-sm);
  padding: 14px 16px;
  margin: 0 0 18px;
}
.om-sections-title {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 700;
  color: var(--om-mute);
}
.om-sections-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.om-section {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--om-panel2);
  border: 1px solid var(--om-line);
  border-radius: 999px;
  padding: 5px 6px 5px 14px;
  max-width: 100%;
}
.om-section-name {
  color: var(--om-ink) !important;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 210px;
}
.om-section-follow {
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 3px 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  background: var(--om-acc);
  color: var(--om-acc-ink);
}
.om-section-on { border-color: var(--om-green); }
.om-section-on .om-section-follow {
  background: transparent;
  color: var(--om-green);
  box-shadow: inset 0 0 0 1px var(--om-green);
}

/* ---------- infinite scrolling ---------- */
.om-feed-sentinel { height: 1px; }
.om-feed-end {
  text-align: center;
  color: var(--om-mute);
  padding: 18px 0 30px;
}
.om-feed-next.om-loading { opacity: .6; pointer-events: none; }

/* ---------- the mention menu ---------- */
.om-compose { position: relative; }
.om-mention-menu {
  position: absolute;
  z-index: 40;
  inset-inline-start: 16px;
  bottom: 62px;
  min-width: 210px;
  max-height: 240px;
  overflow-y: auto;
  list-style: none;
  margin: 0;
  padding: 6px;
  background: var(--om-panel);
  border: 1px solid var(--om-line);
  border-radius: 12px;
  box-shadow: var(--om-shadow);
}
.om-mention-menu li {
  padding: 7px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 600;
}
.om-mention-menu li.active,
.om-mention-menu li:hover { background: var(--om-chip); color: var(--om-chip-ink); }

/* ---------- the live room ---------- */
.om-chat-head .om-chat-lead { color: var(--om-mute); margin: 4px 0 0; }
.om-chat {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 18px;
  align-items: start;
  margin-top: 16px;
}
.om-chat-rooms,
.om-chat-room {
  background: var(--om-panel);
  border: 1px solid var(--om-line);
  border-radius: var(--om-radius);
  box-shadow: var(--om-shadow-sm);
  padding: 14px;
}
.om-chat-rooms h2,
.om-chat-room-head h2 { margin: 0 0 10px; font-size: 16px; }
.om-chat-rooms ul { list-style: none; margin: 0 0 12px; padding: 0; }
.om-chat-rooms li { margin-bottom: 6px; }
.om-chat-rooms li a {
  display: block;
  position: relative;
  padding: 9px 12px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--om-ink) !important;
  background: var(--om-panel2);
}
.om-chat-rooms li.active a { background: var(--om-chip); box-shadow: inset 0 0 0 1px var(--om-acc); }
.om-chat-rooms li a b { display: block; font-size: 14px; }
.om-chat-rooms li a small { display: block; color: var(--om-mute); font-size: 12px; }
.om-chat-count {
  position: absolute;
  inset-inline-end: 10px;
  top: 10px;
  background: var(--om-green);
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  min-width: 20px;
  text-align: center;
  padding: 1px 6px;
}
.om-chat-dm { display: block; text-align: center; }
.om-chat-room-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--om-line);
  padding-bottom: 8px;
}
.om-chat-online { color: var(--om-green); font-size: 13px; font-weight: 700; }
.om-chat-stream {
  list-style: none;
  margin: 0;
  padding: 12px 2px;
  height: 460px;
  overflow-y: auto;
  scroll-behavior: smooth;
}
.om-chat-msg {
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--om-panel2);
  margin-bottom: 8px;
  max-width: 78%;
}
.om-chat-msg b { font-size: 13px; color: var(--om-acc); margin-inline-end: 8px; }
.om-chat-msg time { font-size: 11px; color: var(--om-mute); }
.om-chat-text { display: block; overflow-wrap: anywhere; }
.om-chat-mine { margin-inline-start: auto; background: var(--om-chip); }
.om-chat-typing { min-height: 20px; margin: 0 0 6px; color: var(--om-mute); font-size: 13px; }
.om-chat-form { display: flex; gap: 8px; }
.om-chat-form input {
  flex: 1 1 auto;
  min-width: 0;
  border: 1px solid var(--om-line);
  background: var(--om-panel2);
  color: var(--om-ink);
  border-radius: 999px;
  padding: 10px 16px;
  font: inherit;
}
.om-chat-login { margin: 0; }

@media (max-width: 800px) {
  .om-chat { grid-template-columns: 1fr; }
  .om-chat-stream { height: 56vh; }
  .om-section-name { max-width: 150px; }
}

/* ---------- the feed's side column: the archive, what is trending, who is ahead ---------- */
.om-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 20px;
  align-items: start;
}
.om-main { min-width: 0; }
.om-side { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 14px; }
.om-box {
  background: var(--om-panel);
  border: 1px solid var(--om-line);
  border-radius: var(--om-radius);
  box-shadow: var(--om-shadow-sm);
  padding: 14px 16px;
}
.om-box h2 {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 800;
  color: var(--om-mute);
  letter-spacing: .2px;
}
.om-box-lead { margin: 0 0 6px; font-weight: 600; line-height: 1.6; }
.om-box-lead a { color: var(--om-ink) !important; text-decoration: none; }
.om-box-lead a:hover { color: var(--om-acc) !important; }
.om-box-meta { margin: 0 0 8px; color: var(--om-mute); font-size: 13px; }
.om-box-cta { margin: 0; }
.om-box-cta a { color: var(--om-acc) !important; font-weight: 700; text-decoration: none; font-size: 13px; }
.om-box-today { border-inline-start: 3px solid var(--om-gold); }
.om-box-room .button { display: block; text-align: center; margin-top: 4px; }

.om-tag-list, .om-leader-list { list-style: none; margin: 0; padding: 0; }
.om-tag-list li,
.om-leader-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--om-line);
}
.om-tag-list li:last-child,
.om-leader-list li:last-child { border-bottom: 0; }
.om-tag-list li a { flex: 1 1 auto; color: var(--om-chip-ink) !important; font-weight: 700; text-decoration: none; }
.om-tag-list li b,
.om-leader-list li b { color: var(--om-mute); font-weight: 600; font-size: 12px; }
.om-leader-list li a { flex: 1 1 auto; color: var(--om-ink) !important; font-weight: 600; text-decoration: none; }
.om-leader-list .om-avatar { width: 26px; height: 26px; font-size: 12px; }
/* An initial is painted on its own circle, so its ink belongs to that circle and not to the text around it: the
   dark blanket above skips .om-avatar, and the script sets the fallbacks' ink per colour (omInk). Gold in both
   themes needs dark ink: white computes 3.64:1 on #b7791f and 1.88:1 on #f5b041, this ink 4.97:1 and 9.62:1, and
   in dark mode the blanket had turned it light grey on the gold at 3.06:1 (verify-contrast.js, 2026-09-15). */
.om-leader-list li:first-child .om-avatar { background: var(--om-gold); color: #15161a; }
/* In dark mode the accent lightens to a pink-red, and a white initial on the start of the circle's gradient read
   3.23:1 (measured 2026-09-15 on the story rail's "+"); the circle keeps the brand's deep red there (white 5.88:1
   on #c8102e). The first leader stays gold because the leader rule above is more specific (0,3,1 against 0,2,1),
   whatever the order. */
html.om77-dark .om-avatar { background: linear-gradient(135deg, #c8102e, #8d0b20); }

@media (max-width: 1000px) {
  .om-layout { grid-template-columns: 1fr; }
  .om-side { position: static; }
}

/* ---------- the phone: nothing may be wider than the screen ----------
   A grid or flex ITEM defaults to min-width:auto, which means it refuses to shrink below the widest
   unbreakable thing inside it. One member's post containing a long URL, or a long Arabic word with
   no break opportunity, therefore widens the whole feed and pushes the entire page sideways.
   Measured at 412 px before this block: the document was 461 px wide and every element on the page
   sat 48 px off screen, on the device this refactor exists for. The overflow was traced to the card
   list, not to any container, which is exactly what min-width:auto looks like from the outside. */
.om-feed, .om-feed > li, .om-main, .om-side, .om-box,
.om-card-head, .om-card-who, .om-card-foot, .om-chat-msg, .om-section {
  min-width: 0;
}
.om-card-title, .om-card-text, .om-card-who b, .om-box-lead, .om-box h2,
.om-tag-list li a, .om-leader-list li a, .om-section-name {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.om-card-foot { flex-wrap: wrap; row-gap: 8px; }
.om-card-meta { overflow-wrap: anywhere; }

/* The page itself, so a single stubborn third-party element cannot shift the whole layout. */
html, body { max-width: 100%; overflow-x: hidden; }

@media (max-width: 560px) {
  .om-card { padding: 13px 14px; }
  .om-feed-stats { flex-wrap: wrap; row-gap: 4px; }
  .om-section-name { max-width: 44vw; }

  /* One swipeable row rather than a wall of chips. Twelve sections wrapped is 240 px of screen
     before the first card, which on a 900 px phone means a member's first impression of the
     refactored forum is a list of section names, which is what they left in 2015. */
  .om-sections { padding: 10px 0 10px 12px; }
  .om-sections-title { padding-inline-start: 4px; }
  .om-sections-list {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
    padding-bottom: 4px;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  .om-sections-list::-webkit-scrollbar { display: none; }
  .om-section { flex: 0 0 auto; scroll-snap-align: start; }
}

/* ---------- the phone header ----------
   WoltLab positions the user panel ABSOLUTELY so it sits in a corner of a wide header. On a phone
   there is no corner: measured at 412 px, #topMenu and #mainMenu both begin at y=1 and the sign-in
   link is painted straight over the menu. Making the panel static on a narrow screen puts the two
   rows back in order, and letting the menu scroll sideways keeps it one row instead of a wall of
   pills that pushes the feed below the fold. */
@media (max-width: 700px) {
  #pageHeader { position: static !important; height: auto !important; }
  #topMenu.userPanel {
    position: static !important;
    height: auto !important;
    overflow: visible !important;
  }
  #topMenu .userPanelItems {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
    padding: 6px 12px !important;
  }
  #topMenu #userLogin { width: auto !important; }
  #search { position: static !important; margin: 0 12px 6px !important; }

  #mainMenu { overflow: visible !important; }
  #mainMenu > ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    gap: 6px;
  }
  #mainMenu > ul::-webkit-scrollbar { display: none; }
  #mainMenu > ul > li { flex: 0 0 auto; }

  .navigationHeader, #wcf1.navigation {
    overflow-x: auto !important;
    white-space: nowrap;
  }
}

/* The floating compose button and the two round controls sit over the page, so the last card needs
   room to clear them. Without this the final thread in the feed is permanently half covered on a
   phone, which reads as a broken page rather than as a button. The column on the start side is the
   bell over the theme toggle, 22 + 48 + 12 + 48 = 130px tall: the room must be at least that, or the
   last control of a page (the comment form's send button, found by the journey on a blog entry at
   412px) can never be scrolled clear of it. */
@media (max-width: 700px) {
  body { padding-bottom: 150px !important; }
}

/* ---------- the sign-in link landing page ---------- */
.om-loginlink {
  max-width: 560px;
  margin: 40px auto;
  background: var(--om-panel);
  border: 1px solid var(--om-line);
  border-radius: var(--om-radius);
  box-shadow: var(--om-shadow);
  padding: 28px 30px;
  text-align: center;
}
.om-loginlink h1 { margin: 0 0 10px; font-size: 22px; }
.om-loginlink-lead { margin: 0 0 20px; color: var(--om-mute); line-height: 1.8; }
.om-loginlink-actions { margin: 0; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.om-loginlink-ok { border-top: 3px solid var(--om-green); }
.om-loginlink-used,
.om-loginlink-expired { border-top: 3px solid var(--om-gold); }
.om-loginlink-banned { border-top: 3px solid var(--om-acc); }

/* ==========================================================================
   THE SHELL, added 2026-09-14 after the operator compared the copy with mockup 4 side by side
   and scored it 10/100. He was right, and the screenshots said exactly why: every feature had
   been built and then dropped underneath the 2012 WoltLab chrome. The feed's own cards were
   styled; the header, the navigation, the board pages and the thread pages were not touched at
   all, so the first thing anybody saw was the old logo, the old tab bar and a grey table.
   Restyling the feed and leaving the shell is the same mistake as fixing one instance of a bug
   class: the surface the visitor actually lands on was never in scope, and it should have been.

   Mockup 4 is three columns under one app bar: 250px of navigation, the content, and a 330px
   column of live room, chat, trending and leaderboard. The forum already has two of those three
   (section#content and aside.sidebar); this adds the app bar and the navigation rail and makes
   the row a grid, so every page in the forum gets the layout, not just the feed.
   ========================================================================== */

/* ---------- the app bar ---------- */

/* The legacy chrome goes away VISUALLY but must not leave the DOM. #topMenu.userPanel carries the
   sign-in state that both the member and the verification harnesses read, and an element with
   display:none has an empty innerText, so hiding it would break the harnesses and the sign-in
   check together. The bar below therefore ADOPTS #topMenu rather than replacing it. */
body.om-shell #logo,
body.om-shell #mainMenu,
body.om-shell #pageHeader > div > nav.navigationHeader { display: none !important; }
body.om-shell #pageHeader {
  min-height: 0 !important; padding: 0 !important; margin: 0 !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
}

.om-appbar {
  position: sticky; top: 0; z-index: 300;
  display: flex; align-items: center; gap: 14px;
  padding: 9px 18px;
  background: var(--om-panel);
  border-bottom: 1px solid var(--om-line);
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
  font-family: 'Cairo', 'Noto Kufi Arabic', 'Noto Sans Arabic UI', sans-serif;
}
.om-appbar .om-brand {
  display: flex; align-items: center; gap: 9px;
  font-weight: 800; font-size: 17px; color: var(--om-ink); white-space: nowrap;
}
.om-appbar .om-brand .om-mark {
  width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
  background: var(--om-acc); color: var(--om-acc-ink); font-weight: 800; font-size: 16px;
}
.om-appbar .om-navlink {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 13px; border-radius: 11px; font-weight: 700; font-size: 14px;
  background: var(--om-panel2); color: var(--om-ink); white-space: nowrap;
}
.om-appbar .om-navlink:hover { background: var(--om-chip); color: var(--om-chip-ink); }

/* The smart search. It is a real form posting to the forum's own search, so it works today and
   becomes the semantic search of plan item 3.9 by changing where it posts, not by being rebuilt. */
.om-appbar .om-search {
  flex: 1 1 auto; min-width: 0;
  display: flex; align-items: center; gap: 9px;
  padding: 8px 15px; border-radius: 13px;
  background: var(--om-panel2); border: 1px solid var(--om-line);
  color: var(--om-mute); font-size: 13.5px;
}
.om-appbar .om-search input {
  flex: 1 1 auto; min-width: 0;
  border: 0; background: none; outline: none; font: inherit; color: var(--om-ink);
  font-family: inherit;
}
.om-appbar .om-search input::placeholder { color: var(--om-mute); }
.om-appbar .om-search kbd {
  font: inherit; font-size: 11.5px; font-weight: 700;
  padding: 3px 8px; border-radius: 7px;
  background: var(--om-panel); border: 1px solid var(--om-line); color: var(--om-mute);
}
.om-appbar .om-tools { display: flex; align-items: center; gap: 9px; margin-inline-start: auto; }
.om-appbar .om-btn-new {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 15px; border-radius: 12px; white-space: nowrap;
  background: var(--om-acc); color: var(--om-acc-ink) !important;
  font-weight: 800; font-size: 14px; border: 0; cursor: pointer;
}
.om-appbar .om-btn-new:hover { filter: brightness(1.08); }

/* #topMenu is moved in here, so its list has to stop being a full-width bar and become the
   cluster of round buttons the mockup has on the left of the app bar. */
body.om-shell .om-appbar #topMenu,
body.om-shell .om-appbar #topMenu > div {
  position: static !important; width: auto !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; background: none !important;
  border: 0 !important; box-shadow: none !important;
}
body.om-shell .om-appbar .userPanelItems {
  display: flex !important; align-items: center; gap: 7px;
  margin: 0 !important; padding: 0 !important; list-style: none; float: none !important;
}
body.om-shell .om-appbar .userPanelItems > li { float: none !important; margin: 0 !important; }
body.om-shell .om-appbar .userPanelItems > li > a {
  display: inline-flex !important; align-items: center; gap: 6px;
  padding: 7px 11px !important; border-radius: 11px;
  background: var(--om-panel2); color: var(--om-ink) !important;
  font-weight: 700; font-size: 13.5px; line-height: 1.1; white-space: nowrap;
}
body.om-shell .om-appbar .userPanelItems > li > a:hover {
  background: var(--om-chip); color: var(--om-chip-ink) !important;
}
body.om-shell .om-appbar .userPanelItems .badge {
  background: var(--om-acc); color: var(--om-acc-ink); border-radius: 999px;
  padding: 1px 7px; font-size: 11px; font-weight: 800;
}

/* ---------- the three column row ---------- */

body.om-shell #main { padding-top: 18px !important; background: none !important; }
body.om-shell .om-grid {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr) 330px;
  gap: 20px;
  max-width: 1360px;
  margin: 0 auto;
  align-items: start;
}
/* min-width:0 on every grid child, because a grid item defaults to min-width:auto and a single
   long Arabic word or a wide table then makes the whole row wider than the screen. This exact
   defect put a 461px page on a 412px phone once already. */
body.om-shell .om-grid > * { min-width: 0; }
body.om-shell .om-grid.om-2col { grid-template-columns: 250px minmax(0, 1fr); }
body.om-shell .om-grid > #content { width: auto !important; float: none !important; }
body.om-shell .om-grid > aside.sidebar { width: auto !important; float: none !important; }

/* ---------- the same layout before the script runs (Lighthouse CLS 0.98 on a phone) ----------
   header.tpl puts the shell classes on <body> at parse time, so these rules apply at the first
   paint: the row is a grid by structure (WoltLab: #main > div > div holds #content and the
   sidebar), the rail's column and the side column are reserved by explicit placement, the app
   bar's height is held by a placeholder until the script inserts the bar (om-built), and the
   feed's side column stays hidden inside #content until the script lifts it into column 3. */
body.om-shell #main > div > div {
  display: grid; grid-template-columns: 250px minmax(0, 1fr) 330px; gap: 20px;
  max-width: 1360px; margin: 0 auto; align-items: start;
}
body.om-shell #main > div > div > * { min-width: 0; }
body.om-shell #main > div > div > .om-rail { grid-column: 1; grid-row: 1 / span 40; }
body.om-shell #main > div > div > #content { grid-column: 2; grid-row: 1 / span 40; width: auto !important; float: none !important; }
body.om-shell #main > div > div > aside.sidebar,
body.om-shell #main > div > div > .om-side { grid-column: 3; grid-row: 1 / span 40; width: auto !important; float: none !important; }
body.om-shell:not(#tplOmFeed) #main > div > div:not(:has(> aside.sidebar)) { grid-template-columns: 250px minmax(0, 1fr); }
body.om-shell #content > .om-side { display: none; }
body.om-shell:not(.om-built)::before { content: ""; display: block; height: 76px; } /* measured: the built bar is 76px at 1440, 209px (guest) and 219px (member) at 412 */
body.om-shell:not(.om-built) #pageHeader { display: none !important; } /* the old header never paints; the bar adopts its panel */
/* and once built, nothing of the old header may paint either: the extended main menu's mega
   dropdowns inside it painted at 1,100px for the 380 ms before WoltLab's script hid them, which
   pushed #main down and back (two shifts of 0.7 and 0.9). Only #topMenu, the member panel the bar
   adopts, is exempt, so a page whose script never runs still shows the sign-in link. */
body.om-shell #pageHeader > div > *:not(#topMenu) { display: none !important; }
@media (max-width: 1100px) {
  body.om-shell #main > div > div,
  body.om-shell:not(#tplOmFeed) #main > div > div:not(:has(> aside.sidebar)) { grid-template-columns: minmax(0, 1fr); }
  body.om-shell #main > div > div > * { grid-column: auto !important; grid-row: auto !important; }
}
@media (max-width: 760px) {
  body.om-shell:not(.om-built)::before { height: 209px; }
  body.om-shell.om77-member:not(.om-built)::before { height: 219px; }
}

/* contrast: the muted grey on white read 3.4:1 on the feed's counters and the footer links */
body.om-shell .om-feed-stats span, body.om-shell #footerNavigation a, body.om-shell .styleChooser a { color: var(--om-mute) !important; }

/* the language chooser sat at 0x0 until its flag image arrived, then took 54x41 and wrapped the
   member panel onto a second row 400 ms after the bar was built (the last 0.16 of CLS) */
body.om-shell .om-appbar #pageLanguageContainer { min-width: 54px; min-height: 41px; }
body.om-shell .om-appbar #pageLanguageContainer img.iconFlag { width: 30px; height: 21px; }
body.om-shell .om-card-author { display: contents; }
body.om-shell .om-card-who b a { color: inherit; text-decoration: none; }
body.om-shell .om-card-who b a:hover, body.om-shell .om-status-who a:hover, body.om-shell .om-chat-who a:hover { color: var(--om-acc); }
body.om-shell .om-status-who a, body.om-shell .om-chat-who a { color: inherit; text-decoration: none; }

/* the calendar's week list pins the day's birthday count absolutely at the corner of the day,
   where an event title of any length runs under it (measured on a phone: two overlaps on one
   screen); the count is a line of its own now */
body.om-shell .calendarWeekDays > li > a.calendarBirthdays { position: static !important; display: inline-block; margin: 2px 0 4px; font-size: 12.5px; color: var(--om-mute); }
body.om-shell .calendarWeekDays > li { position: static; }

/* the language chooser's boxFlag carries an <h3> with the language name that the bar painted white
   on white at 46x60 (a phone found it as invisible text); only the flag shows */
body.om-shell .om-appbar #pageLanguageContainer .boxFlag h3, body.om-shell .om-appbar #pageLanguageContainer .boxFlag > div > div { display: none !important; }
body.om-shell .om-appbar #pageLanguageContainer .boxFlag { display: flex; align-items: center; justify-content: center; }
/* on a phone a box title or a section name wraps rather than being cut with an ellipsis */
@media (max-width: 760px) {
  body.om-shell .sidebarBoxHeadline h3, body.om-shell .sidebarBoxHeadline h3 a, body.om-shell .om-board-name, body.om-shell .boardList h3 a { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
}

/* contrast on a post: the timestamp and the thread navigation buttons read 3:1 on white */
body.om-shell .messageHeadline .datetime, body.om-shell .messageHeadline p, body.om-shell .contentNavigation .button, body.om-shell nav.contentNavigation ul > li.button > a { color: var(--om-mute) !important; }

/* what a member's day showed, 2026-09-14: an icon glued to its label on the social sign-in
   buttons and the blog archive, sub-board folder icons enlarged by the board-tile rule, list
   headlines cut mid-word */
body.om-shell .thirdPartyLoginButton .icon, body.om-shell .blogArchive a .icon, body.om-shell a > .icon.icon16:not(:only-child), body.om-shell .button > .icon:not(:only-child) { margin-inline-end: 6px; }
body.om-shell .wbbSubBoards .icon, body.om-shell .wbbSubBoards .icon16 { width: 16px !important; height: 16px !important; font-size: 14px !important; line-height: 16px !important; border-radius: 4px; margin-inline-end: 6px; }
body.om-shell .wbbSubBoards > li { display: flex; align-items: center; gap: 4px; }
/* The board row. WoltLab lays it out with absolute boxes sized in percent of the row (stats
   16%, last post 34%), designed for a 900px row; inside the three-column shell the row is
   550px, so the counters truncated ("491,091" lost its last digit) and the last-post box ran
   85px tall in a 73px row and its date line sat on the next board. The markup is
   span.icon + div(containerHeadline, wbbStats, aside.wbbLastPost, ul.wbbSubBoards); the div
   becomes display:contents so its children take grid cells. */
body.om-shell .wbbBoardList .wbbBoard { display: grid !important; grid-template-columns: 42px minmax(0, 1fr) minmax(150px, 190px); column-gap: 14px; row-gap: 4px; align-items: center; padding: 12px 14px !important; }
body.om-shell .wbbBoardList .wbbBoard > .icon { grid-column: 1; grid-row: 1 / span 2; margin: 0 !important; align-self: center; }
body.om-shell .wbbBoardList .wbbBoard > div { display: contents; }
body.om-shell .wbbBoardList .wbbBoard > div > .containerHeadline { grid-column: 2; grid-row: 1; min-width: 0; margin: 0 !important; }
body.om-shell .wbbBoardList .wbbBoard > div > .containerHeadline h3, body.om-shell .wbbBoardList .wbbBoard > div > .containerHeadline h3 a { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; }
body.om-shell .wbbBoardList .wbbStats { grid-column: 2; grid-row: 2; position: static !important; width: auto !important; margin: 0 !important; display: flex; flex-wrap: wrap; gap: 2px 14px; }
body.om-shell .wbbBoardList .wbbStats > dl { display: flex; align-items: baseline; gap: 5px; }
body.om-shell .wbbBoardList .wbbStats > dl > dt, body.om-shell .wbbBoardList .wbbStats > dl > dd { width: auto !important; overflow: visible !important; white-space: nowrap; float: none !important; text-overflow: clip !important; }
body.om-shell .wbbBoardList .wbbStats > dl > dt { order: 2; font-weight: 400; }
body.om-shell .wbbBoardList .wbbStats > dl > dd { order: 1; font-variant-numeric: tabular-nums; }
body.om-shell .wbbBoardList .wbbLastPost { grid-column: 3; grid-row: 1 / span 2; position: static !important; width: auto !important; margin: 0 !important; min-width: 0; }
body.om-shell .wbbBoardList .wbbLastPost > div { display: flex; align-items: flex-start; gap: 8px; }
body.om-shell .wbbBoardList .wbbLastPost > div > .framed { flex: 0 0 auto; }
body.om-shell .wbbBoardList .wbbLastPost > div > div { min-width: 0; flex: 1; }
body.om-shell .wbbBoardList .wbbLastPost > div > div > p, body.om-shell .wbbBoardList .wbbLastPost > div > div > small { display: block; width: auto !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.om-shell .wbbBoardList .wbbLastPost > div > div > small time { white-space: nowrap; }
body.om-shell .wbbBoardList .wbbSubBoards, body.om-shell .wbbBoardList .wbbUsersOnline { grid-column: 2 / span 2; grid-row: 3; margin: 0 !important; }
body.om-shell .wbbBoardList .wbbSubBoards + .wbbUsersOnline { grid-row: 4; }
/* WoltLab's phone sheet turns the counters inline with ":" and "," pseudo separators, which read
   "44,274, المواضيع:" once the number comes first; and it hides the board icon under 800px */
body.om-shell .wbbBoardList .wbbStats dt::after, body.om-shell .wbbBoardList .wbbStats dd::after, body.om-shell .wbbBoardList .wbbStats dt::before, body.om-shell .wbbBoardList .wbbStats dd::before { content: none !important; }
/* a sub-board list is indented 40px by WoltLab; in a 550px column that is a fifth of the row */
body.om-shell .wbbBoardList .wbbBoardContainer > ul { padding: 0 !important; }
/* the last-post line: the member and the time each on their own line rather than an ellipsis eating the time */
body.om-shell .wbbBoardList .wbbLastPost > div > div > small { white-space: normal !important; overflow: visible !important; line-height: 1.45; }
body.om-shell .wbbBoardList .wbbLastPost > div { padding: 0 !important; }
body.om-shell .wbbBoardList .wbbLastPost > div > div > p { margin: 0 0 2px !important; }
body.om-shell .wbbBoardList .wbbLastPost > div > div > small time { display: inline; }
@media (max-width: 760px) {
  body.om-shell .wbbBoardList .wbbBoard { grid-template-columns: 36px minmax(0, 1fr); row-gap: 4px; }
  body.om-shell .wbbBoardList .wbbBoard > .icon { display: inline-grid !important; }
  body.om-shell .wbbBoardList .wbbBoard > .icon { align-self: start; width: 36px !important; height: 36px !important; font-size: 16px !important; }
  body.om-shell .wbbBoardList .wbbBoard > .icon { grid-row: 1; }
  body.om-shell .wbbBoardList .wbbLastPost { grid-column: 2; grid-row: 3; }
  body.om-shell .wbbBoardList .wbbSubBoards, body.om-shell .wbbBoardList .wbbUsersOnline { grid-column: 2; grid-row: 4; }
  body.om-shell .wbbBoardList .wbbSubBoards + .wbbUsersOnline { grid-row: 5; }
}
body.om-shell .membersList h3, body.om-shell .containerHeadline h3, body.om-shell .galleryAlbumList h3, body.om-shell .filebaseFileList h3, body.om-shell .blogEntryList h3, body.om-shell .box48 > div > h3, body.om-shell .box64 > div > h3 { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

/* the sidebar's mini calendars: seven weekday names in 270px wrapped mid-word; the script drops
   the definite article and the header shrinks to fit */
body.om-shell .sidebar .calendarMonthView > .calendarMonthViewHeader > li, body.om-shell .om-side .calendarMonthView > .calendarMonthViewHeader > li { font-size: 10.5px; padding: 4px 0; white-space: nowrap; overflow: hidden; letter-spacing: -0.2px; }
body.om-shell .sidebar .calendarMonthView .calendarWeekDays > li { padding: 3px 0; font-size: 12px; }
/* the gallery's album strip arrows: WoltLab paints two 16px sky-blue bars; here they are chips */
body.om-shell .gallerySidebarBoxImageNavigation > ul > li:first-child, body.om-shell .gallerySidebarBoxImageNavigation > ul > li:last-child { background: var(--om-chip) !important; border-radius: 8px; width: 22px; text-align: center; }
body.om-shell .gallerySidebarBoxImageNavigation > ul > li:first-child > .icon, body.om-shell .gallerySidebarBoxImageNavigation > ul > li:last-child > .icon { color: var(--om-chip-ink) !important; padding: 30px 3px !important; }
body.om-shell .gallerySidebarBoxImageNavigation > ul > li:nth-child(2) { right: 25px !important; }
/* the collapsed button group on a phone (the list glyph beside a post, a profile, a wall entry) is
   a chip, not a bare glyph */
body.om-shell nav.jsMobileNavigation.buttonGroupNavigation > a.dropdownLabel { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--om-panel); border: 1px solid var(--om-line); box-shadow: var(--om-shadow-sm); }
body.om-shell nav.jsMobileNavigation.buttonGroupNavigation > a.dropdownLabel > .icon { font-size: 16px; color: var(--om-ink); }
@media (max-width: 760px) {
  /* WoltLab pins the post avatar absolutely on a phone, so the flex row did not reserve its
     space and the member's name ran under it */
  body.om-shell .wbbPost.message .messageSidebar .userAvatar { position: static !important; right: auto !important; top: auto !important; }
  body.om-shell .wbbPost.message .messageSidebar { padding: 10px 12px 8px !important; }
}

/* the floating compose button has no business on the sign-in and registration pages (a guest
   there is sent back to sign in), and on a phone it covered the form's submit row; the page also
   keeps a strip clear at the bottom so the last row can scroll above the floating controls */
body.om-shell#tplLogin #om77Compose, body.om-shell#tplRegister #om77Compose, body.om-shell#tplOmLoginRequest #om77Compose, body.om-shell#tplLostPassword #om77Compose { display: none !important; }
@media (max-width: 760px) {
  body.om-shell #content { padding-bottom: 88px !important; }
  body.om-shell#tplLogin .formSubmit, body.om-shell#tplRegister .formSubmit { margin-bottom: 24px; }
}

/* a sidebar list headline (recent activity, newest members, latest files) wraps to two lines and
   stops there, instead of an ellipsis cutting a topic title mid-word at 121px */
body.om-shell .sidebarBoxList .sidebarBoxHeadline h3 { white-space: normal !important; overflow: hidden !important; text-overflow: clip !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.4; overflow-wrap: anywhere; word-break: break-word; }
body.om-shell .sidebarBoxList .sidebarBoxHeadline h3 a, body.om-shell .sidebarBoxList .sidebarBoxHeadline p, body.om-shell .sidebarBoxList .sidebarBoxHeadline p a, body.om-shell .sidebarBoxList .sidebarBoxHeadline small { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

/* the "new" badge on a post is pinned by WoltLab at the header's top-left corner, over the end of a
   long subject line (measured on a phone: the subject box and the badge box overlapped by 48px);
   in the card it is a chip in the flow, after the subject */
body.om-shell .message .newMessageBadge { position: static !important; display: inline-block !important; margin: 2px 0 4px !important; top: auto !important; left: auto !important; right: auto !important; border-radius: 999px !important; padding: 2px 10px !important; font-size: 12px !important; box-shadow: none !important; }
body.om-shell .message .newMessageBadge::before { content: none !important; }

/* the similar-threads box cuts a title with an ellipsis (the journey's a#wcf6 finding); it wraps */
body.om-shell .wbbSimilarThreadList .box48 > div > p:first-child > a, body.om-shell .wbbInlineSimilarThreadList a { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; }

/* 2026-09-14 evening, the operator's dark-mode screenshots. The bulky headline was WoltLab's
   legend in Trebuchet MS, which falls to a system Arabic face; every legend is Cairo now, and the
   headline weights come down from 800 to 700 across the page. */
body.om-shell legend, body.om-shell fieldset > legend { font-family: 'Cairo', 'Noto Kufi Arabic', 'Segoe UI', Tahoma, sans-serif !important; font-weight: 700 !important; font-size: 16px !important; color: var(--om-ink) !important; text-shadow: none !important; letter-spacing: 0; }
body.om-shell .sidebar legend, body.om-shell .om-side legend, body.om-shell .sidebar .boxHeadline h3, body.om-shell .sidebar h3.legend { font-size: 14px !important; font-weight: 700 !important; }
body.om-shell h1, body.om-shell .boxHeadline h1, body.om-shell#tplUser header.userHeadline h1, body.om-shell .om-feed-head h1 { font-weight: 700 !important; }
body.om-shell .containerHeadline h3, body.om-shell .tabularBoxTitle h2, body.om-shell .tabularBoxTitle h2 a, body.om-shell .sidebarBoxHeadline h3, body.om-shell .om-grid > aside.sidebar .dashboardBox > h3, body.om-shell .om-grid > aside.sidebar .dashboardBox > legend, body.om-shell .wbbTopicLink { font-weight: 700 !important; }
/* the profile's tab strip was a light-blue bar with near-white text in dark mode; the strip takes
   the panel colours in both modes, one size for every tab, the active one raised */
body.om-shell .tabMenu > ul, body.om-shell .tabMenu ul.ui-tabs-nav { background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important; border-radius: 12px 12px 0 0; padding: 4px 4px 0 !important; }
body.om-shell .tabMenu > ul > li > a, body.om-shell .tabMenu ul.ui-tabs-nav > li > a { font-size: 14.5px !important; font-weight: 600 !important; color: var(--om-mute) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-shadow: none !important; padding: 9px 14px !important; }
body.om-shell .tabMenu > ul > li.ui-state-active > a, body.om-shell .tabMenu ul.ui-tabs-nav > li.ui-state-active > a, body.om-shell .tabMenu > ul > li.active > a { background: var(--om-panel) !important; color: var(--om-ink) !important; font-weight: 700 !important; border: 1px solid var(--om-line) !important; border-bottom-color: var(--om-panel) !important; }
body.om-shell .tabMenu > ul > li > a:hover { color: var(--om-ink) !important; }
body.om-shell .tabMenuContent, body.om-shell .ui-tabs-panel { background: var(--om-panel) !important; border: 1px solid var(--om-line) !important; border-top: 0 !important; border-radius: 0 0 12px 12px; color: var(--om-ink) !important; }
/* the breadcrumb's pointer was WoltLab's 15px border triangle, white on the dark theme; a small
   muted chevron between crumbs instead */
body.om-shell .breadcrumbs .pointer { display: none !important; }
body.om-shell .breadcrumbs > ul > li { display: inline-flex !important; align-items: center; }
body.om-shell .breadcrumbs > ul > li:not(:first-child)::before { content: "\2039"; color: var(--om-mute); font-size: 15px; line-height: 1; margin: 0 4px 0 6px; opacity: .8; }
body.om-shell .breadcrumbs > ul > li > a { display: inline-block !important; padding: 4px 2px !important; font-size: 12.5px; }
/* the language flag sat in a 36px white circle; a plain small flag with rounded corners */
body.om-shell .om-appbar .userPanelItems > li:has(> a > img.iconFlag) > a { background: transparent !important; border: 0 !important; box-shadow: none !important; width: 36px; height: 36px; }
body.om-shell .om-appbar .userPanelItems > li:has(> a > img.iconFlag) > a:hover { background: var(--om-panel2) !important; }
body.om-shell .om-appbar .userPanelItems > li > a > img.iconFlag, body.om-shell .om-appbar #pageLanguageContainer img.iconFlag, body.om-shell .om-appbar #pageLanguageContainer > a > img.iconFlag { width: 22px !important; height: 15px !important; padding: 0 !important; border: 0 !important; border-radius: 3px !important; background: none !important; box-shadow: 0 0 0 1px var(--om-line); object-fit: cover; }
/* the brand mark is the site's own logo (the favicon's mark), not a letter tile */
.om-appbar .om-brand .om-mark img { width: 30px; height: 30px; border-radius: 8px; display: block; object-fit: contain; image-rendering: auto; }
.om-appbar .om-brand .om-mark:has(img) { background: none !important; box-shadow: none !important; padding: 0 !important; }
/* the info chip kept WoltLab's glyph but not the room it reserves for it; in the RTL sheet the
   glyph sits at the right edge, so the chip's start padding makes room and the glyph is smaller */
body.om-shell p.info, body.om-shell .info, body.om-shell p.success, body.om-shell p.warning, body.om-shell p.error { padding: 12px 46px 12px 16px !important; }
body.om-shell p.info::after, body.om-shell .info::after { content: "\f05a" !important; }
body.om-shell p.success::after { content: "\f058" !important; }
body.om-shell p.warning::after { content: "\f071" !important; }
body.om-shell p.error::after { content: "\f05e" !important; }
body.om-shell p.info::after, body.om-shell .info::after, body.om-shell p.success::after, body.om-shell p.warning::after, body.om-shell p.error::after { font-family: FontAwesome !important; font-size: 18px !important; width: 24px !important; height: 24px !important; line-height: 24px !important; margin-top: -12px !important; right: 14px !important; color: var(--om-acc) !important; text-shadow: none !important; display: block !important; text-align: center; }
body.om-shell p.success::after { color: var(--om-green) !important; }
/* the footer: no clock glyph before the date, the "to top" arrow as a small round chip */
body.om-shell #pageFooter .icon-time { display: none !important; }
body.om-shell #pageFooter .toTopLink > a, body.om-shell #pageFooter a.toTopLink { display: inline-grid !important; place-items: center; width: 28px !important; height: 28px !important; padding: 0 !important; border-radius: 50% !important; background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important; color: var(--om-mute) !important; }
body.om-shell #pageFooter .icon-arrow-up { font-size: 12px !important; color: inherit !important; }
body.om-shell #pageFooter .copyright, body.om-shell #pageFooter .footerContent p { color: var(--om-mute); font-size: 12.5px; }

/* dark mode, the light patches the operator's screenshots and the dark hunt found: WoltLab paints
   the post body, the last-post box of a board row, the calendar cells and comment replies with
   literal light colours that the text rules above did not reach */
html.om77-dark .messageContent, html.om77-dark .messageBody, html.om77-dark .messageText, html.om77-dark .messageQuickReplyContent,
html.om77-dark .commentResponse, html.om77-dark .commentList > li, html.om77-dark .commentResponseList > li,
html.om77-dark .wbbLastPost > .box24, html.om77-dark .wbbLastPost > div,
html.om77-dark .calendarMonthView > .calendarWeeks > li, html.om77-dark .calendarMonthView > .calendarWeeks > li:nth-child(even),
html.om77-dark .calendarWeekDays > li, html.om77-dark .calendarFullMonthView > .calendarWeeks > li > div,
html.om77-dark .containerList > li, html.om77-dark .tabularBox > table > tbody > tr > td, html.om77-dark .tabularBox > table > tbody > tr:nth-child(even) > td,
html.om77-dark .messageGroupList > li, html.om77-dark .dataList, html.om77-dark .userProfileAbout, html.om77-dark .attachmentFileList, html.om77-dark .attachmentThumbnailList { background: var(--om-panel) !important; background-image: none !important; border-color: var(--om-line) !important; color: var(--om-ink) !important; }
html.om77-dark .calendarToday, html.om77-dark .calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarToday { background: var(--om-chip) !important; }
html.om77-dark .calendarMonthView > .calendarWeeks > li > .calendarWeekDays > li.calendarWeekend:not(.calendarToday), html.om77-dark .calendarMonthView > .calendarWeeks > li:hover { background: var(--om-panel2) !important; }
html.om77-dark .calendarMonthView > .calendarMonthViewHeader, html.om77-dark .calendarMonthView > .calendarMonthViewHeader > li { background: var(--om-panel2) !important; border-color: var(--om-line) !important; color: var(--om-ink) !important; }
html.om77-dark .calendarMonthView .calendarWeekDays > li { border-color: var(--om-line) !important; }
html.om77-dark .calendarOffMonth, html.om77-dark .calendarOffMonth > h3 > a { color: var(--om-mute) !important; opacity: .7; }
/* the followed-sections row could only be scrolled sideways, with its scrollbar hidden; it wraps */
body.om-shell .om-sections-list { display: flex !important; flex-wrap: wrap !important; overflow: visible !important; gap: 8px !important; max-height: none !important; }
/* the composer's glyphs are icon-font glyphs now, not emoji */
.om-compose-glyphs button .icon { font-size: 17px !important; color: var(--om-mute) !important; width: auto !important; height: auto !important; line-height: 1 !important; }
.om-compose-glyphs button:hover .icon { color: var(--om-acc) !important; }
.om-compose-thumb .icon { font-size: 22px; color: var(--om-mute); display: block; }
/* the rail: sub-boards under their board, and the old site's page menu as a third box */
.om-rail .om-cat-list .om-cat-sub { display: flex; flex-direction: column; margin: 0 0 4px; }
.om-rail .om-cat-list a.om-cat-child { font-size: 12.5px; font-weight: 500; padding: 4px 34px 4px 8px; color: var(--om-mute); border-radius: 8px; }
.om-rail .om-cat-list a.om-cat-child:hover, .om-rail .om-cat-list a.om-cat-child.om-on { color: var(--om-ink); background: var(--om-panel2); }
.om-rail .om-cat-list a.om-cat-child small { margin-inline-start: auto; font-size: 11px; opacity: .8; }
.om-rail .om-links .om-link-group { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; }
.om-rail .om-links .om-link-head { display: block; padding: 7px 10px; border-radius: 10px; font-size: 13.5px; font-weight: 600; color: var(--om-ink); min-width: 0; }
.om-rail .om-links .om-link-head:hover { background: var(--om-panel2); color: var(--om-acc); }
.om-rail .om-links .om-link-toggle { width: 28px; height: 28px; border: 0; background: transparent; color: var(--om-mute); cursor: pointer; border-radius: 50%; display: inline-grid; place-items: center; }
.om-rail .om-links .om-link-toggle:hover { background: var(--om-panel2); color: var(--om-ink); }
.om-rail .om-links .om-link-toggle .icon { font-size: 12px; transition: transform .15s; }
.om-rail .om-links .om-open .om-link-toggle .icon { transform: rotate(180deg); }
.om-rail .om-links .om-link-subs { grid-column: 1 / -1; display: none; flex-direction: column; padding: 0 10px 6px 0; }
.om-rail .om-links .om-open .om-link-subs { display: flex; }
.om-rail .om-links .om-link-subs a { font-size: 12.5px; padding: 4px 14px 4px 8px; color: var(--om-mute); border-radius: 8px; }
.om-rail .om-links .om-link-subs a:hover { color: var(--om-ink); background: var(--om-panel2); }

/* ---------- the market ---------- */
/* the sell form, one screen, photos first */
.om-sell { max-width: 720px; margin: 0 auto; display: grid; gap: 14px; }
.om-sell-card { background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 18px; padding: 16px; display: grid; gap: 14px; }
.om-sell-photos { display: grid; place-items: center; gap: 4px; padding: 26px 12px; border: 2px dashed var(--om-line); border-radius: 14px; cursor: pointer; color: var(--om-mute); text-align: center; }
.om-sell-photos:hover { border-color: var(--om-acc); color: var(--om-ink); }
.om-sell-photos .icon { font-size: 30px !important; color: var(--om-acc) !important; width: auto !important; height: auto !important; }
.om-sell-photos b { color: var(--om-ink); font-size: 16px; }
.om-sell-photos input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.om-sell-preview { display: flex; flex-wrap: wrap; gap: 8px; }
.om-sell-preview span { position: relative; width: 96px; height: 96px; border-radius: 12px; overflow: hidden; background: var(--om-panel2); }
.om-sell-preview span:first-child::after { content: "الغلاف"; position: absolute; right: 6px; bottom: 6px; background: var(--om-acc); color: var(--om-acc-ink); font-size: 11px; padding: 1px 7px; border-radius: 999px; }
.om-sell-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
.om-sell-field { display: grid; gap: 6px; }
.om-sell-field > span { font-size: 13.5px; font-weight: 700; color: var(--om-ink); }
.om-sell-field > small { color: var(--om-mute); font-size: 12px; }
.om-sell-field input[type="text"], .om-sell-field input[type="tel"], .om-sell-field select, .om-sell-field textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--om-line) !important; border-radius: 12px !important; padding: 10px 14px !important; background: var(--om-panel2) !important; color: var(--om-ink) !important; font-size: 15px !important; box-shadow: none !important; }
.om-sell-field textarea { min-height: 120px; resize: vertical; }
.om-sell-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: end; }
.om-sell-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.om-sell-chip { position: relative; cursor: pointer; }
.om-sell-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.om-sell-chip b { display: inline-block; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--om-line); background: var(--om-panel2); color: var(--om-ink); font-weight: 600; font-size: 13.5px; }
.om-sell-chip input:checked + b { background: var(--om-acc); color: var(--om-acc-ink); border-color: var(--om-acc); }
.om-sell-chip input:focus-visible + b { outline: 2px solid var(--om-acc); outline-offset: 2px; }
.om-sell-check { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--om-ink); padding-bottom: 10px; }
.om-sell-send { width: 100%; padding: 13px 20px !important; font-size: 16px !important; border-radius: 999px !important; }
.om-sell-note { margin: 0; color: var(--om-acc); font-weight: 700; }
@media (max-width: 640px) { .om-sell-row { grid-template-columns: 1fr; } }
/* the listing strip under a title in a market board */
.om-listing-strip { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 6px 0 2px; }
.om-listing-thumb { flex: none; width: 64px; height: 48px; border-radius: 10px; overflow: hidden; background: var(--om-panel2); display: block; }
.om-listing-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.om-listing-price { font-weight: 800; color: var(--om-green); font-size: 15px; white-space: nowrap; }
.om-chip-price { background: rgba(11,138,75,.12) !important; color: var(--om-green) !important; font-weight: 800; }
.om-chip-sold, .om-sold .om-chip-sold { background: var(--om-ink) !important; color: var(--om-panel) !important; font-weight: 800; }
.om-listing-strip .om-chip-sold, .om-listing .om-chip-sold { display: none; }
.om-listing-strip.om-sold .om-chip-sold, .om-listing.om-sold .om-chip-sold { display: inline-flex; }
.om-listing-strip.om-sold .om-listing-price, .om-listing.om-sold .om-listing-price { text-decoration: line-through; color: var(--om-mute); }
.om-listing-strip.om-sold .om-listing-thumb { opacity: .55; }
/* the listing card on the thread page */
.om-listing { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; padding: 14px 16px; background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; border-inline-start: 4px solid var(--om-green); }
.om-listing.om-sold { border-inline-start-color: var(--om-mute); }
.om-listing-main { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.om-listing .om-listing-price { font-size: 22px; }
.om-listing-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.om-listing-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.om-listing-actions .button { border-radius: 999px !important; padding: 8px 14px !important; }
.om-listing-wa { background: #25d366 !important; color: #fff !important; border-color: #25d366 !important; }
.om-listing-flip[data-sold="1"] { background: var(--om-chip) !important; color: var(--om-chip-ink) !important; }
/* the sell entry points */
.om-sell-button { border-radius: 999px !important; }
.om-compose-sell { display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 999px; background: rgba(11,138,75,.12); color: var(--om-green) !important; font-weight: 800; font-size: 13px; text-decoration: none; }
.om-compose-sell .icon { color: inherit !important; font-size: 14px !important; width: auto !important; height: auto !important; }
.om-board-sell { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: 8px; padding: 2px 10px; border-radius: 999px; background: rgba(11,138,75,.12); color: var(--om-green) !important; font-size: 12px; font-weight: 800; text-decoration: none; vertical-align: middle; }
.om-board-sell:hover { background: var(--om-green); color: #fff !important; }

/* the operator's board-list screenshot, 2026-09-14 evening: a sidebar box's legend floated on the
   card's top edge (the browser's legend-on-the-border rendering) and the list inside was a second
   card; the breadcrumb and the page title share one line; the rail's sections read the size of
   the rail's first box */
body.om-shell .sidebar fieldset.dashboardBox > legend, body.om-shell .om-side fieldset.dashboardBox > legend { float: right; width: 100%; box-sizing: border-box; margin: 0 0 8px !important; padding: 0 !important; }
body.om-shell .sidebar fieldset.dashboardBox > div, body.om-shell .om-side fieldset.dashboardBox > div { clear: both; }
body.om-shell .sidebar .dashboardBox .sidebarBoxList, body.om-shell .sidebar .dashboardBox .dataList, body.om-shell .sidebar .dashboardBox > div > ul, body.om-shell .sidebar .dashboardBox > div > dl { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; }
body.om-shell .sidebar .dashboardBox .sidebarBoxList > li { padding: 8px 0 !important; border-bottom: 1px solid var(--om-line); }
body.om-shell .sidebar .dashboardBox .sidebarBoxList > li:last-child { border-bottom: 0; }
body.om-shell #content > .breadcrumbs { float: left; margin: 0 !important; padding: 10px 0 0 !important; max-width: 60%; }
body.om-shell #content > .breadcrumbs + .boxHeadline, body.om-shell #content > .breadcrumbs ~ .boxHeadline:first-of-type { overflow: hidden; }
@media (max-width: 760px) { body.om-shell #content > .breadcrumbs { float: none; max-width: none; padding: 0 0 6px !important; } }
.om-rail .om-cat-list a { font-size: 14.5px; padding: 9px 11px; }
.om-rail .om-cat-list a.om-cat-child { font-size: 13.5px; padding: 6px 36px 6px 10px; }
.om-rail .om-cat-list a small, .om-rail .om-cat-list a.om-cat-child small { font-size: 11.5px; }

/* ---------- the navigation rail ---------- */

.om-rail { display: flex; flex-direction: column; gap: 14px; }
.om-rail .om-box {
  background: var(--om-panel); border: 1px solid var(--om-line);
  border-radius: 16px; padding: 12px;
}
.om-rail .om-box h4 {
  display: flex; align-items: center; gap: 8px;
  margin: 2px 4px 10px; font-size: 14px; font-weight: 800; color: var(--om-ink);
}
.om-rail .om-nav { display: flex; flex-direction: column; gap: 2px; }
.om-rail .om-nav a {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 11px; border-radius: 11px;
  font-size: 14.5px; font-weight: 700; color: var(--om-ink);
}
.om-rail .om-nav a:hover { background: var(--om-panel2); }
.om-rail .om-nav a.om-on { background: var(--om-chip); color: var(--om-chip-ink); }
.om-rail .om-nav a small { margin-inline-start: auto; color: var(--om-mute); font-size: 12px; font-weight: 700; }
.om-rail .om-nav .om-tile {
  width: 28px; height: 28px; border-radius: 9px; flex: none;
  display: grid; place-items: center; color: #fff; font-size: 14px; font-weight: 800;
  box-shadow: 0 2px 6px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.32);
}
.om-rail .om-cats a {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 9px; border-radius: 10px; font-size: 13.5px; font-weight: 700; color: var(--om-ink);
}
.om-rail .om-cats a:hover { background: var(--om-panel2); }
.om-rail .om-cats a small { margin-inline-start: auto; color: var(--om-mute); font-size: 11.5px; font-weight: 700; }
.om-rail .om-cats .om-dot {
  width: 22px; height: 22px; border-radius: 7px; flex: none;
  display: grid; place-items: center; color: #fff; font-size: 11px; font-weight: 800;
}

/* The rail is navigation, and on a phone the content comes first: the mockup's phone view has no
   rail at all, it has the bottom bar this style already adds. */
@media (max-width: 1100px) {
  body.om-shell .om-grid,
  body.om-shell .om-grid.om-2col { grid-template-columns: minmax(0, 1fr); } /* the two-column form kept its 250px rail column on a phone and squeezed the sign-in link card to 250px */
  body.om-shell .om-rail { display: none; }
  body.om-shell .om-grid > aside.sidebar { order: 3; }
}

/* ---------- the shell, round 2: what the first screenshot proved wrong ----------
 * Measured, not guessed. A Playwright pass over the rendered page reported
 * `.om-grid` computing to `display: table-row` and `#content` to `display: table-cell`, so the
 * three column grid had never applied at all: WoltLab lays that row out as a TABLE, and a plain
 * `display:grid` in an appended layer loses to it. Everything downstream of that, the rail being
 * 642px wide, the feed cards wrapping one word per line, followed from this one fact.
 * The other four came out of the same pass: the legacy search form is position:absolute at 0,0 and
 * was sitting on top of the new bar, #topMenu kept an 980px width and pushed the tools cluster to
 * x=-78, and the breadcrumb rendered twice. */
body.om-shell #main > div { display: block !important; }
body.om-shell .om-grid { display: grid !important; }
body.om-shell .om-grid > #content,
body.om-shell .om-grid > aside.sidebar,
body.om-shell .om-grid > .om-rail { display: block !important; }
body.om-shell .om-grid > .om-rail { display: flex !important; }

/* The forum's own search box is absolutely positioned in the old header and would sit on top of
   the new bar. The app bar carries a real search, so this one goes. */
body.om-shell #pageHeader #search,
body.om-shell #pageHeader .searchBar { display: none !important; }

/* #topMenu is adopted into the tools cluster, so it must stop being a full-width bar. Its inner
   .layoutFluid wrapper is what actually carried the 980px. */
body.om-shell .om-appbar #topMenu,
body.om-shell .om-appbar #topMenu > div,
body.om-shell .om-appbar #topMenu .layoutFluid {
  display: flex !important; align-items: center; width: auto !important; max-width: none !important;
  float: none !important; position: static !important;
}

/* The mockup has no breadcrumb bar. Keeping the element is still right on a deep thread, so it
   becomes one quiet line instead of a boxed strip, and the duplicate at the foot of the page goes. */
body.om-shell .breadcrumbs {
  background: none !important; border: 0 !important; box-shadow: none !important;
  padding: 0 0 8px !important; margin: 0 !important; font-size: 12.5px;
}
body.om-shell .breadcrumbs ul { padding: 0 !important; }
body.om-shell .breadcrumbs a { color: var(--om-mute) !important; }
/* WoltLab caps a crumb at 30% of the line and cuts the rest with an ellipsis, so an album named
   "الحب دوله والعواذل جواسيس" read as "الحب دو…"; the line wraps instead and a crumb keeps its name */
body.om-shell .breadcrumbs > ul { display: flex; flex-wrap: wrap; align-items: center; row-gap: 2px; }
body.om-shell .breadcrumbs > ul > li { float: none !important; max-width: 100% !important; }
body.om-shell .breadcrumbs > ul > li > a { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; }
body.om-shell #main .breadcrumbs ~ .breadcrumbs,
body.om-shell .om-grid > #content > .breadcrumbs + * ~ .breadcrumbs { display: none !important; }

/* The page itself, so the shell sits on the mockup's ground rather than on white. */
body.om-shell { background: var(--om-bg) !important; }
body.om-shell #pageHeader { position: static !important; }

/* ---------- the shell, round 3: the 980px min-width ----------
 * The tools cluster was 1110px wide and began at x=-78, i.e. off the left edge of the bar, and the
 * search collapsed to 0px because there was no room left. The cause was not a width at all:
 * WoltLab's fluid layout carries `min-width: 980px` on .layoutFluid to stop the old three column
 * page collapsing, and `width: auto !important` cannot beat a min-width. That is why the element
 * reported `width: 980px` as its USED value while its only visible child was 285px wide, and why
 * the first fix looked applied and changed nothing. getComputedStyle reports used values, so
 * "width: 980px" was never evidence that a width had been set.
 * The forum's own search box also turned out to live INSIDE #topMenu rather than in #pageHeader,
 * so it travelled into the new bar when the panel was adopted and the earlier rule missed it. */
body.om-shell .om-appbar #topMenu,
body.om-shell .om-appbar #topMenu > div,
body.om-shell .om-appbar #topMenu .layoutFluid,
body.om-shell .om-appbar .userPanelItems {
  min-width: 0 !important; max-width: none !important;
}
body.om-shell #search,
body.om-shell .searchBar { display: none !important; }

.om-appbar .om-search { flex: 1 1 260px; min-width: 170px; padding-block: 7px; }
.om-appbar .om-search kbd { padding: 2px 8px; line-height: 1.6; align-self: center; }
.om-appbar { padding-block: 8px; }

/* ==========================================================================
   ROUND 4, the content inside the shell. Measured from the screenshots after the shell landed:
   the feed still laid its cards out two abreast (a rule written for a 980px article area, now
   inside a 663px column, so every title wrapped one word per line), the feed's own two column
   .om-layout still reserved 300px for a side column that had just been lifted out of it, and the
   board page was the 2012 table under a 2026 bar.
   ========================================================================== */

/* ---------- the feed, single column in the shell ---------- */
body.om-shell .om-feed { grid-template-columns: minmax(0, 1fr) !important; }
body.om-shell .om-layout { grid-template-columns: minmax(0, 1fr) !important; display: block; }
body.om-shell .om-main { min-width: 0; }
body.om-shell .om-feed-stats { margin-bottom: 6px; }
body.om-shell #content > h1, body.om-shell .om-feed-title { font-size: 22px; margin: 4px 0 2px; }

/* The sections strip becomes what the mockup has: one scrollable row of chips, not a wall. */
body.om-shell .om-sections { padding: 10px 12px; }
body.om-shell .om-sections-title { font-size: 12.5px; color: var(--om-mute); margin-bottom: 6px; }
body.om-shell .om-sections-list {
  display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; overflow-y: hidden;
  padding-bottom: 4px; scrollbar-width: thin;
}
body.om-shell .om-section { flex: none; padding: 5px 6px 5px 10px; font-size: 13px; }
body.om-shell .om-section-follow { padding: 3px 9px; font-size: 12px; }

/* The composer: the mockup's is an avatar, a wide prompt, a row of media glyphs and a red button. */
body.om-shell .om-compose { padding: 12px 14px; gap: 12px; align-items: center; }
body.om-shell .om-compose-topic {
  border-radius: 999px !important; padding: 12px 18px !important; font-size: 14.5px;
  background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important;
}
body.om-shell .om-compose-send {
  background: var(--om-acc) !important; color: var(--om-acc-ink) !important;
  border-radius: 999px !important; padding: 10px 20px !important; font-weight: 800;
}

/* The tabs row sits on one line inside a card, like the mockup's. */
body.om-shell .om-feed-tabs {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 14px;
  padding: 8px 10px; margin: 10px 0;
}
body.om-shell .om-feed-tabs a { padding: 7px 13px; font-size: 13.5px; border: 0; }

/* ---------- the board page: the thread list as cards ---------- */

/* The thead is the grey gradient strip. Its sort links still exist in the sidebar's filter
   form, so hiding this loses nothing a member can do. */
body.om-shell .wbbThreadList thead { display: none !important; }
body.om-shell .tabularBox.wbbThreadList,
body.om-shell .tabularBox.wbbThreadList > table,
body.om-shell .tabularBox.wbbThreadList > table > tbody { display: block !important; width: 100%; }
body.om-shell .tabularBox.wbbThreadList {
  background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important;
}
body.om-shell .wbbThreadList > .tabularBoxTitle,
body.om-shell .wbbThreadList > header,
body.om-shell .wbbThreadList .tabularBoxTitle { display: none !important; }
body.om-shell .tabularBox.wbbThreadList > table > tbody { display: flex !important; flex-direction: column; gap: 10px; }

/* One row, one card: avatar in the start column, everything else beside it, the four numbers
   turned into pills on a line of their own under the title. */
body.om-shell tr.wbbThread {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr);
  grid-template-areas: "avatar subject" "avatar stats";
  column-gap: 12px; row-gap: 6px; align-items: start;
  background: var(--om-panel) !important; border: 1px solid var(--om-line);
  border-radius: 16px; padding: 14px 16px; box-shadow: var(--om-shadow-sm);
}
body.om-shell tr.wbbThread:hover { border-color: var(--om-acc); }
body.om-shell tr.wbbThread > td {
  display: block !important; padding: 0 !important; border: 0 !important;
  background: none !important; text-align: start !important; vertical-align: top;
}
body.om-shell tr.wbbThread > td.columnAvatar { grid-area: avatar; }
body.om-shell tr.wbbThread > td.columnAvatar .framed { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
body.om-shell tr.wbbThread > td.columnAvatar img,
body.om-shell tr.wbbThread > td.columnAvatar .om-av-fallback {
  width: 44px !important; height: 44px !important; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 18px;
}
body.om-shell tr.wbbThread > td.columnSubject { grid-area: subject; }
body.om-shell tr.wbbThread > td.columnSubject h3 {
  margin: 0 0 4px; font-size: 16.5px; line-height: 1.45; font-weight: 800;
}
body.om-shell tr.wbbThread > td.columnSubject h3 a { color: var(--om-ink); }
body.om-shell tr.wbbThread > td.columnSubject h3 a:hover { color: var(--om-acc); }
body.om-shell tr.wbbThread > td.columnSubject h3 .badge.label {
  background: var(--om-chip); color: var(--om-chip-ink); border-radius: 999px;
  padding: 2px 9px; font-size: 11.5px; font-weight: 800; margin-inline-end: 6px;
}
body.om-shell tr.wbbThread .messageGroupInfo {
  display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12.5px; color: var(--om-mute); margin: 0;
}
body.om-shell tr.wbbThread .messageGroupInfo li { list-style: none; }
body.om-shell tr.wbbThread .messageGroupInfo .userLink { color: var(--om-ink); font-weight: 700; }
body.om-shell tr.wbbThread .statusDisplay { float: none; position: static; }
body.om-shell tr.wbbThread .statusIcons { display: inline-flex; gap: 4px; margin: 0; }

/* The four numbers: replies, likes, views, last post. Each cell becomes a pill with a glyph
   drawn by ::before, so the meaning survives losing the column header. */
body.om-shell tr.wbbThread > td.columnReplies,
body.om-shell tr.wbbThread > td.columnLikes,
body.om-shell tr.wbbThread > td.columnViews,
body.om-shell tr.wbbThread > td.columnLastPost {
  grid-area: stats; display: inline-flex !important; align-items: center; gap: 5px;
  width: auto !important; font-size: 12.5px; color: var(--om-mute); font-weight: 700;
  background: var(--om-panel2); border-radius: 999px; padding: 4px 10px !important;
  margin-inline-end: 6px; justify-self: start;
}
/* A grid area can hold one item; four pills share it by becoming one flex row. */
body.om-shell tr.wbbThread > td.columnReplies { justify-self: start; }
body.om-shell tr.wbbThread > td.columnReplies::before { content: "💬"; }
body.om-shell tr.wbbThread > td.columnLikes::before   { content: "❤"; color: var(--om-acc); }
body.om-shell tr.wbbThread > td.columnViews::before   { content: "👁"; }
body.om-shell tr.wbbThread > td.columnLastPost::before { content: "🕐"; }
body.om-shell tr.wbbThread > td.columnLastPost .framed, 
body.om-shell tr.wbbThread > td.columnLastPost img { display: none !important; }
body.om-shell tr.wbbThread > td.columnLastPost { flex-wrap: wrap; }
body.om-shell tr.wbbThread > td.columnLastPost small,
body.om-shell tr.wbbThread > td.columnLastPost p { margin: 0; }
body.om-shell tr.wbbThread > td.columnLikes .positive { color: var(--om-green); }
body.om-shell tr.wbbThread > td.columnLikes .negative { color: var(--om-acc); }
body.om-shell tr.wbbThread > td.columnLikes .badge { background: none; padding: 0; color: inherit; }
body.om-shell tr.wbbThread.wbbThreadSticky { border-color: var(--om-gold); }
body.om-shell tr.wbbThread.wbbThreadSticky::before { display: none; }

/* The board's own heading and blurb. */
body.om-shell .boxHeadline, body.om-shell #content > header.boxHeadline {
  margin: 4px 0 10px; padding: 0; background: none; border: 0;
}
body.om-shell .boxHeadline h1 { font-size: 23px; font-weight: 800; margin: 0 0 2px; }
/* WoltLab gives h1 and the box headlines their own "Trebuchet MS" stack, which beats the body's
   face; measured 2026-09-14, every headline computed to Trebuchet/Arial while the paragraphs were
   in Cairo. The mockup is Cairo throughout. */
body.om-shell h1, body.om-shell h2, body.om-shell h3, body.om-shell h4, body.om-shell .boxSubHeadline > h2,
body.om-shell .boxHeadline h1, body.om-shell .containerHeadline h3 { font-family: 'Cairo', 'Noto Kufi Arabic', 'Segoe UI', Tahoma, sans-serif !important; }
body.om-shell .boxHeadline p { color: var(--om-mute); font-size: 13.5px; margin: 0; }

/* Pagination as one quiet row instead of two rows of large circles. */
body.om-shell .pageNavigation ul { display: flex; flex-wrap: wrap; gap: 4px; }
body.om-shell .pageNavigation ul li { margin: 0; }
body.om-shell .pageNavigation ul li a, body.om-shell .pageNavigation ul li span {
  min-width: 34px; height: 34px; line-height: 34px; padding: 0 8px; border-radius: 10px; font-size: 13px;
}

/* ---------- the legacy sidebar inside the shell ---------- */
/* The collapse handle drew a full height blue rule down the page; the filter form goes last. */
body.om-shell .om-grid > aside.sidebar > span,
body.om-shell .om-grid > aside.sidebar .collapsibleSidebarButton,
body.om-shell .sidebarCollapsed, body.om-shell .jsCollapsibleSidebar { display: none !important; }
body.om-shell .om-grid > aside.sidebar { border: 0 !important; background: none !important; }
body.om-shell .om-grid > aside.sidebar > div { display: flex; flex-direction: column; gap: 14px; }
body.om-shell .om-grid > aside.sidebar form.sidebarBox,
body.om-shell .om-grid > aside.sidebar .sidebarBox:has(form),
body.om-shell .om-grid > aside.sidebar .sidebarBox:has(select) { order: 99; }
body.om-shell .om-grid > aside.sidebar .sidebarBox {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 12px 14px;
}
body.om-shell .om-grid > aside.sidebar .sidebarBox > h2,
body.om-shell .om-grid > aside.sidebar .sidebarBox > header {
  font-size: 14px; font-weight: 800; margin: 0 0 8px; padding: 0; background: none; border: 0;
}

/* Any avatar the file system no longer has becomes an initial on a colour, not a broken glyph. */
.om-av-fallback {
  display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
  color: #fff; font-weight: 800; background: var(--om-acc); font-size: 14px; flex: none;
}

/* ---------- thread cards, round 2: what the cell measurement showed ----------
 * td.columnSubject computed to 99px because WoltLab caps it at max-width:20% (and the last-post
 * cell too), td.columnAvatar was 1px wide (the old shrink-to-content trick), and four cells that
 * all declared grid-area:stats were drawn on top of one another, which is what "7.11🕐2" was.
 * A grid area holds one item. The row is a wrapping flex line instead: avatar, then the subject
 * taking the rest of the line, then the pills wrapping onto a second line under the subject. */
body.om-shell tr.wbbThread {
  display: flex !important; flex-wrap: wrap; align-items: flex-start; column-gap: 12px; row-gap: 8px;
}
body.om-shell tr.wbbThread > td { grid-area: auto !important; max-width: none !important; }
body.om-shell tr.wbbThread > td.columnAvatar { flex: 0 0 44px; width: 44px !important; }
body.om-shell tr.wbbThread > td.columnSubject { flex: 1 1 calc(100% - 70px); width: auto !important; min-width: 0; }
body.om-shell tr.wbbThread > td.columnReplies { margin-inline-start: 56px; }
body.om-shell tr.wbbThread > td.columnReplies,
body.om-shell tr.wbbThread > td.columnLikes,
body.om-shell tr.wbbThread > td.columnViews,
body.om-shell tr.wbbThread > td.columnLastPost { flex: 0 0 auto; width: auto !important; margin-inline-end: 0; }
body.om-shell tr.wbbThread > td.columnLastPost { white-space: normal; gap: 4px 8px; }
body.om-shell tr.wbbThread > td.columnLastPost > div { display: inline; }

/* The sidebar's filter form is the one box that is not a .dashboardBox; it goes last. */
body.om-shell .om-grid > aside.sidebar > div > div:not(.dashboardBox) { order: 99; }
body.om-shell .om-grid > aside.sidebar .dashboardBox {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 12px 14px; margin: 0;
}
body.om-shell .om-grid > aside.sidebar .dashboardBox > legend,
body.om-shell .om-grid > aside.sidebar .dashboardBox > h3 { font-size: 14px; font-weight: 800; padding: 0; margin: 0 0 8px; }

/* The feed's side column in the mockup's order: the live room first. */
body.om-shell .om-side { display: flex; flex-direction: column; }
body.om-shell .om-side .om-feed-chat { order: -1; }

/* ---------- the phone, round 2: measured on a 412px viewport ----------
 * The rail filled the entire first screen, because the round-2 rule that beat WoltLab's
 * table-row (`display:flex !important` on .om-rail) also beat the phone media query's plain
 * `display:none`. And the bar kept its desktop row, so the search was cut off at the left edge and
 * the sign-in link was off screen. On a phone the bar is two rows: brand and tools, then search. */
@media (max-width: 1100px) {
  body.om-shell .om-grid > .om-rail { display: none !important; }
  body.om-shell .om-grid > aside.sidebar > span { display: none !important; }
}
@media (max-width: 760px) {
  .om-appbar { flex-wrap: wrap; gap: 8px 10px; padding: 8px 12px; }
  .om-appbar .om-brand { font-size: 16px; }
  .om-appbar .om-navlink { display: none; }
  .om-appbar .om-tools { margin-inline-start: auto; gap: 6px; }
  .om-appbar .om-btn-new { padding: 7px 11px; font-size: 13px; }
  .om-appbar .om-search { order: 10; flex: 1 1 100%; min-width: 0; }
  .om-appbar .om-search kbd { display: none; }
  body.om-shell .om-appbar .userPanelItems > li > a { padding: 6px 9px !important; font-size: 12.5px; }
  /* The icon stays: this block once hid it while the pills still carried their labels, and after the
     labels moved to the screen reader (the icon cluster below) a signed-in phone saw blank circles. */
  body.om-shell #main { padding-top: 10px !important; }
  body.om-shell .om-grid { gap: 12px; }
}

/* ---------- the card's photo ---------- */
.om-card-media-box {
  display: block; margin: 10px 0 4px; border-radius: 14px; overflow: hidden;
  background: var(--om-panel2); max-height: 440px;
}
.om-card-media-box img {
  display: block; width: 100%; height: auto; max-height: 440px; object-fit: cover;
}

/* ==========================================================================
   ROUND 5: the thread page, the composer's glyph row, the story rail, the phone gap.
   ========================================================================== */

/* ---------- a post as a card ----------
 * WoltLab draws a 212px author column beside every post (name, 128px avatar, rank, a list of
 * credits). Mockup 4 has no thread page, so the post takes the language of its cards: one header
 * row of avatar, name, rank and the credits as quiet chips, then the body at full width. */
body.om-shell .wbbPost.message {
  background: var(--om-panel) !important; border: 1px solid var(--om-line) !important;
  border-radius: 16px !important; box-shadow: var(--om-shadow-sm) !important; margin: 0 0 14px !important;
  overflow: hidden;
}
body.om-shell .wbbPost.message > div { display: flex !important; flex-direction: column; padding: 0 !important; }
body.om-shell .wbbPost.message .messageSidebar {
  display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 12px;
  width: auto !important; max-width: none !important; float: none !important;
  padding: 12px 16px 10px !important; margin: 0 !important; border: 0 !important;
  border-bottom: 1px solid var(--om-line) !important; background: none !important; text-align: start !important;
}
body.om-shell .wbbPost.message .messageSidebar > div {
  display: contents;
}
body.om-shell .wbbPost.message .messageSidebar .userAvatar { order: -2; width: 44px !important; height: 44px !important; margin: 0 !important; }
body.om-shell .wbbPost.message .messageSidebar .userAvatar .framed { padding: 0; border: 0; background: none; box-shadow: none; }
body.om-shell .wbbPost.message .messageSidebar .userAvatar img,
body.om-shell .wbbPost.message .messageSidebar .userAvatar .om-av-fallback {
  width: 44px !important; height: 44px !important; border-radius: 50% !important; font-size: 18px !important;
}
body.om-shell .wbbPost.message .messageSidebar header { order: -1; margin: 0 !important; }
body.om-shell .wbbPost.message .messageSidebar h2.username { font-size: 15px; font-weight: 800; margin: 0; }
body.om-shell .wbbPost.message .messageSidebar h2.username a { color: var(--om-ink) !important; }
body.om-shell .wbbPost.message .messageSidebar .userTitle { margin: 0 !important; }
body.om-shell .wbbPost.message .messageSidebar .userTitle .badge {
  background: var(--om-chip) !important; color: var(--om-chip-ink) !important; border-radius: 999px; padding: 2px 9px; font-size: 11.5px; font-weight: 800;
}
body.om-shell .wbbPost.message .messageSidebar .userCredits { margin: 0 !important; margin-inline-start: auto !important; }
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList {
  display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 0;
}
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList > dt,
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList > dd {
  float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important;
  font-size: 11.5px; color: var(--om-mute); text-align: start !important;
}
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList > dt::after { content: ""; }
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList > dd {
  background: var(--om-panel2); border-radius: 999px; padding: 2px 8px !important; font-weight: 700; color: var(--om-ink);
  margin-inline-end: 4px !important;
}
body.om-shell .wbbPost.message .messageSidebar .userTrophies { display: none !important; }
body.om-shell .wbbPost.message .messageContent { width: auto !important; float: none !important; }
body.om-shell .wbbPost.message .messageContent > div { padding: 12px 18px 10px !important; }
body.om-shell .wbbPost.message .messageHeader {
  display: flex; align-items: center; gap: 10px; margin: 0 0 8px !important; padding: 0 !important;
  border: 0 !important; background: none !important; font-size: 12.5px; color: var(--om-mute);
}
body.om-shell .wbbPost.message .messageHeader::before, body.om-shell .wbbPost.message .messageHeader::after { display: none !important; }
body.om-shell .wbbPost.message .messageHeadline { flex: 1; }
body.om-shell .wbbPost.message .messageHeadline h1, body.om-shell .wbbPost.message .messageHeadline h2 { font-size: 12.5px; font-weight: 600; margin: 0; color: var(--om-mute); }
body.om-shell .wbbPost.message .messageQuickOptions .icon { width: 16px; height: 16px; }
body.om-shell .wbbPost.message .messageBody { padding: 0 !important; }
body.om-shell .wbbPost.message .messageBody > div:first-child { font-size: 15.5px; line-height: 1.85; }
body.om-shell .wbbPost.message .messageSignature {
  margin: 12px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px dashed var(--om-line) !important;
  font-size: 12.5px; color: var(--om-mute); opacity: .8;
}
body.om-shell .wbbPost.message .messageOptions {
  margin: 10px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px solid var(--om-line) !important;
  background: none !important;
}
body.om-shell .wbbPost.message .messageOptions .button, body.om-shell .wbbPost.message .messageOptions .buttonList > li > a {
  border-radius: 999px !important; padding: 5px 12px !important; font-size: 12.5px !important;
  background: var(--om-panel2) !important; color: var(--om-ink) !important; border: 0 !important; box-shadow: none !important;
}
body.om-shell .wbbPost.message .messageOptions .button:hover, body.om-shell .wbbPost.message .messageOptions .buttonList > li > a:hover {
  background: var(--om-chip) !important; color: var(--om-chip-ink) !important;
}
body.om-shell .wbbPost.message .messageOptions .likesSummary { font-size: 12.5px; color: var(--om-mute); }
body.om-shell .wbbPost.message .messageQuickOptions { margin: 0; }
body.om-shell .messageList > li.marginTop { margin-top: 0 !important; }
/* The thread's title block. */
body.om-shell #content > header.boxHeadline { margin-bottom: 12px; }

/* ---------- the composer's glyph row ---------- */
.om-compose-glyphs { display: flex; align-items: center; gap: 4px; flex: none; }
.om-compose-glyphs button {
  width: 34px; height: 34px; border-radius: 10px; border: 0; background: none; cursor: pointer;
  display: grid; place-items: center; color: var(--om-mute); font-size: 17px; line-height: 1; padding: 0;
}
.om-compose-glyphs button:hover { background: var(--om-chip); color: var(--om-chip-ink); }
body.om-shell .om-compose { flex-wrap: wrap; }
body.om-shell .om-compose .om-compose-form { flex: 1 1 260px; }

/* ---------- the story rail: who is active, as the mockup's ring of avatars ---------- */
.om-stories {
  display: flex; gap: 14px; overflow-x: auto; overflow-y: hidden; padding: 6px 4px 8px;
  margin: 2px 0 8px; scrollbar-width: none;
}
.om-stories::-webkit-scrollbar { display: none; }
.om-story { display: flex; flex-direction: column; align-items: center; gap: 5px; flex: none; width: 66px; color: var(--om-ink); }
.om-story-av {
  width: 58px; height: 58px; border-radius: 50%; padding: 3px;
  background: conic-gradient(var(--om-acc), #f97316, #eab308, var(--om-acc)); display: grid; place-items: center;
}
.om-story-av > span {
  width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center;
  color: #fff; font-weight: 800; font-size: 20px; border: 2.5px solid var(--om-panel);
}
.om-story-plus .om-story-av { background: none; padding: 0; }
.om-story-plus .om-story-av > span { background: #7c3aed; border: 0; font-size: 28px; }
.om-story b { font-size: 11.5px; font-weight: 700; max-width: 66px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.om-story-live { position: relative; }
.om-story-live::after {
  content: "مباشر"; position: absolute; bottom: 22px; background: var(--om-green); color: #fff;
  font-size: 9.5px; font-weight: 800; padding: 1px 6px; border-radius: 6px;
}

/* the 24-hour statuses on the rail: a status story wears the ring, the member's own says "أنت",
   the box under the rail is one line, and the viewer is a small card over the page */
.om-story-status .om-story-av { background: conic-gradient(#7c3aed, var(--om-acc), #f97316, #7c3aed); }
.om-story:not(.om-story-status):not(.om-story-plus) .om-story-av { background: var(--om-line); }
.om-story-mine .om-story-av { background: conic-gradient(var(--om-green), #14b8a6, var(--om-green)); }
.om-status-box { display: flex; gap: 8px; align-items: center; margin: 0 0 10px; }
.om-status-box .om-status-input {
  flex: 1 1 200px; min-width: 0; border-radius: 999px !important; padding: 10px 16px !important; font: inherit;
  background: var(--om-panel2) !important; border: 1px solid var(--om-line) !important; color: var(--om-ink) !important;
}
.om-status-box .om-status-send { flex: none; border-radius: 999px !important; padding: 9px 18px !important; }
.om-status-box .om-status-note { font-size: 12.5px; color: var(--om-acc); }
.om-status-viewer { position: fixed; inset: 0; z-index: 900; background: rgba(0, 0, 0, .55); display: grid; place-items: center; padding: 16px; }
.om-status-card {
  position: relative; width: min(440px, 100%); box-sizing: border-box; background: var(--om-panel); color: var(--om-ink); border-radius: 20px;
  padding: 22px 24px 26px; box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
}
.om-status-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.om-status-head .om-story-av { width: 48px; height: 48px; }
.om-status-who { display: flex; flex-direction: column; }
.om-status-who b { font-size: 15px; }
.om-status-who span { font-size: 12px; color: var(--om-mute); }
.om-status-text { margin: 0; font-size: 19px; line-height: 1.8; word-break: break-word; }
.om-status-close {
  position: absolute; top: 10px; inset-inline-start: 12px; width: 32px; height: 32px; border-radius: 50%; border: 0;
  background: var(--om-panel2); color: var(--om-ink); font-size: 20px; cursor: pointer;
}

/* passkeys: the login page's second button and the keys page */
.om-passkey-login { margin-inline-start: 8px; border-radius: 999px !important; }
.om-passkey-login-note, .om-passkey-note { display: inline-block; margin-inline-start: 10px; font-size: 12.5px; color: var(--om-acc); }
.om-passkeys .om-box { max-width: 720px; }
.om-passkey-list { list-style: none; margin: 0 0 14px; padding: 0; }
.om-passkey-list li { display: flex; align-items: center; gap: 12px; padding: 12px 4px; border-bottom: 1px solid var(--om-line); }
.om-passkey-list li:last-child { border-bottom: 0; }
.om-passkey-name { font-weight: 700; }
.om-passkey-meta { color: var(--om-mute); font-size: 12.5px; flex: 1; }
.om-passkey-delete { flex: none; }
.om-passkey-empty { color: var(--om-mute); margin: 0 0 14px; }
.om-passkey-actions { margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.om-passkey-unsupported { margin: 12px 0 0; color: var(--om-acc); }
@media (max-width: 560px) { .om-passkey-list li { flex-wrap: wrap; } .om-passkey-meta { flex-basis: 100%; } }

/* ---------- the phone gap under the breadcrumb ---------- */
@media (max-width: 760px) {
  body.om-shell .breadcrumbs { padding-bottom: 0 !important; }
  body.om-shell #content > h1, body.om-shell .boxHeadline, body.om-shell .om-feed-title { margin-top: 0 !important; }
  body.om-shell .om-feed-stats { margin-top: 0; }
  body.om-shell .wbbPost.message .messageSidebar .userCredits { display: none; }
}

/* ---------- the post card, round 2: the 212px ghost column ----------
 * Measured on thread 429027: every post body sat in a 720px area with an empty 212px strip and
 * a vertical rule beside it. WoltLab positions .messageContent with a MARGIN the width of the
 * author column it used to sit beside, and a border on its inner div; clearing width and float
 * did nothing to either. */
body.om-shell .wbbPost.message .messageContent {
  margin: 0 !important; padding: 0 !important; border: 0 !important;
}
body.om-shell .wbbPost.message .messageContent > div {
  border: 0 !important; margin: 0 !important; box-shadow: none !important; background: none !important;
}
body.om-shell .wbbPost.message .messageSidebar::after,
body.om-shell .wbbPost.message .messageContent::before,
body.om-shell .wbbPost.message .messageContent::after { display: none !important; }
body.om-shell .wbbPost.message > div::before, body.om-shell .wbbPost.message > div::after { display: none !important; }
/* WoltLab paints a 128px white corner shine on the FIRST post of a thread
   (.messageList .messageGroupStarter > .message.messageSidebarOrientationLeft::before, a
   linear-gradient from rgba(255,255,255,.85)). On the white style it is invisible; on the dark
   theme it is a white slab over the author's avatar, which is what the operator photographed on
   2026-09-15. Mockup 4 is flat, so the shine goes in both themes. A pseudo-element carries no
   element of its own, which is why every judge that walked `body *` read this page as clean. */
body.om-shell .messageList .messageGroupStarter > .message::before,
body.om-shell .messageList .messageGroupStarter > .message.messageSidebarOrientationLeft::before,
body.om-shell .messageList .messageGroupStarter > .message.messageSidebarOrientationRight::before { display: none !important; background: none !important; }
/* The same family, and it matters now that tags are switched back on: the framework draws a tag as a
   luggage tag, a #666666 triangle (::before, a border trick) with a solid #ffffff dot (::after). The
   layer already makes the tag a rounded pill, so the triangle hangs off its right edge as a grey arrow
   and the dot is a white speck on the dark theme. Both go. */
body.om-shell .tag::before, body.om-shell .tag::after { display: none !important; content: none !important; }
body.om-shell .tagList > li { margin-inline-end: 6px; }
/* THE TAG CLOUD. WoltLab writes each tag as a bare link with an inline font-size between 85% and 170%
   (measured on the copy: 100 links, 18 distinct sizes), so the sidebar box reads as a ragged wall of
   words at different sizes with one headline-sized tag in the middle of it, which is what the operator
   photographed on 2026-09-15. The cloud becomes chips: one size, one shape, wrapped in a flex row, with
   the box scrolling rather than growing past the page. The popularity the sizes carried is kept, not
   thrown away: the tags the framework sized at 100% or more take the accent chip, which the attribute
   selector can read because those inline values all begin with a 1. */
body.om-shell .tagList, body.om-shell .tagCloud .tagList {
  display: flex !important; flex-wrap: wrap; gap: 6px; margin: 0 !important; padding: 2px 0 !important;
  max-height: 320px; overflow-y: auto; scrollbar-width: thin; list-style: none !important;
}
body.om-shell .tagList > li { display: inline-flex !important; margin: 0 !important; max-width: 100%; }
body.om-shell .tagList a[rel="tag"], body.om-shell .tagList > li > a {
  font-size: 12.5px !important; line-height: 1.7 !important; padding: 3px 11px !important; height: auto !important;
  border-radius: 999px !important; background: var(--om-panel2); color: var(--om-ink) !important;
  border: 1px solid var(--om-line); text-decoration: none !important; font-weight: 600;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block;
}
body.om-shell .tagList a[rel="tag"][style*="font-size: 1"] { background: var(--om-chip); color: var(--om-chip-ink) !important; border-color: transparent; font-weight: 700; }
body.om-shell .tagList a[rel="tag"]:hover, body.om-shell .tagList > li > a:hover { border-color: var(--om-acc); color: var(--om-acc) !important; }
@media (max-width: 600px) { body.om-shell .tagList { max-height: 220px; } }
body.om-shell .tag { padding: 2px 12px !important; height: auto !important; line-height: 1.7 !important; margin-right: 0 !important; }
body.om-shell .wbbPost.message .messageSidebar .userCredits dl.dataList { border: 0 !important; padding: 0 !important; }
body.om-shell .wbbPost.message .messageHeader { border-bottom: 1px dashed var(--om-line) !important; padding-bottom: 6px !important; }

/* Pagination in one row. The layer's earlier pagination block set larger pills with its own
   specificity, so this repeats the compact size at the shell's specificity. */
body.om-shell .pageNavigation { margin: 6px 0 12px !important; }
body.om-shell .pageNavigation > ul { display: flex !important; flex-wrap: wrap; gap: 4px; align-items: center; }
body.om-shell .pageNavigation > ul > li { margin: 0 !important; float: none !important; }
/* WoltLab gives each pagination li the class "button", which the layer's button rule turned into a
   second white pill around the number pill */
body.om-shell .pageNavigation > ul > li.button { padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
body.om-shell .pageNavigation > ul { padding: 0 !important; margin: 0 !important; justify-content: center; gap: 3px !important; }
body.om-shell .pageNavigation > ul > li > a,
body.om-shell .pageNavigation > ul > li > span {
  display: inline-grid !important; place-items: center; min-width: 30px !important; height: 32px !important;
  line-height: 32px !important; padding: 0 6px !important; border-radius: 10px !important; font-size: 13px !important;
  box-shadow: none !important; border: 1px solid var(--om-line) !important; background: var(--om-panel) !important;
}
body.om-shell .pageNavigation > ul > li.active > span,
body.om-shell .pageNavigation > ul > li.active > a {
  background: var(--om-acc) !important; color: var(--om-acc-ink) !important; border-color: var(--om-acc) !important;
}

/* ==========================================================================
   ROUND 6: what the seven-page pass showed. Pagination leaked its screen reader label into the
   active pill, the composer glyphs inherited WoltLab's bordered button, the footer was still
   the 2012 band, and the search and member lists striped every other row grey.
   ========================================================================== */

/* The active page pill carries a visually hidden "الصفحة 1 من 264" for screen readers, and
   `display: inline-grid` on the pill made it visible. It stays for the reader, not the eye. */
body.om-shell .pageNavigation .invisible {
  position: absolute !important; width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important;
}
body.om-shell .pageNavigation > ul > li > a, body.om-shell .pageNavigation > ul > li > span { position: relative; }

/* The glyphs are plain glyphs. */
body.om-shell .om-compose-glyphs button, body.om-shell .om-compose-glyphs button:hover {
  border: 0 !important; box-shadow: none !important; background: none !important; border-radius: 10px !important;
  padding: 0 !important; min-width: 0 !important; width: 34px !important; height: 34px !important;
}
body.om-shell .om-compose-glyphs button:hover { background: var(--om-chip) !important; }

/* ---------- the footer ---------- */
body.om-shell #pageFooter {
  background: none !important; border: 0 !important; box-shadow: none !important;
  margin: 26px auto 90px !important; padding: 0 16px !important; max-width: 1360px;
}
body.om-shell #pageFooter > div { padding: 0 !important; }
body.om-shell #pageFooter .navigationFooter {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; justify-content: center;
  background: none !important; border: 0 !important; border-top: 1px solid var(--om-line) !important;
  padding: 14px 0 6px !important; margin: 0 !important; font-size: 12.5px;
}
body.om-shell #pageFooter .navigationFooter ul { display: flex; gap: 14px; margin: 0; padding: 0; list-style: none; float: none !important; }
body.om-shell #pageFooter .navigationFooter ul li { margin: 0; }
body.om-shell #pageFooter .navigationFooter a { color: var(--om-mute) !important; }
body.om-shell #pageFooter .navigationFooter a:hover { color: var(--om-acc) !important; }
body.om-shell #pageFooter .navigationFooter .navigationItems { color: var(--om-mute); }
body.om-shell #pageFooter .footerContent { padding: 0 !important; margin: 0 !important; }
body.om-shell #pageFooter .footerContent .copyright {
  background: none !important; border: 0 !important; box-shadow: none !important; margin: 0 !important;
  padding: 4px 0 0 !important; text-align: center; font-size: 12px; color: var(--om-mute); font-style: normal;
}
body.om-shell #pageFooter .footerContent .copyright a { color: var(--om-mute) !important; }
body.om-shell #easyMoodMarquee { display: none !important; }

/* ---------- lists that striped every other row ----------
 * The search results and the member list are one card each with a grey background on every
 * second row. Each row becomes its own card, spaced, uniform. */
body.om-shell .container > .containerList > li,
body.om-shell .containerList > li,
body.om-shell .messageList > li.searchResultContainer,
body.om-shell .userList > li, body.om-shell .memberList > li {
  background: var(--om-panel) !important; border: 1px solid var(--om-line) !important;
  border-radius: 14px !important; margin: 0 0 10px !important; padding: 12px 16px !important; box-shadow: none !important;
}
body.om-shell .container > .containerList, body.om-shell .containerList { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
body.om-shell .containerList > li:nth-child(even), body.om-shell .userList > li:nth-child(even) { background: var(--om-panel) !important; }
body.om-shell .container.marginTop:has(> .containerList) { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
body.om-shell .containerList > li .badge.label { border-radius: 999px; padding: 2px 9px; font-size: 11.5px; }
body.om-shell .containerList > li .containerHeadline h3 { font-size: 15.5px; font-weight: 800; }
body.om-shell .containerList > li .containerHeadline h3 a { color: var(--om-ink); }
body.om-shell .containerList > li .containerHeadline h3 a:hover { color: var(--om-acc); }
body.om-shell .containerList > li .containerHeadline p { color: var(--om-mute); font-size: 12.5px; }
body.om-shell .containerList > li .containerContent, body.om-shell .containerList > li .containerContentType { color: var(--om-mute); font-size: 12.5px; }
body.om-shell .containerList > li dl.plain.inlineDataList { font-size: 12.5px; color: var(--om-mute); }
body.om-shell .containerList > li dl.plain.inlineDataList dd { color: var(--om-ink); font-weight: 700; }

/* The app bar's language switcher: a flag is enough. */
body.om-shell .om-appbar .userPanelItems > li > a img.iconFlag + span,
body.om-shell .om-appbar .userPanelItems .jsLanguageChooser > a > span { display: none; }

/* ---------- the grid assigns columns by NAME, not by DOM order ----------
 * On the member profile WoltLab writes aside.sidebar BEFORE section#content, so a grid that
 * fills by order handed the content the 330px column and the sidebar the 663px one. Measured:
 * #content 330px, aside.sidebar 663px. Explicit columns make the layout independent of which
 * element a template happens to print first. */
body.om-shell .om-grid > .om-rail { grid-column: 1; grid-row: 1; }
body.om-shell .om-grid > #content { grid-column: 2; grid-row: 1; }
body.om-shell .om-grid > aside.sidebar, body.om-shell .om-grid > .om-side { grid-column: 3; grid-row: 1; }
@media (max-width: 1100px) {
  body.om-shell .om-grid > #content { grid-column: 1; grid-row: auto; }
  body.om-shell .om-grid > aside.sidebar, body.om-shell .om-grid > .om-side { grid-column: 1; grid-row: auto; }
}

/* ---------- the member profile ---------- */
body.om-shell#tplUser header.userHeadline {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px;
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px;
  padding: 18px 20px !important; margin: 0 0 14px !important;
}
body.om-shell#tplUser header.userHeadline .om-profile-avatar { flex: none; }
body.om-shell#tplUser header.userHeadline .om-profile-avatar img,
body.om-shell#tplUser header.userHeadline .om-profile-avatar .om-av-fallback {
  width: 92px !important; height: 92px !important; border-radius: 50% !important; font-size: 38px !important;
  border: 3px solid var(--om-panel); box-shadow: 0 0 0 3px var(--om-acc);
}
body.om-shell#tplUser header.userHeadline .om-profile-avatar .framed { padding: 0; border: 0; background: none; box-shadow: none; }
body.om-shell#tplUser header.userHeadline > .framed.invisible { display: none; }
body.om-shell#tplUser header.userHeadline h1 { font-size: 24px; font-weight: 800; margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
body.om-shell#tplUser header.userHeadline h1 .badge { border-radius: 999px; padding: 3px 10px; font-size: 12px; }
body.om-shell#tplUser header.userHeadline .dataList { flex-basis: 100%; margin: 0; color: var(--om-mute); font-size: 13px; }
body.om-shell#tplUser header.userHeadline .om-profile-text { flex: 1 1 200px; min-width: 0; }
body.om-shell#tplUser header.userHeadline .buttonGroupNavigation { margin-inline-start: auto; }
body.om-shell#tplUser .sidebar fieldset:has(.userAvatar) { display: none; }
body.om-shell#tplUser .sidebar fieldset { background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 12px 14px; margin: 0 0 14px; }
body.om-shell#tplUser .statsDataList dt { color: var(--om-mute); font-size: 12.5px; }
body.om-shell#tplUser .statsDataList dd { font-weight: 800; }
body.om-shell#tplUser p.info { border-radius: 14px; }

/* ---------- the member's app bar ----------
 * Signed in, the panel has six items and the search was squeezed to two lines with its hint
 * wrapped. The pills tighten, the hint hides when the bar is under 1350px, and the panel may
 * wrap to a second row before the search gives up its width. */
body.om-shell .om-appbar .userPanelItems > li > a { padding: 6px 10px !important; font-size: 13px; }
body.om-shell .om-appbar .userPanelItems > li > a .icon { width: 15px; height: 15px; }
body.om-shell .om-appbar #userMenu > a img.userAvatarImage { border-radius: 50%; width: 22px !important; height: 22px !important; }
body.om-shell .om-appbar .om-tools { flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 1350px) { .om-appbar .om-search kbd { display: none; } }
@media (max-width: 1250px) { body.om-shell .om-appbar .userPanelItems > li > a > span:not(.badge) { font-size: 12.5px; } .om-appbar .om-navlink { display: none; } }

/* The thread row's meta list floated into a 30px strip once the row had a clipboard column. */
body.om-shell tr.wbbThread .messageGroupInfo { float: none !important; width: auto !important; max-width: none !important; }
body.om-shell tr.wbbThread > td.columnSubject > * { float: none !important; }
body.om-shell tr.wbbThread > td.columnMark, body.om-shell tr.wbbThread > td.columnIcon:not(.columnAvatar) { flex: 0 0 auto; width: auto !important; }

/* The EasyMood plugin's floating "إكتب حالتك الشخصية" tab, a grey vertical strip pinned to the
 * left edge for signed-in members. The feed's composer is where a member writes now. */
body.om-shell #easyMoodButton, body.om-shell .easyMoodPositionRight, body.om-shell .easyMoodPositionLeft { display: none !important; }

/* ---------- the member's panel as the mockup's icon cluster ----------
 * Signed in, six labelled pills plus the search plus the brand did not fit 1440px and the bar
 * wrapped. Mockup 4 draws the member's tools as round icon buttons with a count, and a name on
 * the avatar only. Each item keeps its label for the screen reader and its title for hover. */
body.om-shell .om-appbar .userPanelItems > li:not(#userMenu) > a {
  width: 38px; height: 38px; padding: 0 !important; border-radius: 50%; justify-content: center; position: relative;
}
body.om-shell .om-appbar .userPanelItems > li:not(#userMenu) > a > span:not(.icon):not(.badge) {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
body.om-shell .om-appbar .userPanelItems > li:not(#userMenu) > a > .icon { width: 18px; height: 18px; font-size: 18px; margin: 0; }
body.om-shell .om-appbar .userPanelItems > li:not(#userMenu) > a > .badge {
  position: absolute; top: -4px; inset-inline-end: -4px; min-width: 18px; height: 18px; line-height: 18px;
  padding: 0 5px; font-size: 10.5px; text-align: center;
}
body.om-shell .om-appbar .userPanelItems > li:not(#userMenu) > a img { width: 20px; height: 14px; border-radius: 3px; }
body.om-shell .om-appbar #userMenu > a { padding: 4px 12px 4px 5px !important; border-radius: 999px; gap: 8px; }
body.om-shell .om-appbar #userMenu > a img.userAvatarImage { width: 28px !important; height: 28px !important; }
body.om-shell .om-appbar .om-tools { flex-wrap: nowrap; }
body.om-shell .om-appbar .userPanelItems { flex-wrap: nowrap; }

/* ---------- the two-factor gate as a card ---------- */
body#tplOmTwoFactor .om-twofactor, body#tplOmTwoFactor #content > form, body#tplOmTwoFactor .om-gate {
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; padding: 22px 24px;
  max-width: 520px; margin: 8px auto 0; box-shadow: var(--om-shadow-sm);
}
body#tplOmTwoFactor #content > h1, body#tplOmTwoFactor .om-gate h1, body#tplOmTwoFactor .om-twofactor h1 { font-size: 20px; margin: 0 0 6px; }
body#tplOmTwoFactor #content > p, body#tplOmTwoFactor .om-gate p, body#tplOmTwoFactor .om-twofactor p { color: var(--om-mute); font-size: 13.5px; }
body#tplOmTwoFactor input[type="text"], body#tplOmTwoFactor input[type="tel"], body#tplOmTwoFactor input[name="code"] {
  font-size: 22px !important; letter-spacing: .3em; text-align: center; border-radius: 12px !important; padding: 10px 14px !important;
  width: 100% !important; box-sizing: border-box;
}

/* ---------- the icon cluster is for MEMBERS ----------
 * The round-icon rule matched the guest's "تسجيل الدخول أو التسجيل" link too, clipped it to 38px
 * and let its label spill over the new-topic button; seen in the dark and phone renders of the
 * board page. The cluster applies only when the panel holds a member menu. */
body.om-shell .om-appbar .userPanelItems:not(:has(#userMenu)) > li > a {
  width: auto; height: auto; padding: 7px 11px !important; border-radius: 11px; position: static;
}
body.om-shell .om-appbar .userPanelItems:not(:has(#userMenu)) > li > a > span:not(.icon):not(.badge) {
  position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: nowrap;
}
body.om-shell .om-appbar .userPanelItems:not(:has(#userMenu)) > li > a > .badge { position: static; }

/* ---------- the phone, round 3: measured on the board page at 412px ----------
 * WoltLab's mobile sidebar toggle (span.mobileSidebarToggleButton, inside #content) was floating
 * at the top left; the sidebar is simply below the content here, so there is nothing to toggle.
 * And its mobile stylesheet hides every li of .messageGroupInfo, leaving a 0px wide, 387px tall
 * flex box that painted the author's name one letter per line down the card's left edge. */
body.om-shell .mobileSidebarToggleButton { display: none !important; }
@media (max-width: 760px) {
  body.om-shell tr.wbbThread .messageGroupInfo { display: flex !important; flex-wrap: wrap; width: auto !important; gap: 2px 8px; }
  body.om-shell tr.wbbThread .messageGroupInfo > li { display: inline !important; width: auto !important; float: none !important; }
  body.om-shell tr.wbbThread > td.columnSubject { flex-basis: calc(100% - 60px); }
  body.om-shell tr.wbbThread > td.columnLastPost { display: none !important; }
  body.om-shell tr.wbbThread > td.columnReplies { margin-inline-start: 0; }
  body.om-shell .pageNavigation > ul > li > a, body.om-shell .pageNavigation > ul > li > span { min-width: 30px !important; height: 30px !important; line-height: 30px !important; font-size: 12.5px !important; }
}

/* ---------- thread cards, round 3: the 41px meta list ----------
 * Measured on rows 2 and 3 of the board page: ul.messageGroupInfo computed to a USED width of 41px
 * and 25px inside a 497px cell, with its li stacked one under the other, which painted the author
 * and the date as a vertical strip beside the title. Rows 0 and 1, the sticky ones, were fine.
 * The list gets the cell's full width, explicitly. */
body.om-shell tr.wbbThread > td.columnSubject .messageGroupInfo {
  display: flex !important; flex-wrap: wrap; width: 100% !important; min-width: 100%;
  gap: 2px 10px; align-items: center;
}
body.om-shell tr.wbbThread > td.columnSubject .messageGroupInfo > li {
  display: inline-block !important; width: auto !important; float: none !important; white-space: nowrap;
}

/* The phone shows three pages and the ends, not eleven pills in three rows. */
@media (max-width: 760px) {
  body.om-shell .pageNavigation > ul > li:not(.active):not(:first-child):not(:last-child):not(:nth-child(2)):not(:nth-last-child(2)) { display: none; }
  body.om-shell .pageNavigation > ul > li.active + li, body.om-shell .pageNavigation > ul > li:has(+ li.active) { display: block; }
}

/* ---------- the member's dropdowns, the info boxes, the language item, a dead share button ---------- */
body.om-shell .interactiveDropdown {
  border-radius: 16px !important; border: 1px solid var(--om-line) !important; box-shadow: var(--om-shadow) !important;
  overflow: hidden; background: var(--om-panel) !important;
}
body.om-shell .interactiveDropdownHeader { background: var(--om-panel2) !important; border: 0 !important; padding: 10px 14px !important; }
body.om-shell .interactiveDropdownTitle { font-weight: 800; font-size: 13.5px; }
body.om-shell .interactiveDropdownItems > li { border-color: var(--om-line) !important; }
body.om-shell .interactiveDropdownItems .containerHeadline h3 { font-size: 14px; font-weight: 800; }
body.om-shell .interactiveDropdownItems .containerHeadline p, body.om-shell .interactiveDropdownItems small { color: var(--om-mute); font-size: 12px; }
body.om-shell .interactiveDropdownShowAll { background: var(--om-panel2) !important; border: 0 !important; font-weight: 700; }
body.om-shell .dropdownMenu { border-radius: 12px !important; border: 1px solid var(--om-line) !important; box-shadow: var(--om-shadow) !important; }
body.om-shell .dropdownMenu > li > a, body.om-shell .dropdownMenu > li > span { border-radius: 8px; }

/* WoltLab's blue-gradient .info, .success, .warning and .error boxes become soft chips. */
body.om-shell p.info, body.om-shell .info, body.om-shell p.success, body.om-shell p.warning, body.om-shell p.error {
  border-radius: 14px !important; border: 1px solid var(--om-line) !important; box-shadow: none !important;
  background: var(--om-panel2) !important; color: var(--om-ink) !important; text-shadow: none !important;
  padding: 12px 46px 12px 16px !important; font-weight: 600; /* 46px at the start: the room for WoltLab's glyph, which sits absolutely at right 14px */
}
body.om-shell p.info::before, body.om-shell .info::before { color: var(--om-acc) !important; text-shadow: none !important; }
body.om-shell p.error { background: var(--om-chip) !important; color: var(--om-chip-ink) !important; border-color: transparent !important; }
/* A LINK inside one of those chips was still WoltLab's `.info a { color: #ffffff }`, written for the
   old blue box: white on the light chip, 1.12:1, which is the "sign in to take part" line on the
   chat page the operator could not read (2026-09-15). Measured on the rendered page after the fix:
   5.26:1 on the light chip. In the dark theme the layer's own inherit rule gives the link the ink
   colour before this rule's accent can apply, which measures 13.03:1, so both themes clear AA and
   the underline stays in each, so it is still visibly a link. */
body.om-shell p.info a, body.om-shell .info a, body.om-shell p.info a:hover, body.om-shell .info a:hover,
body.om-shell p.success a, body.om-shell p.success a:hover,
body.om-shell p.warning a, body.om-shell p.warning a:hover { color: var(--om-acc) !important; text-decoration: underline !important; font-weight: 700; }
body.om-shell p.error a, body.om-shell p.error a:hover { color: var(--om-chip-ink) !important; text-decoration: underline !important; font-weight: 700; }
body.om-shell p.success { border-color: var(--om-green) !important; }

/* The language item shows its flag; its label is a bare text node, so the anchor's own font is
   collapsed and the flag keeps its size. */
body.om-shell .om-appbar .userPanelItems > li > a > img.iconFlag { width: 20px; height: 14px; }
body.om-shell .om-appbar .userPanelItems > li:has(> a > img.iconFlag) > a { font-size: 0 !important; width: 38px; height: 38px; padding: 0 !important; border-radius: 50%; justify-content: center; }
body.om-shell .om-appbar .userPanelItems > li:has(> a > img.iconFlag) > a > * { font-size: 13px; }

/* Google+ closed in 2019; a share button to it shares nothing. */
body.om-shell .jsShareGoogle, body.om-shell a[href*="plus.google.com"], body.om-shell .icon-google-plus:not(.thirdPartyLoginButton > .icon) { display: none !important; }
/* the Google SIGN-IN button keeps its icon slot (it is the only glyph WoltLab has for Google), drawn as a plain G */
body.om-shell .thirdPartyLoginButton > .icon-google-plus::before { content: "G" !important; font-family: Arial, Helvetica, sans-serif !important; font-weight: 700; font-style: normal; }

/* ==========================================================================
   ROUND 7: a crawl of every URL the verify list knows, 219 of them, member and guest, each
   template eyeballed. Four things were still the old forum: the filebase list (a grey table with
   a column header), the custom pages' satellite images (1120px and 1373px wide, clipped by the
   937px card they sit in), the calendar's blue header cells, and lost gallery thumbnails drawn as
   broken glyphs.
   ========================================================================== */

/* ---------- any remaining tabular list becomes cards ----------
 * The thread list has its own rules above. Everything else that WoltLab prints as .tabularBox
 * (the filebase, moderation lists) gets the same treatment generically: no header row, each row
 * a card, the title cell full width and the number cells as pills after it. */
body.om-shell .tabularBox:not(.wbbThreadList) thead { display: none !important; }
body.om-shell .tabularBox:not(.wbbThreadList) { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
body.om-shell .tabularBox:not(.wbbThreadList) > .tabularBoxTitle, body.om-shell .tabularBox:not(.wbbThreadList) > header { display: none !important; }
body.om-shell .tabularBox:not(.wbbThreadList) > table, body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody { display: block !important; width: 100%; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody { display: flex !important; flex-direction: column; gap: 10px; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr {
  display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 10px;
  background: var(--om-panel) !important; border: 1px solid var(--om-line); border-radius: 16px;
  padding: 12px 16px; box-shadow: var(--om-shadow-sm);
}
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td {
  display: block !important; padding: 0 !important; border: 0 !important; background: none !important; text-align: start !important;
}
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnTitle,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnText:first-of-type,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject { flex: 1 1 100%; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnDigits,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnDate,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnStatus,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnText:not(:first-of-type) {
  flex: 0 0 auto; font-size: 12.5px; color: var(--om-mute); font-weight: 700;
  background: var(--om-panel2); border-radius: 999px; padding: 4px 10px !important;
}
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnIcon { flex: 0 0 auto; }
body.om-shell .tabularBox:not(.wbbThreadList) .containerHeadline h3 { font-size: 15.5px; font-weight: 800; margin: 0; }
body.om-shell .tabularBox:not(.wbbThreadList) .containerHeadline p { font-size: 12.5px; color: var(--om-mute); margin: 0; }

/* ---------- the custom pages: nothing wider than its card ---------- */
body.om-shell .defaultWrapperContent img, body.om-shell #cpHtml img,
body.om-shell .defaultWrapperContent iframe, body.om-shell #cpHtml iframe,
body.om-shell .defaultWrapperContent embed, body.om-shell #cpHtml embed,
body.om-shell .defaultWrapperContent object, body.om-shell #cpHtml object,
body.om-shell .messageText img, body.om-shell .messageText iframe { max-width: 100% !important; height: auto; }
body.om-shell .defaultWrapperContent, body.om-shell #cpHtml { overflow-x: auto; }
body.om-shell #cpHtml center img { border-radius: 12px; }

/* ---------- a lost thumbnail is a tile, not a broken glyph ---------- */
.om-thumb-fallback {
  display: grid; place-items: center; background: var(--om-panel2); color: var(--om-mute);
  border-radius: 10px; font-size: 26px; min-height: 90px; width: 100%; aspect-ratio: 4 / 3;
}

/* ---------- the calendar's headers ---------- */
body.om-shell .calendar th, body.om-shell .calendarMonth th, body.om-shell .calendarSidebar th,
body.om-shell table.calendarMonth thead th, body.om-shell .miniCalendar th {
  background: var(--om-panel2) !important; color: var(--om-ink) !important; border-color: var(--om-line) !important;
  text-shadow: none !important; font-weight: 800; font-size: 12.5px;
}
body.om-shell .calendar td, body.om-shell .calendarMonth td { border-color: var(--om-line) !important; }
body.om-shell .calendar td.today, body.om-shell .calendarMonth td.today, body.om-shell td.calendarToday { background: var(--om-chip) !important; }
body.om-shell .calendar td.otherMonth, body.om-shell .calendarMonth td.otherMonth { opacity: .55; }

/* ---------- round 7, corrected: the filebase card's title cell ----------
 * The first td of a filebase row is the ICON cell, so "td.columnText:first-of-type" widened the
 * wrong cell and the title, author and date wrapped inside a 100px column beside the icon. The
 * title cell is whichever cell carries the headline; it takes the line and the numbers wrap under. */
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnText:first-of-type { flex: 0 0 auto; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td:has(.containerHeadline),
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnTitle,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject {
  flex: 1 1 calc(100% - 80px) !important; min-width: 0; background: none !important; padding: 0 !important;
  border-radius: 0; font-size: inherit; color: inherit; font-weight: inherit;
}
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnIcon { flex: 0 0 auto; width: auto !important; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnIcon .framed,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnIcon .icon { margin: 0; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnDigits:first-of-type { margin-inline-start: 56px; }
body.om-shell .tabularBox:not(.wbbThreadList) .containerHeadline { margin: 0; }

/* Round 7, corrected again: WoltLab caps every .columnSubject at max-width:20%, which the thread
   rule lifted and the generic rule did not, so the filebase title sat in a 131px column. */
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td { max-width: none !important; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject h3 { margin: 0 0 4px; font-size: 15.5px; font-weight: 800; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject .messageGroupInfo {
  display: flex; flex-wrap: wrap; gap: 2px 10px; width: 100% !important; margin: 0; font-size: 12.5px; color: var(--om-mute);
}
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject .messageGroupInfo > li { display: inline !important; float: none !important; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnSubject .filebaseVersion { color: var(--om-mute); font-weight: 600; font-size: 12.5px; }
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td:empty,
body.om-shell .tabularBox:not(.wbbThreadList) > table > tbody > tr > td.columnStatus:not(:has(*)) { display: none !important; }

/* The shoutbox plugin's "دردشة سريعة" box on the dashboard: an empty 220px card for a guest and a
   second chat beside the live room for a member. The live room is the forum's chat now. */
body.om-shell .shoutboxBoxContent, body.om-shell #shoutbox { display: none !important; }

/* ---------- the member's own avatar, wherever the om77 templates show a member ----------
 * They printed an initial for everybody; the framework's pages never did. An <img> carrying
 * .om-avatar keeps the circle and the size of the initial it replaces. */
img.om-avatar-img { object-fit: cover; background: var(--om-panel2); box-shadow: 0 2px 6px rgba(0,0,0,.18); }
.om-leader-list img.om-avatar-img { width: 26px; height: 26px; }
.om-story-av img.om-avatar-img { width: 100%; height: 100%; border-radius: 50%; border: 2.5px solid var(--om-panel); box-shadow: none; }
.om-chat-av {
  display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; flex: none;
  background: var(--om-acc); color: #fff; font-weight: 800; font-size: 12px; vertical-align: middle; margin-inline-end: 6px;
  object-fit: cover;
}

/* ---------- the guest's door on the feed ---------- */
.om-join { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 16px 18px; margin-bottom: 12px;
  background: linear-gradient(135deg, var(--om-chip), var(--om-panel)); border: 1px solid var(--om-line); border-radius: 16px; }
.om-join-text { flex: 1 1 280px; min-width: 0; }
.om-join-text h2 { margin: 0 0 4px; font-size: 18px; font-weight: 800; }
.om-join-text p { margin: 0; color: var(--om-mute); font-size: 13.5px; }
.om-join-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.om-join-actions .button { border-radius: 999px !important; padding: 9px 18px !important; font-weight: 800; }
.om-join-link { flex-basis: 100%; font-size: 12.5px; color: var(--om-acc); font-weight: 700; }
body.om-shell .messageShareButtons ul { display: flex; flex-wrap: wrap; gap: 6px; }
body.om-shell .messageShareButtons .icon32 { width: 30px; height: 30px; font-size: 22px; line-height: 30px; }
.om-video { display: block; width: 100%; max-height: 520px; margin: 8px 0 4px; border-radius: 12px; background: #000; }
.om-loginrequest-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.om-loginrequest-form input { flex: 1 1 260px; padding: 11px 14px; border-radius: 12px; border: 1px solid var(--om-line); background: var(--om-panel2); font: inherit; }
.om-loginrequest-form .button { border-radius: 999px !important; padding: 10px 20px !important; }
/* The trophy list's tab row ran off the right edge of the card; tabs wrap instead. */
body.om-shell .tabMenu > ul, body.om-shell .tabMenu ul { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 4px; }
body.om-shell .tabMenu > ul > li { float: none !important; margin: 0; }
body.om-shell .tabMenu > ul > li > a { border-radius: 10px 10px 0 0; padding: 8px 14px; }
.om-compose-preview { display: flex; flex-wrap: wrap; gap: 8px; flex-basis: 100%; }
.om-compose-thumb { display: inline-grid; place-items: center; width: 84px; height: 84px; border-radius: 12px; overflow: hidden; background: var(--om-panel2); font-size: 11px; padding: 4px; text-align: center; }
.om-compose-thumb img { width: 100%; height: 100%; object-fit: cover; }
.om-feed-new { display: block; width: 100%; margin: 0 0 10px; padding: 10px 14px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--om-acc); color: var(--om-acc-ink); font: inherit; font-weight: 800; box-shadow: var(--om-shadow); }

/* ---------- the member's page, the way the apps show a person (2026-09-14) ----------
 * One header: the picture, the name, the counts, the line of the day, the bio and the actions;
 * then the tabs, "المنشورات" first with the feed's cards and "الصور" as a grid. */
body.om-shell#tplUser header.userHeadline.om-profile-head {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 24px; align-items: start;
  padding: 22px 24px !important;
}
body.om-shell#tplUser .om-profile-head .om-profile-avatar { grid-row: 1; align-self: start; }
body.om-shell#tplUser header.userHeadline.om-profile-head .om-profile-avatar img,
body.om-shell#tplUser header.userHeadline.om-profile-head .om-profile-avatar .om-av-fallback {
  width: 132px !important; height: 132px !important; border-radius: 50% !important; font-size: 52px !important;
  border: 3px solid var(--om-panel); box-shadow: 0 0 0 3px var(--om-acc); object-fit: cover; display: block; box-sizing: border-box;
}
/* the breadcrumbs share a line with a page title elsewhere; here they would squeeze the whole header beside them */
body.om-shell#tplUser #content > .breadcrumbs { float: none !important; margin: 0 0 10px; }
body.om-shell#tplUser header.userHeadline.om-profile-head { clear: both; }
body.om-shell#tplUser .om-profile-head .om-profile-avatar .framed { padding: 0; border: 0; background: none; box-shadow: none; display: block; }
body.om-shell#tplUser .om-profile-head .om-profile-main { min-width: 0; display: flex; flex-direction: column; gap: 10px; }
body.om-shell#tplUser .om-profile-head h1 { font-size: 26px; font-weight: 800; margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
body.om-shell#tplUser .om-profile-head .dataList { flex-basis: auto; margin: 0; color: var(--om-mute); font-size: 13px; }
body.om-shell#tplUser .om-profile-head .inlineDataList { margin: 0; color: var(--om-mute); font-size: 13px; }
body.om-shell#tplUser .om-profile-head .inlineDataList dt { color: var(--om-mute); }
.om-profile-counts { display: flex; gap: 6px 20px; flex-wrap: wrap; list-style: none; margin: 2px 0 0; padding: 0; }
.om-profile-counts li, .om-profile-counts li a { display: flex; flex-direction: column; align-items: center; line-height: 1.15; color: inherit; text-decoration: none; }
.om-profile-counts li a:hover b { color: var(--om-acc); }
.om-profile-counts b { font-size: 19px; font-weight: 800; letter-spacing: -.01em; }
.om-profile-counts span { font-size: 12.5px; color: var(--om-mute); }
.om-profile-status {
  display: inline-flex; align-items: center; gap: 9px; width: fit-content; max-width: 100%; margin: 0;
  padding: 7px 14px; border-radius: 999px; font-size: 14px; line-height: 1.5;
  background: rgba(200,16,46,.07); border: 1px solid rgba(200,16,46,.28);
}
html.om77-dark .om-profile-status { background: rgba(224,54,79,.14); border-color: rgba(224,54,79,.4); }
.om-profile-status small { color: var(--om-mute); font-size: 12px; white-space: nowrap; }
.om-status-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--om-acc); box-shadow: 0 0 0 3px rgba(200,16,46,.18); }
.om-profile-bio { margin: 0; font-size: 14.5px; line-height: 1.7; color: var(--om-ink); white-space: pre-line; }
.om-profile-status-box { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; max-width: 560px; }
.om-profile-status-box .om-status-input { flex: 1 1 160px; min-width: 0; height: 40px; border-radius: 999px; border: 1px solid var(--om-line); background: var(--om-panel2); padding: 0 16px; font-size: 14px; }
.om-profile-status-box .om-status-send { height: 40px; border-radius: 999px !important; padding: 0 18px !important; }
.om-profile-status-box .om-status-note { flex-basis: 100%; font-size: 12.5px; color: var(--om-mute); }
body.om-shell#tplUser .om-profile-actions { margin: 4px 0 0; }
body.om-shell#tplUser .om-profile-actions .buttonGroup { display: flex; flex-wrap: wrap; gap: 8px; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li { margin: 0; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li > a.button, body.om-shell#tplUser .om-profile-actions .buttonGroup > li > .button {
  display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; border-radius: 999px !important;
  border: 1px solid var(--om-line); background: var(--om-panel2); color: var(--om-ink); font-weight: 700; font-size: 13.5px;
}
body.om-shell#tplUser .om-profile-actions .buttonGroup > li > a.button .invisible { display: inline !important; position: static !important; width: auto !important; height: auto !important; overflow: visible !important; clip: auto !important; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button { background: var(--om-acc); color: #fff; border-color: var(--om-acc); }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button .icon { color: #fff; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button.active { background: var(--om-panel2); color: var(--om-ink); border-color: var(--om-line); }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button.active .icon { color: var(--om-ink); }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li.dropdown > .dropdownMenu { border-radius: 14px; }
body.om-shell#tplUser #profileContent { margin-top: 4px; }
body.om-shell#tplUser #profileContent > .tabMenu > ul { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 10px; }
body.om-shell#tplUser #profileContent > .tabMenu > ul > li > a {
  display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--om-line);
  background: var(--om-panel); color: var(--om-ink); font-weight: 700; font-size: 13.5px;
}
body.om-shell#tplUser #profileContent > .tabMenu > ul > li.ui-state-active > a { background: var(--om-acc); color: #fff; border-color: var(--om-acc); }
body.om-shell#tplUser .om-profile-feed { margin-top: 4px; }
body.om-shell#tplUser #omCompose { margin: 0 0 14px; }
.om-photo-grid { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.om-photo-grid li { position: relative; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--om-panel2); margin: 0; }
.om-photo-grid li a { display: block; width: 100%; height: 100%; }
.om-photo-grid img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s; }
.om-photo-grid li:hover img { transform: scale(1.04); }
.om-photo-grid .om-thumb-fallback { width: 100% !important; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 30px; opacity: .55; }
.om-photo-more { margin: 14px 0 0; }
.om-profile-empty { border-radius: 14px; }
@media (max-width: 760px) {
  body.om-shell#tplUser header.userHeadline.om-profile-head { grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; padding: 16px !important; }
  body.om-shell#tplUser header.userHeadline.om-profile-head .om-profile-avatar img,
  body.om-shell#tplUser header.userHeadline.om-profile-head .om-profile-avatar .om-av-fallback { width: 86px !important; height: 86px !important; font-size: 34px !important; }
  body.om-shell#tplUser .om-profile-head h1 { font-size: 21px; }
  .om-profile-counts { gap: 4px 16px; }
  .om-profile-counts b { font-size: 17px; }
  .om-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; }
  .om-photo-grid li { border-radius: 8px; }
}

/* ---------- the language and appearance menu ---------- */
body.om-shell .om-appbar.om-has-lang #pageLanguageContainer { display: none !important; }
.om-lang { position: relative; flex: none; }
.om-lang-btn {
  display: inline-flex; align-items: center; gap: 7px; height: 41px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--om-line); background: var(--om-panel); color: var(--om-ink); font: inherit; font-weight: 700; font-size: 13.5px; cursor: pointer;
}
.om-lang-btn:hover { background: var(--om-panel2); }
.om-lang-btn svg { width: 19px; height: 19px; color: var(--om-mute); }
.om-lang-pop {
  position: absolute; top: calc(100% + 8px); inset-inline-end: 0; min-width: 236px; z-index: 80; padding: 8px;
  background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 16px; box-shadow: 0 14px 40px rgba(0,0,0,.16);
}
html.om77-dark .om-lang-pop { box-shadow: 0 14px 40px rgba(0,0,0,.5); }
.om-lang-title { font-size: 11.5px; font-weight: 700; color: var(--om-mute); letter-spacing: .02em; padding: 6px 10px 4px; }
.om-lang-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; color: var(--om-ink); text-decoration: none; font-weight: 600; font-size: 14px; }
.om-lang-item:hover { background: var(--om-panel2); }
.om-lang-item .om-lang-flag { flex: none; width: 24px; height: 24px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: var(--om-panel2); font-size: 11px; font-weight: 800; }
.om-lang-item .om-lang-flag img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; border: 0; padding: 0; }
.om-lang-item .om-lang-tick { margin-inline-start: auto; font-style: normal; color: var(--om-acc); font-weight: 800; opacity: 0; }
.om-lang-item.om-on .om-lang-tick { opacity: 1; }
.om-lang-item.om-on { background: rgba(200,16,46,.06); }
.om-theme-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 2px 4px 4px; }
.om-theme-seg button {
  display: inline-flex; flex-direction: column; align-items: center; gap: 3px; padding: 8px 4px; border-radius: 10px; cursor: pointer;
  border: 1px solid var(--om-line); background: var(--om-panel2); color: var(--om-ink); font: inherit; font-size: 12px; font-weight: 700;
}
.om-theme-seg button svg { width: 18px; height: 18px; }
.om-theme-seg button[aria-checked="true"] { background: var(--om-acc); color: #fff; border-color: var(--om-acc); }
@media (max-width: 760px) {
  .om-lang-btn { padding: 0 10px; }
  .om-lang-btn b { display: none; }
}

/* the market chip on a board row: the tag glyph and the word keep their gap on a phone too */
.om-board-sell { gap: 6px !important; }
.om-board-sell .icon { margin-inline-end: 5px; }
/* the profile's action row: the framework parks this list absolutely on a phone and hides it behind
   a toggle; here it is a plain row of pills at every width, and the tab strip's overflow toggle
   (a lone list glyph on a row of its own) goes, since the pills wrap instead of overflowing */
body.om-shell#tplUser .om-profile-actions > ul { position: static !important; display: flex !important; font-size: inherit !important; right: auto !important; top: auto !important; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li > a.button { height: 38px !important; box-sizing: border-box !important; padding: 0 16px !important; line-height: 1 !important; box-shadow: none !important; background-image: none !important; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button { background: var(--om-acc) !important; color: #fff !important; border-color: var(--om-acc) !important; }
body.om-shell#tplUser .om-profile-actions .buttonGroup > li#followUser > a.button.active { background: var(--om-panel2) !important; color: var(--om-ink) !important; border-color: var(--om-line) !important; }
body.om-shell#tplUser #profileContent > .tabMenu > ul > li:has(> a.icon-list) { display: none !important; }
body.om-shell#tplUser #profileContent > .tabMenu > ul { white-space: normal !important; display: flex !important; }

/* ---------- sign in with Google, Apple, Microsoft, Facebook, GitHub, X ----------
 * The framework lists its providers as small text buttons under a legend. Here they are a row of
 * pills a phone can tap, each with its mark, under one line ("أو تابع بحسابك على"). */
body.om-shell#tplLogin fieldset:has(.thirdPartyLoginButton), body.om-shell#tplAccountManagement fieldset#3rdParty { border: 0; background: none; padding: 0; margin: 18px 0 0; }
body.om-shell#tplLogin fieldset:has(.thirdPartyLoginButton) > legend { display: block; width: 100%; text-align: center; font-size: 13.5px; font-weight: 700; color: var(--om-mute); float: none; padding: 0 0 12px; }
body.om-shell#tplLogin fieldset:has(.thirdPartyLoginButton) > dl > dt { display: none; }
body.om-shell#tplLogin fieldset:has(.thirdPartyLoginButton) > dl > dd { margin: 0; }
body.om-shell .buttonList.smallButtons:has(.thirdPartyLoginButton) { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; list-style: none; margin: 0; padding: 0; }
body.om-shell .buttonList.smallButtons:has(.thirdPartyLoginButton) > li { margin: 0; }
body.om-shell a.thirdPartyLoginButton {
  display: flex !important; align-items: center; justify-content: center; gap: 9px; height: 46px; box-sizing: border-box; padding: 0 14px;
  border-radius: 999px !important; border: 1px solid var(--om-line) !important; background: var(--om-panel) !important;
  color: var(--om-ink) !important; font-weight: 700; font-size: 14px; text-decoration: none; box-shadow: none !important;
}
body.om-shell a.thirdPartyLoginButton:hover { background: var(--om-panel2) !important; border-color: var(--om-mute) !important; }
body.om-shell a.thirdPartyLoginButton > .icon { width: 22px; height: 22px; font-size: 20px; line-height: 22px; text-align: center; }
body.om-shell a.thirdPartyLoginButton > .icon-google-plus::before { content: "G"; font-family: "Cairo", "Tajawal", system-ui, sans-serif; font-weight: 800; color: #4285f4; font-size: 19px; }
body.om-shell a.thirdPartyLoginButton > .icon-apple { color: var(--om-ink); }
body.om-shell a.thirdPartyLoginButton > .icon-windows { color: #0078d4; }
body.om-shell a.thirdPartyLoginButton > .icon-facebook { color: #1877f2; }
body.om-shell a.thirdPartyLoginButton > .icon-github { color: var(--om-ink); }
body.om-shell a.thirdPartyLoginButton > .icon-twitter::before { content: "𝕏"; font-family: serif; font-weight: 700; color: var(--om-ink); }
body.om-shell a.thirdPartyLoginButton > span:not(.icon) { white-space: nowrap; }
/* on a phone the profile's action pills wrap their words rather than cutting them */
@media (max-width: 760px) {
  body.om-shell#tplUser .om-profile-actions .buttonGroup > li { min-width: 0; max-width: 100%; }
  body.om-shell#tplUser .om-profile-actions .buttonGroup > li > a.button { height: auto !important; min-height: 38px; padding: 8px 14px !important; white-space: normal !important; overflow-wrap: anywhere; word-break: break-word; min-width: 0; max-width: 100%; line-height: 1.35 !important; overflow: visible !important; text-overflow: clip !important; text-align: center; }
}
/* the hover preview when a thread's opening post is gone: a line, not an empty box */
.popover .om-preview-empty { margin: 0; padding: 6px 4px; color: var(--om-mute); font-size: 13.5px; }

/* ---------- the gallery's front page as a gallery ---------- */
.om-gallery-section { margin: 0 0 22px; }
.om-gallery-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 10px; }
.om-gallery-head h2 { margin: 0; font-size: 18px; font-weight: 800; }
.om-gallery-more { font-size: 13px; font-weight: 700; color: var(--om-acc); text-decoration: none; }
.om-gallery-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.om-photo-grid .om-photo-cap {
  position: absolute; inset: auto 0 0 0; padding: 22px 10px 8px; display: flex; flex-direction: column; gap: 1px; color: #fff; pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.62), rgba(0,0,0,0)); opacity: 0; transition: opacity .2s;
}
.om-photo-grid .om-photo-cap b { font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-photo-grid .om-photo-cap small { font-size: 11px; opacity: .9; }
.om-photo-grid li:hover .om-photo-cap, .om-photo-grid li:focus-within .om-photo-cap { opacity: 1; }
.om-album-row { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.om-album-row li { margin: 0; }
.om-album-row a { display: block; color: inherit; text-decoration: none; background: var(--om-panel); border: 1px solid var(--om-line); border-radius: 14px; padding: 8px; }
.om-album-row a:hover { border-color: var(--om-mute); }
.om-album-cover { display: block; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; background: var(--om-panel2); margin: 0 0 8px; }
.om-album-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.om-album-blank { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: var(--om-mute); }
.om-album-row b { display: block; font-size: 13.5px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-album-row small { display: block; font-size: 12px; color: var(--om-mute); margin-top: 2px; }
@media (max-width: 760px) {
  .om-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  .om-album-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .om-photo-grid .om-photo-cap { opacity: 1; padding: 16px 6px 5px; }
}

/* ---------- a pasted address becomes what it shows (OmEmbed) ---------- */
.om-embed { display: block; margin: 10px 0; max-width: 640px; border-radius: 14px; overflow: hidden; background: var(--om-panel2); }
.om-embed-video { position: relative; aspect-ratio: 16 / 9; background: #000; }
.om-embed-video .om-embed-poster { display: block; width: 100%; height: 100%; position: relative; }
.om-embed-video .om-embed-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.om-embed-play {
  position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; margin: -24px 0 0 -34px; border-radius: 14px;
  background: rgba(200,16,46,.92); box-shadow: 0 6px 20px rgba(0,0,0,.35); transition: transform .15s, background .15s;
}
.om-embed-play::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -10px 0 0 -7px; border-style: solid; border-width: 10px 0 10px 18px; border-color: transparent transparent transparent #fff; }
.om-embed-poster:hover .om-embed-play, .om-card-embed:hover .om-embed-play { transform: scale(1.06); background: var(--om-acc); }
.om-embed-video iframe, .om-embed-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; background: #000; }
.om-embed-image { padding: 0; background: none; }
.om-embed-image img { display: block; max-width: 100%; height: auto; border-radius: 14px; }
.om-embed-audio { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--om-line); background: var(--om-panel); }
.om-embed-audio audio { flex: 1 1 200px; min-width: 0; height: 36px; }
.om-embed-audio a { font-size: 12.5px; color: var(--om-mute); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40%; }
.om-embed-provider iframe { display: block; max-width: 100%; border: 0; }
.om-embed-provider[data-embed="vimeo"] iframe, .om-embed-provider[data-embed="dailymotion"] iframe, .om-embed-provider[data-embed="streamable"] iframe,
.om-embed-provider[data-embed="twitchtv-video"] iframe, .om-embed-provider[data-embed="twitchtv-clips"] iframe, .om-embed-provider[data-embed="facebook-videos"] iframe,
.om-embed-provider[data-embed="ok-ru"] iframe, .om-embed-provider[data-embed="rutube"] iframe, .om-embed-provider[data-embed="sendvid"] iframe, .om-embed-provider[data-embed="youku"] iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; }
.om-embed-provider[data-embed="soundcloud"] iframe, .om-embed-provider[data-embed="soundcloud-set"] iframe, .om-embed-provider[data-embed="mixcloud"] iframe, .om-embed-provider[data-embed="spotify"] iframe { width: 100%; }
.om-embed-provider blockquote { margin: 0; }
/* the feed card's poster for a pasted video or picture */
.om-card-embed { position: relative; display: block; }
.om-card-embed img { width: 100%; height: auto; display: block; }
.om-card-embed-youtube { aspect-ratio: 16 / 9; background: #000; }
.om-card-embed-youtube img { height: 100%; object-fit: cover; }
html.om77-dark .om-embed-audio { background: var(--om-panel); }
@media (max-width: 760px) { .om-embed { max-width: 100%; border-radius: 10px; } .om-embed-play { width: 56px; height: 40px; margin: -20px 0 0 -28px; } }

/* the other reactions behind "+" on a feed card */
.om-react-picker { display: none; align-items: center; gap: 2px; padding: 3px 6px; border-radius: 999px; background: var(--om-chip); }
.om-react-picker.om-open { display: inline-flex; }
.om-react-pick { cursor: pointer; font-size: 17px; line-height: 1; padding: 3px 5px; border-radius: 999px; }
.om-react-pick:hover { transform: scale(1.15); }
.om-react-pick.om-reacted { background: var(--om-chip-ink); }

/* ---- the greys Burning Board ships ---------------------------------------------------------
 * The framework paints its secondary text with literal greys from 2014: #b3b3b3 on the content
 * type label, #999999 on the pagination links and #808080 on the board statistics, the last-post
 * timestamp and the "posts" link. Measured on the copy, 2026-09-15: 2.10:1, 2.85:1 and 3.95:1
 * against white, all under WCAG AA's 4.5 for normal text. The layer already owns a muted ink that
 * is measured in both themes, so these point at it rather than carrying a second opinion. */
body.om-shell .containerContentType,
body.om-shell .pageNavigation ul li > a,
body.om-shell dl.statsDataList > dt,
body.om-shell .wbbBoardList .wbbLastPost small,
body.om-shell .wbbBoardList .wbbLastPost small time,
body.om-shell .wbbBoardList .wbbLastPost time.datetime,
body.om-shell .statsDataList > dt,
/* dl.plain's term cells carry the same 2014 grey on the sidebar statistics box and on every row
   of the member list, where the term is itself a link ("المشاركات", "النقاط"): 3.95:1 on white */
body.om-shell dl.plain > dt,
body.om-shell dl.plain > dt a { color: var(--om-mute) !important; }

/* ---- the signed-in pages the guest sweep never reached ------------------------------------
 * The operator, from /settings/ on 2026-09-15: "some menus highlight on this page are in white and
 * font is in white, how will a user read it". Measured signed in, in both themes: the framework
 * paints the active item of every settings sidebar menu white (.sidebar fieldset > nav ul > li.active)
 * and the message editor's tab menus near-white, and in dark mode the blanket above gives their text
 * the light ink, so "الإعدادات", "التنبيهات" and "المستخدمين المتابعين" read 1.19:1 on every page of
 * that menu, and the smiley tabs 1.17:1. The active item takes the accent chip in dark mode; its link
 * carries no class, so it inherits the chip's ink through the blanket's own `inherit`, which is the
 * one case where that rule does the right thing. */
html.om77-dark .sidebar fieldset > nav ul > li.active,
html.om77-dark .sidebar nav ul > li.active {
  background: var(--om-chip) !important;
  color: var(--om-chip-ink) !important;
  border-radius: 10px;
}
html.om77-dark .messageTabMenu > nav.messageTabMenuNavigation > ul > li.active > a,
html.om77-dark .messageTabMenu > nav.messageTabMenuNavigation > ul > li > a,
html.om77-dark .messageTabMenu > div > nav {
  background: var(--om-panel2) !important;
  border-color: var(--om-line) !important;
}
/* and in light mode the same tab menus carry the framework's 2014 greys: #999 on the tabs (2.80:1)
   and #69c on the active one (2.95:1), and field hints under a form row #808080 (3.95:1) */
body.om-shell .messageTabMenu > div > nav ul li a { color: var(--om-mute) !important; }
body.om-shell .messageTabMenu > div > nav ul li.active a,
body.om-shell .messageTabMenu > div > nav ul li.active a:hover { color: var(--om-acc) !important; }
body.om-shell dl:not(.plain) > dd > small:not(.innerError) { color: var(--om-mute) !important; }
/* the editor's OWN tab row (nav.messageTabMenuNavigation) as well as the nested one: its tab label is
   a span with no rule of its own, so it inherited #999 at 2.80:1 on the signature editor */
body.om-shell .messageTabMenu > nav.messageTabMenuNavigation > ul > li > a,
body.om-shell .messageTabMenu > nav.messageTabMenuNavigation > ul > li > a > span { color: var(--om-mute) !important; }
body.om-shell .messageTabMenu > nav.messageTabMenuNavigation > ul > li.active > a,
body.om-shell .messageTabMenu > nav.messageTabMenuNavigation > ul > li.active > a > span { color: var(--om-ink) !important; }

/* ---- the search term the reader was looking for -------------------------------------------
 * The framework marks every hit with <span class="highlight"> and paints it yellow, assuming
 * dark text on it. This layer's body text is light, so a hit read as white on yellow and was
 * the one word on the page nobody could read (reported on the search results, 2026-09-15).
 * The pairing is stated here rather than inherited, in both themes. */
.highlight,
mark {
  background: #ffe066;
  color: #1a1400 !important;
  padding: 0 3px;
  border-radius: 4px;
  font-weight: 700;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.highlight a, mark a { color: #1a1400 !important; text-decoration: underline; }
html.om77-dark .highlight,
html.om77-dark mark { background: #f7c948; color: #1a1400 !important; }

/* ---- the style chooser in the footer -------------------------------------------------------
 * It opens the framework's own dialog, which arrives with a blue title bar, a logo the size of
 * the card and a name column 68px wide that clipped the longer style's name. The dialog is the
 * framework's markup (li[data-style-id] > .box64 > .framed img + .details > h3 + small), so this
 * restyles it in place rather than replacing it. One card per row below 560px: two columns at a
 * phone's width is what squeezed the name. Measured on the copy, 2026-09-15. */
.dialogContainer[aria-labelledby] .dialogTitlebar,
#styleChooser ~ .dialogTitlebar,
.dialogTitlebar {
  background: var(--om-panel) !important;
  border-bottom: 1px solid var(--om-line);
}
.dialogTitlebar .dialogTitle { color: var(--om-ink); font-weight: 800; }
.dialogTitlebar .dialogCloseButton { color: var(--om-mute); }
#styleChooser { padding: 4px 2px 2px; }
.styleList {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  padding: 2px;
  margin: 0;
  list-style: none;
}
@media (min-width: 560px) { .styleList { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.styleList > li {
  background: var(--om-card);
  border: 1px solid var(--om-line);
  border-radius: var(--om-radius);
  padding: 10px 12px;
  margin: 0;
  transition: border-color .15s, background .15s;
}
.styleList > li:hover { border-color: var(--om-accent); }
/* the row: thumbnail, then a text column that is allowed to shrink and wrap */
.styleList > li .box64 {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
/* .box64 is the framework's fixed 64px media object: the .framed span reserves 110px and floats,
   and .details is given the matching margin, which left the name 95px of a 366px card and wrapped
   "الأزرق الإفتراضي - بخط أكبر للشاشات الكبيرة" over five lines. Inside the chooser the row is a
   flex row instead, so both parts take the width they need. */
.styleList > li .box64 > .framed,
.styleList > li .box64 > span:first-child {
  flex: 0 0 auto; line-height: 0;
  width: auto !important; float: none !important;
  margin: 0 !important; padding: 0 !important;
}
.styleList > li .details { margin: 0 !important; padding: 0 !important; }
.styleList > li img {
  width: 46px; height: 46px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid var(--om-line);
  background: #fff;
}
.styleList > li .details { flex: 1 1 auto; min-width: 0; }
.styleList > li .containerHeadline { margin: 0; }
.styleList > li h3 {
  font-size: 14px; font-weight: 700; color: var(--om-ink);
  margin: 0; line-height: 1.35;
  white-space: normal; overflow: visible; text-overflow: clip;
  overflow-wrap: anywhere;
}
.styleList > li small {
  display: block; margin-top: 2px;
  color: var(--om-mute); font-size: 12px; line-height: 1.4;
}
/* the style in use says so with the framework's own marker, kept beside the name */
.styleList > li h3 .icon-ok-sign,
.styleList > li h3 .icon-ok { color: var(--om-accent); margin: 0 4px; }
.styleList > li.active,
.styleList > li:has(.icon-ok-sign),
.styleList > li:has(.icon-ok) { border-color: var(--om-accent); background: var(--om-chip); }

/* the footer link that opens it, which sat as bare text between two dates */
.styleChooser > a,
li.styleChooser {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border: 1px solid var(--om-line);
  border-radius: 999px;
  color: var(--om-mute);
  font-size: 12px;
}
li.styleChooser { padding: 0; border: 0; }
li.styleChooser > a { cursor: pointer; }
.styleChooser > a:hover { color: var(--om-ink); border-color: var(--om-accent); }

/* PHONE WIDTH, measured at 412 px on 2026-09-15 by looking at the crawl's screenshots. The member's tool
   cluster (avatar, messages, alerts, settings, sign out) needed 230 px between the language button and the
   new-topic button and wrapped into a ragged second row: it stays on one row at 36 px per tool. The member
   page's header was a two-column grid, so a long name and the status pill ran out of the card on the left;
   it stacks into one column there. */
@media (max-width: 600px) {
  /* the whole tools row must fit 388px: language 65 + five tools + the new-topic button; measured on the
     crawl's own screenshot the row was 430px and the language button sat half off the screen */
  body.om-shell .om-appbar .om-tools { gap: 5px; }
  body.om-shell .om-appbar .userPanelItems { flex-wrap: nowrap !important; gap: 3px !important; }
  body.om-shell .om-appbar .userPanelItems > li > a, body.om-shell .om-appbar .userPanelItems > li#userMenu > a { width: 34px !important; height: 34px !important; min-width: 0 !important; padding: 0 !important; }
  body.om-shell .om-appbar .userPanelItems > li > a > .icon { width: 16px; height: 16px; font-size: 16px; }
  body.om-shell .om-appbar .userPanelItems > li > a > img.userAvatarImage { width: 26px; height: 26px; }
  body.om-shell .om-appbar .userPanelItems > li#userMenu > a > span:not(.icon):not(.badge) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  body.om-shell .om-appbar .om-btn-new { padding: 0 10px !important; }
  /* The operator's iPhone, 2026-09-15: the red "new topic" pill sat ON TOP of "sign in or register".
     Measured at 320, 360, 390 and 412 px: the guest row packs the language button, that whole label and
     the pill into one line, and the label is squeezed to 56 px, where it wraps to two lines and, with
     iOS's wider metrics, runs under the pill. The pill is the only one of the three that is a DUPLICATE:
     the floating compose button (#om77Compose) does the same thing on every phone page except the four
     sign-in and password pages, where it is deliberately hidden because it covered the form. So the
     pill goes at phone width and the row gets its room back, for a guest and for a member. */
  body.om-shell .om-appbar .om-btn-new { display: none !important; }
  /* At 320 px the bar carries the brand, the language menu, the sign-in pill and now the theme
     button, and the harness measured one control leaving the screen. The floating round toggle and
     the bottom bar both carry the theme switch on a phone, so the bar's own copy stands down on the
     narrowest screens rather than pushing something off the edge. */
  @media (max-width: 360px) { body.om-shell .om-appbar .om-bar-theme { display: none !important; } }
  body.om-shell .om-appbar #topMenu.userPanel { flex: 0 1 auto; min-width: 0; }
  /* The 34 px square above is for a MEMBER's round tools; the guest's "sign in or register" is a text
     link in the same list, and the square was squeezing a 23-character label into 56 px of two wrapped
     lines. It keeps the height and takes the width it needs, on one line. */
  body.om-shell .om-appbar .userPanelItems > li#userLogin > a,
  body.om-shell .om-appbar .userPanelItems > li > a.loginLink {
    width: auto !important; min-width: 0 !important; height: 34px !important; padding: 0 12px !important;
    white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; max-width: 62vw;
    display: inline-flex !important; align-items: center; border-radius: 999px !important;
  }
}
@media (max-width: 480px) {
  body.om-shell#tplUser header.userHeadline.om-profile-head { grid-template-columns: minmax(0, 1fr) !important; justify-items: center; text-align: center; }
  body.om-shell#tplUser .om-profile-head .om-profile-avatar { grid-row: auto; justify-self: center; }
  body.om-shell#tplUser .om-profile-head .om-profile-main { width: 100%; align-items: center; }
  body.om-shell#tplUser .om-profile-head h1 { justify-content: center; overflow-wrap: anywhere; word-break: break-word; max-width: 100%; }
  body.om-shell#tplUser .om-profile-head .inlineDataList, body.om-shell#tplUser .om-profile-head .dataList { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; }
  .om-profile-status { max-width: 100% !important; margin-inline-start: 0 !important; margin-inline-end: 0 !important; box-sizing: border-box; }
  .om-profile-status-box { max-width: 100%; justify-content: center; }
}