/* default.css */
/*
 * https://www.drweb.de/magazin/zeitgemaesse-rasterlayouts-mit-css-grids-48432/
 * http://jsfiddle.net/u6xZF/1/
 * http://jsfiddle.net/Nnjpq/1/

 @viewport{
    zoom: 1.0;
    width: device-width;
}
 */

* {
/* So 100% means 100% */
box-sizing:border-box;
scrollbar-width:thin;
scrollbar-color:transparent transparent;
}
*::-webkit-scrollbar {
width:5px;
}
*::-webkit-scrollbar-track {
background:transparent;
}
*::-webkit-scrollbar-thumb {
background-color:rgba(155, 155, 155, 0.5);
border-radius:20px;
border:transparent;
}

html {
scrollbar-width:none;
}
body {
width:calc(100% - 2px);
min-width:265px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:16px;
margin-top:0px;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
padding:0px;
overflow-y:scroll;
overflow-x:hidden;
}

.fsNormal {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:16px;
}

form, table, td {
padding:0px;
margin:0px;
border-spacing:0px;
}

th {
text-align:left;
font-weight:bold;
}

h1, h1 a, h2, h2 a {
padding:0px;
margin:0px;
line-height:20px;
font-size:18px;
}

h3, h3 a {
padding:0px;
margin:0px;
line-height:16px;
font-size:16px;
}

h4, h4 a {
padding:0px;
margin:0px;
font-weight:bold;
font-size:12px;
line-height:12px;
}

a {text-decoration:none;}
a:focus {outline:none;}

img {border:0px none;}

a > img {
display:block;
}

.border-transparent {
border:1px solid transparent;
}

.disableEvents {
pointer-events:none;
}
.dynamicGroups > a > img {
display:inline;
}

.uploadSelector {
padding:0px;
margin:0px;
height:0px;
}

input, textarea, select, file {
height:18px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:12px;
outline:none;
padding:0px 0px 2px 5px;
vertical-align:middle;
}
/*
input[type="text"], input[type="password"], input[type="select"], input[type="checkbox"], input[type="file"],
input[type="date"], input[type="email"], input[type="tel"] {
height:18px;
padding:0px 0px 2px 7px;
vertical-align:middle;
}
*/
input[type="date"] {
padding-top:4px;
}
input[type="checkbox"] {
margin:0px;
}

select {
cursor:pointer;
}

input[type="submit"], input[type="button"], input[type="reset"] {
/* height:17.5px; */
height:19.5px;
font-weight:bold;
line-height:12px;
padding:0px 5px 0px 5px;
outline:none;
position:relative;
top:2px;
cursor:pointer;
}

input[type="text"], input[type="password"], input[type="file"], input[type="email"], input[type="tel"] {
padding-top:1px;
}

input[type="file"] {
cursor:pointer;
opacity:0;
}

textarea {
height:18px;
padding-top:2px;
}

ul {
margin:0px;
padding:0px 0px 0px 10px;
}

.unselectable {
-moz-user-select:none;
-webkit-user-select:none;
-webkit-touch-callout:none;
-ms-user-select:none;
-khtml-user-select:none;
-o-user-select:none;
user-select:none;
}

.displayNone {
display:none;
}

/** OBJECT FIT */
.objectFitContain {
object-fit:contain;
}
.objectFitCover {
object-fit:cover;
}
.objectFitFill {
object-fit:fill;
}
.centered {
/* position:fixed; */
top:50%;
left:50%;
/* bring your own prefixes */
transform:translate(-50%, -50%);
}

textarea {
resize:none;
}

.ellipsis {
white-space:nowrap;
text-overflow:ellipsis;
}
.faded {
opacity:0.4;
}
.left {
float:left;
}
.right {
float:right;
}
.nowrap {
word-wrap:break-word;
overflow-wrap:break-word;
}

.svgPlaceholder {
position:relative;
}

/* HTML: <div class="loader"></div> */
.loaderDots {
width:60px;
aspect-ratio:4;
--_g:no-repeat radial-gradient(circle closest-side, #000 90%, #0000);
background: 
  var(--_g) 0%   50%,
  var(--_g) 50%  50%,
  var(--_g) 100% 50%;
background-size:calc(100%/3) 100%;
animation:l7 2s infinite linear;
  }
  @keyframes l7 {
  33%{background-size:calc(100%/3) 0%, calc(100%/3) 100%, calc(100%/3) 100%}
  50%{background-size:calc(100%/3) 100%, calc(100%/3) 0%, calc(100%/3) 100%}
  66%{background-size:calc(100%/3) 100%, calc(100%/3) 100%, calc(100%/3) 0%}
  }

/** GRIDS AND FLEXBOXES */
.flexbox {
display:inline-flex;
flex-direction:row;
flex-wrap:wrap;
align-content:space-between;
justify-content:flex-start;
margin:-5px;
padding-top:5px;
&:after {
content: "";
flex: auto;
  }
}
.flexboxImages {
grid-template-columns:repeat(auto-fit, 124px);
}
.flexboxVideos {
grid-template-columns:repeat(auto-fit, 162px);
}
.flexboxKnowledges {
grid-template-columns:repeat(auto-fit, 265px);
}
/** OVERFLOWS */
.autoOverflow, .autoClipping {
overflow:hidden;
}

/** ROUNDINGS */
.noRounding, .noRoundings {
border-radius:0px;
}
/* default.content.css */
.error, .warning, .info, .notice {
margin-bottom:10px;
padding:10px;
}

.debugInfo {
display:none;
}

.contentOuter {
width:100%;
min-height:100vh;
margin:0px auto 0px auto;
overflow-x:hidden;
overflow-y:visible;
}

.contentInner {
overflow:visible;
}

div.contentToolbar {
min-height:28px;
vertical-align:middle;
margin-top:0px;
}
.contentToolbar h1, .contentToolbar h2 {
max-width:calc(100% - 0px);
min-height:22px;
display:inline;
float:left;
/* white-space:break-spaces; */
overflow:visible;
padding-bottom:10px;
}
.contentToolbar h1, .contentToolbar h2, .contentToolbar span {
/* margin-bottom:10px; */
}

div.counter {
/* width:13px; */
height:15px;
font-size:12px;
font-weight:bold;
padding:0px 4px 0px 4px;
position:absolute;
line-height:16px;
overflow:hidden;
}
/* 2024-11-15
div.counterThread {
display:inline-block;
position:relative;
}
*/

/** TABLES */
table.inputGrid td {
padding:0px 5px 5px 0px;
}

td.key {
vertical-align:top;
padding-right:20px;
}

.videoDuration {
width:50px;
height:20px;
display:block;
position:relative;
top:-3px;
left:calc(100% - 55px);
margin-top:-20px;
margin-left:0px;
text-align:right;
padding:3px 3px 0px 0px;
z-index:1;
}

/** CONTENT */
.bg1.padding {
padding:10px 10px 0px 10px;
}
.bg1.nopadding {
padding:0px;
}
/** -- /static/network/ */
.onreefContentLogoStaticNetworkConditional {
display:none;
}
@media all and (min-width: 565px) {
.onreefContentLogoStaticNetworkConditional {
display:inline;
}
}

/** SCROLLBARS */
.scrollbarsContainer {
border:1px solid #FFF;
}
.scrollbarsScroller {
background:#FFF;
}

/** SURVEYS */
.surveyContainer tr.surveyVoteContainer {
margin-bottom:10px;
cursor:pointer;
}
.surveyContainer td.surveyVoteSubject {
width:10%;
max-width:50%;
height:20px;
padding-right:10px;
overflow:hidden;
}
.surveyContainer td.surveyBarWrapper {
height:20px; 
}
.surveyContainer div.surveyVoteSubject {
margin-top:0px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
text-align:left;
}
.surveyContainer div.surveyVoteIcon {
width:20px;
display:block;
/* position:absolute; */
margin-top:-3px;
float:left;
}
.surveyContainer img.surveyVoteIcon, .surveyContainer svg.surveyVoteIcon {
margin-top:4px;
margin-left:5px;
margin-right:5px;
}
.surveyContainer div.surveyVoteBar {
min-width:50px;
height:16px;
/* position:relative; */
margin-top:-1px;
margin-left:1px;
float:left;
}
.surveyContainer .surveyVotePercentage {
display:none;
/* position:absolute; */
margin-top:0px;
margin-left:5px;
float:left;
}
.surveyContainer.unvotable tr.surveyVoteContainer {
cursor:auto;
}
.surveyContainer.unvotable table.surveyContainerBar {
width:100%;
}
.surveyContainer.unvotable td.surveyVoteSubject {
/* width:50%; */
overflow:hidden;
}
.surveyContainer.unvotable td.surveyBarWrapper {
width:50%;
max-width:50%;
}
.surveyContainer.unvotable div.surveyVoteSubject {
text-align:right;
}
.surveyContainer.unvotable div.surveyVoteIcon {
display:none;
}
.surveyContainer.unvotable div.surveyVoteBar {
min-width:50px;
display:block;
}
.surveyContainer.unvotable .surveyVotePercentage {
display:block;
}

/** UPLOAD */
.uploadCopy {
display:none;
}
.uploadCount {
padding-bottom:1px;
}
.uploadFileName {
max-width:100px;
height:17px;
overflow:hidden;
float:left;
word-wrap:break-word;
word-break:break-all;
}
.uploadFilePercent {
 float:left;
}
.uploadFileProgress {
width:100px;
height:5px;
/* float:left;
margin-left:5px;
*/
margin-top:3px;
margin-left:2px;
outline:1px solid white;
overflow:hidden;
display:none;
}
.uploadFileProgressBar {
width:0px;
height:5px;
background-color:white;
}
.uploadFileAbort, .uploadFileDelete {
width:10px;
display:none;
float:left;
margin-left:5px;
}
.draggable {
border:1px solid transparent;
}

/** MESSENGER */
.globalLayerMessenger, .messengerChatContainer {
display:none;
z-index:5;
}
.globalLayerMessenger {
width:230px;
height:30px;
max-height:75%;
overflow:hidden;
margin-right:2px;
position:fixed;
right:0px;
bottom:0px;
/* background-color: {$USERINFO.SETTINGS.DISPLAY.body_background} !important; */
}
.globalLayerMessengerOpened {
height:400px;
}
.globalLayerMessenger .messengerHeadline {
width:calc(100% - 70px);
}
.globalLayerMessenger > .contactsListContainer {
width:230px;
max-height:calc(100% - 30px);
display:none;
overflow-x:hidden;
overflow-y:scroll;
}
.globalLayerMessenger > .contactsListContainer > .contactsList {
width:205px;
margin:0px 10px 10px 10px;
}
.globalLayerMessenger .contactsListContainer .countUnreadConversations {
position:absolute;
margin-top:-45px;
margin-left:25px;
}
.messengerChatContainer {
width:230px;
height:330px;
position:fixed;
right:0px;
bottom:0px;
}
.messengerChatContainer .chatHistoryContainer {
width:208px;
height:250px;
overflow-x:hidden;
overflow-y:scroll;
}
.messengerChatContainer .chatHistoryContainer .chatHistory {
width:190px;
overflow:visible;
word-wrap:break-word;
word-break:break-all;
}
.messageContainer .messageText {
/* word-wrap:break-word; */
word-break:break-all;
}
.messengerChatContainer .messengerChatInputText {
width:calc(100% - 50px);
}
/** MESSENGER MODAL */
.globalLayerMessengerModal {
width:100%;
height:calc(100% - 1px);
max-width:100%;
max-height:calc(100% - 1px);
position:relative;
margin:0px;
box-sizing:border-box;
}
.globalLayerMessengerModal > .contactsListContainer {
width:100%;
max-height:auto;
}
.globalLayerMessengerModal .contactsListContainer .contactsList {
width:100%;
}
.messengerChatContainerModal {
width:100%;
height:100%;
top:0px;
left:0px;
right:auto;
bottom:auto;
}
.messengerChatContainerModal .chatHistoryContainer {
width:calc(100% + 20px);
overflow-x:hidden;
overflow-y:scroll;
}
.messengerChatContainerModal .chatHistoryContainer .chatHistory {
width:calc(100% - 10px);
}

/** TRANSPARENCY */
.transparentBorder {
border:1px solid transparent;
}
.transparentBackground {
background:transparent;
}
.dashboardApp {
border:1px solid transparent;
}

.inputInvisible {
border-color:transparent;
background-color:transparent;
color:var(--font-primary-color);
}
.inputBg1, .inputColorPrimary {
background-color:var(--bg1-background-color);
color:var(--font-primary-color);
}

/** MESSAGES */
.userMessagesThreadsMessages .profileLink {
display:block;
}
@media all and (max-width: 650px) {
.userMessagesThreadsMessages .profileLink {
display:none;
}
}

/** CAROUSEL */
.carouselContainer {
overflow:hidden;
}
.carousel, .carouselClone {
/* height:88px; */
overflow:hidden;
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:center;
align-items:stretch;
align-content:stretch;
user-select:none;
}
.carouselClone {
height:90px;
}
.carouselCloneWrapper {
height:95.5px;
}
.carouselPreloader {
display:none;
overflow:hidden;
}
.carouselItem {
/* height:80px; */
margin:5px;
min-width:86px;
max-width:126px;
cursor:pointer;
flex:1;
float:left;
}
.carouselItem > div {
height:calc(100% - 0px);
overflow:hidden;
}
.carouselItem a {
display:block;
}
.carouselProfile .carouselItem, .carousel_profile .carouselItem, .carousel_profiles .carouselItem {
min-width:46px;
max-width:76px;
}
.carouselImages .carouselItem, .carousel_images .carouselItem {
min-width:84;
max-width:114px;
}
.carouselVideos .carouselItem, .carousel_videos .carouselItem {
min-width:122px;
max-width:152px;
}
.carouselKnowledge .carouselItem, .carousel_knowledge .carouselItem, .carousel_knowledge_questions .carouselItem {
min-width:240px;
max-width:280px;
overflow:hidden;
}
.carousel_images img {
aspect-ratio:4/3;
}
.carousel_videos img {
aspect-ratio:16/9;
}
.carouselPreloaderWrapper, .carouselCloneWrapper {
overflow:hidden;
}
.carouselWrapperOuter_images {
width:calc(100% + 114px);
margin-left:-60px;
}
.carouselCloneOuter_images {
margin-left:-65px;
}
/*
.carouselPreloader .carouselItem, .carouselClone .carouselItem {
float:left;
}
*/

/*
@media all and (max-width: 1000px) and (orientation: landscape), (orientation: portrait) {
.contentOuter {
-moz-transform:scale(1.2);
-moz-transform-origin:0 0;
width:85vw;
margin-left:-0px;
}
}
*/
/* default.header.css */
.headerLoggedOutSlogan {
width:180px;
/*
float:none;
clear:both;
*/
white-space:nowrap;
word-break:keep-all;
/* margin-top:0px; */
margin-top:65px;
margin-left:10px;
margin-bottom:20px;
}
.headerLoggedOutRight {
float:right;
margin:5px 10px 0px 10px;
}
.headerLoginLinks {
text-align:right;
}
.headerLoggedOutRight .globalFormLogin {
text-align:right;
}
.globalFormLogin div.containerInputLoginUsername {
float:none;
clear:both;
}
.globalFormLogin input.inputLoginUsername {
width:190px;
margin-top:1px;
/* margin-bottom:10px; */
}
.globalFormLogin input.inputLoginPassword {
width:94px;
margin-top:1px;
margin-right:3px;
/* margin-bottom:10px; */
}
.globalFormLogin .inputLoginSubmit {
width:90px;
margin-top:-3px;
}
@media all and (min-width: 350px) {
.headerLoggedOutRight {
float:right;
}
.headerLoginLinks {
text-align:right;
}
}
@media all and (min-width: 555px) {
.headerLoggedOutSlogan {
float:none;
clear:both;
margin-top:0px;
}
.globalFormLogin div.containerInputLoginUsername {
float:left;
clear:none;
}
.globalFormLogin div.containerInputLoginPassword {
float:left;
clear:none;
margin-top:0px;
margin-left:5px;
}
.globalFormLogin input.inputLoginUsername {
width:150px;
}
.globalFormLogin input.inputLoginPassword {
width:80px;
}
}
@media all and (min-width: 740px) {
.headerLoggedOutSlogan {
float:left;
clear:none;
margin-top:35px;
}
}
/*
.contentHeaderSpace {
height:10px;
display:none;
}
*/
.headerLeft {
margin:0px 0px -10px 0px;
float:left;
}
div.headerLogo {
float:left;
margin:10px 0px 0px 8px;
}
.headerRight {
float:right;
margin:10px 10px 0px 0px;
}
.headerCenter {
width:100%;
margin-top:0px;
float:left;
}
.headerCenterLeft {
height:30px;
float:left;
}
.headerCenterRight {
height:30px;
margin-right:-15px;
float:right;
}
.headerCenterSearch {
width:calc(100% - 15px);
height:23px;
margin-top:5px;
margin-left:8px;
float:left;
}
@media all and (max-width: 599px) {
.headerCenterRight {
margin-right:5px;
}
}
@media all and (min-width: 370px) and (max-width: 599px) {
.headerCenterSearch {
width:calc(100% - 240px);
}
.headerCenterRight {
margin-right:5px;
}
}
@media all and (min-width: 600px) {
/*
.contentHeaderSpace {
display:block;
}
*/
.headerCenter {
width:calc(100% - 240px);
margin-top:28px;
}
.headerCenterSearch {
width:calc(100% - 225px);
}
}

/** NAVIGATION TOP */
.counterNavigationTop {
width:13px;
height:15px;
font-weight:bold;
padding:0px 3px 0px 3px;
position:absolute;
margin-top:-26px;
margin-left:15px;
}
.counterNavigationTopContacts {
margin-left:12px;
}
.counterNavigationTopNews, .counterNavigationTopKnowledge {
margin-left:10px;
}
.counterNavigationTopImages {
margin-left:14px;
}
.counterNavigationTopProfile {
margin-top:-49px;
margin-left:26px;
}
/* columns_default.css */
/** DEFAULT */
.leftColumn {
min-width:265px;
margin-left:5px;
margin-right:5px;
}
.rightColumn {
min-width:265px;
margin-left:5px;
margin-right:5px;
}

.columns {
overflow-x:hidden;
}

.columnsList {
overflow-x:visible;
margin-left:-4px;
margin-right:-4px;
}

.columnsList > div {
float:left;
}

/** COLUMN-2-265 */
.column-2-265 {
width:100%;
float:none;
}
.column-2-265 > div {
padding:0px;
}

/** COLUMNX-104 */
.columnX-104 {
width:100%;
}

.columnX-104 > a {
width:100%;
display:block;
margin-bottom:10px;
line-height:0px;
}

.columnX-104 > a > img {
width:100%;
}

/* columns_conditional.css */
/** 1/3:2/3 Columns nebeneinander mit mindestens 265px */
.column-33, .column-50, .column-77 {
width:100%;
float:none;
}
.column-33 > div, .column-50 > div, .column-77 > div {
margin-left:0px;
margin-right:0px;
}

/* Komischerweise funktioniert die exakte Breiten-Berechnung nicht und wir muessen mehr Raum in die
 * Breite beruecksichtigen als rechnerisch notwendig waere
 */
@media all and (min-width: 540px) {
.column-50 {
width:calc(50% - 5px);
min-width:265px;
max-width:calc(50% - 5px);
margin:0px;
}
.column-50:nth-child(odd) {
float:left;
margin-right:5px;
}
.column-50:nth-child(even) {
float:right;
margin-left:5px;
}
}
@media all and (min-width: 630px) {
.column-33 {
min-width:235px;
max-width:33%;
float:left;
}
.column-33 > div {
margin-right:5px;
}
.column-77 {
min-width:235px;
max-width:67%;
float:right;
}
.column-77 > div {
margin-left:5px;
}
}

/** 2 265 Columns nebeneinander */

@media all and (min-width: 540px), (min-device-width: 540px) {
.column-2-265 {
width:50%;
width:calc(50% - 5px);
}
.column-2-265:nth-child(odd) {
float:left;
}
.column-2-265:nth-child(odd) > div {
padding-right:5px;
}
.column-2-265:nth-child(even) {
float:right;
}
.column-2-265:nth-child(even) > div {
padding-left:5px;
}
}

@media all and (min-width: 218px) and (max-width: 332px), (max-device-width: 332px) {
.columnX-104 {
width:50%;
float:left;
}
.columnX-104 > a {
width:95%;
}
.columnX-104:nth-child(2n) > a {
margin-left:auto;
margin-right:0px;
}
}

@media all and (min-width: 332px) and (max-width: 446px), (max-device-width: 446px) {
.columnX-104 {
width:33.3333%;
float:left;
}
.columnX-104 > a {
width:95%;
}
.columnX-104:nth-child(3n+2) > a {
margin-left:2.5%;
margin-right:2.5%;
}
.columnX-104:nth-child(3n+3) > a {
margin-left:auto;
margin-right:0px;
}
}

@media all and (min-width: 446px) and (max-width: 560px), (max-device-width: 560px) {
.columnX-104 {
width:25%;
float:left;
}
.columnX-104 > a {
width:95%;
}
.columnX-104:nth-child(4n+3) > a {
margin-left:auto;
margin-right:0px;
}
.columnX-104:nth-child(4n+4) > a {
margin-left:auto;
margin-right:0px;
}
}

@media all and (min-width: 560px) and (max-width: 674px), (max-device-width: 674px) {
.columnX-104 {
width:20%;
float:left;
}
.columnX-104 > a {
width:95%;
}
.columnX-104:nth-child(5n+3) > a {
margin-left:2.5%;
margin-right:2.5%;
}
.columnX-104:nth-child(5n+4) > a {
margin-left:auto;
margin-right:0px;
}
.columnX-104:nth-child(5n+5) > a {
margin-left:auto;
margin-right:0px;
}
}

@media all and (min-width: 674px) {
.columnX-104 {
width:16.6666%;
float:left;
}
.columnX-104 > a {
width:94%;
}
.columnX-104:nth-child(6n+4) > a, .columnX-104:nth-child(6n+5) > a, .columnX-104:nth-child(6n+6) > a {
margin-left:auto;
margin-right:0px;
}
}
/* columns_flexbox.css */
/*
 * http://www.mediaevent.de/css/display-flex.html
 * https://blog.kulturbanause.de/2013/07/einfuhrung-in-das-flexbox-modell-von-css/
 * http://caniuse.com/#feat=flexbox
 */
.flexboxContainer, .flexboxContainerProfiles, .flexboxContainerAudios, .flexboxContainerImages,
.flexboxContainerVideos, .flexboxContainerKnowledges, .flexboxContainerThemes {
display:flex;
flex-direction:row;
flex-wrap:wrap;
/* justify-content:space-between; */
justify-content:center;
align-items:stretch;
align-content:stretch;

padding-top:5px;
margin:-5px -5px -5px -5px;
}

/*
.flexboxContainer:after, .flexboxContainerImages:after, .flexboxContainerVideos:after, .flexboxContainerAudios:after {
content:"";
display:inline-block;
padding-left:100%;
}
*/
.flexboxItem, .flexboxContainer > div, .flexboxContainerProfiles > div, .flexboxContainerAudios > div,
.flexboxContainerImages > div, .flexboxContainerVideos > div, .flexboxContainerKnowledges > div,
.flexboxContainerThemes > div {
flex:1;
}
/*
.flexboxContainer > div > div > a > img {
height:80px;
max-height:80px;
}
*/
.flexboxItem, .flexboxContainer > div {
min-width:205px;
}
.flexboxContainerThemes > div {
min-width:205px;
max-width:365px;
}
.flexboxContainerProfiles > div {
min-width:96px;
max-width:136px;
}
.flexboxContainerProfilesMedium > div {
min-width:142px;
max-width:192px;
}
.flexboxContainerImages > div {
min-width:124px;
/* max-width:247px; */
max-width:164px;
}
.flexboxContainerImagesMedium > div {
min-width:218px;
max-width:268px;
}
.flexboxContainerVideos > div {
min-width:162px;
max-width:202px;
}
.flexboxContainerVideosMedium > div {
min-width:298px;
max-width:348px;
}
.flexboxContainerKnowledges > div {
min-width:245px;
/* max-width:247px; */
max-width:304px;
}

/* dropdowns_default.css */
.dropdownLayer {
overflow:visible;
}

.headerLeft > .dropdownLayer {
float:left;
}

.headerRight > .dropdownLayer {
float:right;
}
/*
.dropdownLayerProfile, .dropdownLayerProfile > div:nth-child(1) {
width:33px !important;
height:40px !important;
right:10px;
}
*/

/** Header */
.dropdownHeader {
border:1px solid #FFFFFF;
border-bottom:0px none !important;
}

/** Container 1 */
.dropdownLayer > div:nth-child(1) {
border:1px solid transparent;
border-bottom:0px none !important;
position:relative;
cursor:pointer;
display:block;
z-index:auto;
padding:5px;
margin-right:-0.5px;
font-weight:bold;
}

/** Overlay */
.dropdownLayer > div:nth-child(1) > .dropdownOverlay {
width:0px;
height:0px;
display:none;
position:absolute;
margin-left:-5.5px;
margin-top:-4px;
z-index:auto;
border:1px solid transparent !important;
background-color:transparent;
}
.dropdownLayer > div:nth-child(1) > .dropdownOverlay .dropdownOverlayShield {
width:0px;
height:0px;
display:none;
position:absolute;
margin-left:-5.5px;
margin-top:-4px;
z-index:auto;
border:1px solid transparent !important;
background-color:transparent;
}
/*
.dropdownLayer > div:nth-child(1) > .dropdownOverlay {
width:calc(100% + 1px);
height:15px;
display:none;
position:absolute;
margin-left:-5.5px;
margin-top:-4px;
z-index:auto;
border:1px solid transparent;
border-top:0px none !important;
border-bottom:0px none !important;
border-left:0px none !important;
}
.dropdownLayer > div:nth-child(1) > .dropdownOverlay .dropdownOverlayShield {
width:calc(100% - 5px);
height:10px;
margin-top:-1.5px;
margin-left:0px;
border:1px solid transparent;
border-top:0px none !important;
border-right:0px none !important;
border-bottom:0px none !important;
}
*/

/** Container 2 */
.dropdownActive, .dropdownActive div, .dropdownActive a, .dropdownActive span, .dropdownActive * {
z-index:7;
}

.dropdownLayer > div:nth-child(2) {
display:none;
margin-top:-0.5px;
margin-bottom:0.5px;
z-index:auto;
}

.dropdownRight > div:nth-child(2) {
position:relative;
right:0px;
margin-right:-0.5px;
z-index:auto;
}
/* .dropdownContainer */
.dropdownLayer > div:nth-child(2) > div {
position:absolute;
z-index:auto;
margin-top:-0.5px;
}

.dropdownRight > div:nth-child(2) > div {
min-width:170px;
right:0px;
}

/** Container 2 -> a */
.dropdownLayer > div:nth-child(2) > div > a, .dynamicGroups > a, a.dropdown, .containerHover > a, .dropdownContainer > a {
display:block;
padding:10px;
white-space:nowrap;
font-weight:bold;
}

.dropdownHeaderNavigation {
margin:0px 2px 0px 2px;
}

.dropdownHeaderNavigation .dropdownLayer > div:nth-child(2) > div > a, .dropdownHeaderNavigation .dynamicGroups > a, .dropdownHeaderNavigation a.dropdown, .dropdownHeaderNavigation .containerHover > a, .dropdownHeaderNavigation .dropdownContainer > a {
text-align:center;
}

/** Addressbook Container */
.dynamicAddressbookRecipients {
width:160px;
}

/** Dropsides */
.dropsideLayer {
display:none;
float:right;
position:absolute;
margin-top:-37px;
}
.dropsideLayer > .dropdownOverlay {
width:3px;
height:36px;
z-index:8;
position:absolute;
margin-top:3px;
margin-right:-3px;
}
.dropsideLayer > .dropdownContainer {
position:absolute;
}
.optionsShareSettings {
border:0px none !important;
}

/** dropdownActive Das Dropdown ist geoeffnet, dementsprechend gestalten wir es */
/* 1. Container Border setzen bei dropdownActive */
.dropdownActive > div:nth-child(1) {
/* border:1px solid #FFF; */
border-bottom:0px none !important;
z-index:7;
}

.dropdownActive > div:nth-child(2) {
display:block;
}

.dropdownActive .dropdownHide {
display:none;
}
/* 2. Container Border setzen bei dropdownActive */
.dropdownActive > div:nth-child(2) > div {
display:block;
/* border:1px solid #FFF; */
z-index:6;
}
.dropdownActive .dropdownOverlay {
display:block;
z-index:7;
}
.dropdownContainer {
margin-top:1px;
padding-top:7px;
padding-bottom:7px;
border:1px solid transparent;
overflow-x:hidden;
}
/* popups_default.css */
/**
.popupActive {
z-index:7;
}

.popupLayer {
min-width:300px;
min-height:30px;
}

.popupLayer > div {
height:100%;
}
*/

.popupActive {
z-index:7;
}

.popup {
min-width:300px;
max-width:700px;
width:calc(100vw - 50%);
min-height:30px;
max-height:calc(100vh - 20% - 20px);
position:fixed;
top:calc(100vh - 85vh);
/*
left:25%;
*/
left:50%;
transform:translateX(-50%);
overflow-x:hidden;
overflow-y:hidden; /* auto */
}

@media all and (max-width: 799px) {
.popup {
min-width:calc(100vw - 20%);
max-width:calc(100vw - 10%);
width:calc(100vw - 20%);
}
}

.popupMove {
width:calc(100% - 20px);
height:25px;
position:absolute;
top:2px;
cursor:move;
margin-top:0px;
}

.popupResize {
width:20px;
height:20px;
position:sticky;
right:0px;
bottom:0px;
margin-top:-20px;
float:right;
cursor:se-resize;
}

.popupWrapper {
padding:10px;
margin-right:2px;
}

.popupWrapper .bg1 {
max-width:calc(100% - 0px);
}

.popupLayer > div:not(.popupMove) {
height:100%;
}

.popupModalLayer {
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background-color:#000;
opacity:0;
z-index:6;
}
/* sortable_default.css */
.sortablePlaceholder {
float:left;
margin-right:10px;
margin-bottom:10px;
border:1px dashed white;
}
.sortablePlaceholderImageContainer {
width:126px;
height:100px;
margin-bottom:10px;
border:1px dashed white;
}

/*
.flexContainer {
display:-inline-flex;
display:inline-flex;

-webkit-flex-wrap:wrap;
flex-wrap:wrap;

-webkit-justify-content:flex-start;
justify-content:flex-start;
}

.flexItem {
width:134px;
-webkit-flex-grow:1;
flex-grow:1;
}
*/

.sortableItemDrag > div, .sortableContainerDrop {
border-width:1px !important;
border-style:dashed !important;
border-color:var(--system-notification-color) !important;
cursor:move !important;
}
/* override.css */
/* INPUTS AUTOFILL */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px var(--input-background-color) inset !important;
}

/* HIGHLIGHTER */
.highlight{background-color:yellow}

/* COLORPICKER */
.jPicker .Title,
.jPicker .Button,
.jPicker .Move,
.jPicker .AHex,
.jPicker .Current {
display:none !important;
}
.jPicker .Preview {
padding:0px !important;
}
div.jPicker {
width:380px !important;
max-width:380px !important;
height:260px !important;
padding:0px 0px 0px 0px !important;
overflow:hidden !important;
position:relative !important;
margin-top:0px !important;
margin-left:0px !important;
background-color:transparent;
border:0px none;
}
table.jPicker {
width:380px !important;
max-width:380px !important;

height:260px !important;
padding:0px !important;
background-color:transparent !important;
border:0px none !important;
}
.jPicker .Map {
margin:0px !important;
padding:0px !important;
}
.jPicker .Bar {
margin:0px 5px 0px 10px !important;
}
.jPicker .Preview {
height:40px !important;
}
.jPicker .Preview div {
height:30px !important;
overflow:hidden !important;
}
table.jPicker td.Radio {
width:40px !important;
white-space:nowrap;
word-break:keep-all;
word-wrap:normal;
}
table.jPicker td.Text {
width:40px !important;
white-space:nowrap;
word-break:keep-all;
word-wrap:normal;
}
table.jPicker td.Text input {
margin:0px !important;
}
table.jPicker td.Text input.Hey {
width:60px;
}
.jPicker input {
/* color:#000 !important; */
font-size:11px;
}
.colorPickerItemIcon {
border:1px solid transparent;
}

/* FLOT Chart */
.legendLabel {padding-left: 5px;}
.flot-base, .flot-overlay {
max-width:100% !important;
max-height:auto !important;
height:auto !important;
}
.pieLabelBackground {
position:sticky !important;
}

/* DRAGGABLE */
.ui-state-disabled {opacity : 1 !important;}

/* RESIZABLE */
.ui-resizable-handle {
opacity:0 !important;
}

/* OSM */
.olControlZoomIn, .olControlZoomOut, #OpenLayers_Control_MaximizeDiv_innerImage {
display:none;
}
.olControlPanZoomBar {
display:none;
}

/* ON/OFF SWITCH */
/* https://proto.io/freebies/onoff/ */
.onoffswitch {
width:63px;
position:relative;
}
.onoffswitch-checkbox {
position:absolute;
opacity:0;
pointer-events:none;
}
.onoffswitch-label {
display:block;
overflow:hidden;
cursor:pointer;
border:0px none; /* 2px solid #999999; */
border-radius:12px;
}
.onoffswitch-inner {
width:200%;
display:block;
margin-left:-100%;
margin-top:-1px;
transition:margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
width:50%;
height:16px;
display:block;
float:left;
padding:2px 0px 0px 0px;
line-height:13px;
font-size:11px;
color:white;
font-family:Trebuchet, Arial, sans-serif;
font-weight:bold;
box-sizing:border-box;
}
.onoffswitch-inner:before {
content:" Online";
padding-left:6px;
/* padding-right: 18px; */
background-color:#00FF55;
color:#FFFFFF;
}
.onoffswitch-inner:after {
content:"Offline";
padding-right:3px;
margin-top:0px;
background-color:#FF0000;
color:#FFFFFF;
text-align:right;
}
.onoffswitch-switch {
width:11px;
height:11px;
display:block;
margin:2px 5px 4px 2px;
background:#FFFFFF;
position:absolute;
top:0;
bottom:0;
right:40px;
border:0px none; /* 2px solid #999999; */
border-radius:15px;
transition:all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-left:0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right:0px; 
}
/* ON/OFF SWITCH CUSTOMIZED */
.onoffswitch-switch {
right:42px;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
margin-right:3px;
}
/*
.formMediaUpdate .onoffswitch-inner::before {
padding-top:1px;
padding-right:auto;
padding-left:6px;
}
.knowledgeItem .onoffswitch-inner::before {
padding-left:6px;
}
*/

/* PROFILE */
.profileViewMediaImage {
width:100%;
min-width:280px;
}
.profileViewProfileData {
/* width:280px; */
min-width:280px;
}
.userProfileContainer_profileImages .mediaPlayerContainer img.switchMedia {
height:80px;
object-fit:cover;
}

/* user.images.upload, user.videos.upload */
.dynamicViewModeList .uploadContainerLabelText {
max-width:142px;
}
.dynamicViewModeGallery .uploadContainerLabelText {
max-width:142px;
}
.dynamicViewModeList .onoffswitch {
top:-50px;
right:0px;
margin-bottom:0px;
}
.dynamicViewModeGallery .onoffswitch {
top:6px;
right:auto;
margin-bottom:-10px;
}

/*
.dynamicViewMode .selectableListItem {
height:30px;
right:10px;
margin-top:-37px;
clear:both;
margin-right:0px;
padding-top:5px;
text-align:right;
cursor:pointer;
}
*/
.selectableListItem {
/* Zerschiesst den Online/Offline Switch */
/* text-align:right; */
clear:both;
}
.dynamicViewModeList .selectableListItem {
position:absolute;
padding-left:0px;
}
.dynamicViewModeGallery .selectableListItem {
position:relative;
clear:both;
margin-right:-10px;
padding-left:10px;
}
/*
.dynamicViewModeList .selectableListItem svg {
margin-top:-10px;
}
.dynamicViewModeGallery .selectableListItem svg {
margin-top:0px;
}
*/

@media all and (min-width: 600px) {
.profileMediaDataColumns {
display:grid;
}
}
/* video.player.css */
video, object, object embed {
width:auto;
height:100%;
max-width:100%;
max-height:100%;
outline:none;
position:relative;
object-fit:contain;
object-position:50% 50%;
display:inline-flex;
align-self:center;
background-size:cover;
overflow:hidden;
margin:0px;
}
video.mediaPreviewVideo {
width:142px;
height:80px;
}
/* Wir haben (noch) nicht gefunden wo das Video her kommt oder eingebettet wird.
Es sollte vermutlich mal die Preview werden die inzwischen im thumbnailPreview
Container eingebettet wird */
.mediaPlayerContainerVideo .mediaPreviewVideo {
display:none;
}
.fullscreenActiveClone {
width:100%;
height:100%;
position:absolute;
top:0px;
left:0px;
/* cursor:pointer; */
z-index:12;
}
/* Um 16:9 Format zu gewaehrleisten */
/*
.autoVideoContainer {
position:relative;
padding-bottom:56.25%;
padding-top:25px;
height:0;
}
.autoVideoContainer iframe {
position:absolute;
top:0;
left:0;
width:100% !important;
height:100% !important;
}

.autoVideoContainer {
overflow:hidden;
}
*/
.switchControl {
position:absolute;
margin-top:calc(20% + 0px);
top:auto;
z-index:5;
/* transform:translateY(-50%); */
}
.switchControlLeft {
left:20px;
}
.switchControlRight {
/* right:20px; */
left:auto;
}

.mediaPlayerContainer img.switchMedia {
/* Wheelzoom
height:100%;
width:100%;
*/
max-width:100%;
max-height:100%;
outline:none;
position:relative;
object-fit:contain;
object-position:50% 50%;
display:inline-flex;
align-self:center;
background-size:cover;
overflow:hidden;
margin:0px;
}

.autoEmbedMediaPlayerProfile .mediaPlayerContainerImage img {
/*
width:auto;
height:100%;
*/
width:100%;
object-fit:cover;
object-position:50% 25%;
background-size:cover;
background-position:50% 25%;
aspect-ratio:1 / 1;
}

.fullscreenActive img.switchMedia {
width:100%;
height:100%;
max-height:100% !important;
}

.mediaPlayerTitle, .mediaPlayerDescription {
width:calc(100% - 22px);
height:26px;
position:relative;
padding:0px;
overflow:hidden;
z-index:5;
}

.mediaPlayerContainer .mediaPlayerTitle, .mediaPlayerContainer .mediaPlayerDescription {
margin-bottom:-26px;
padding:5px 0px 0px 0px;
position:absolute;
}

.fullscreenActive .mediaPlayerTitle, .fullscreenActive .mediaPlayerDescription {
z-index:12;
}

.mediaPlayerContainer .mediaPlayerTitle {
display:none;
opacity:0;
}

.mediaPlayerDescription {
word-break:break-all;
word-wrap:break-word;
text-align:center;
}

.mediaPlayerEditLabel {
/* font-size:18px; */
font-weight:bold;
}

.mediaPlayerContainer {
width:100%;
max-height:60vh;
background-color:#000000;
overflow:hidden;
text-align:center;
object-fit:contain;
object-position:50% 50%;
}
@media all and (max-height: 600px) and (orientation: landscape), (max-device-height: 600px) and (orientation: landscape) {
.mediaPlayerContainer {
min-height:70vh;
aspect-ratio:16 / 9;
}
}
@media all and (max-height: 560px), (max-device-height: 560px) {
.albumMediaReshareWrapper {
padding:0px;
}
}

.mediaPlayerMediaWrapper {
height:100%;
display:flex;
justify-content:center;
align-content:center;
align-items:center;
flex-direction:column;
}
.mediaPlayerContainerFullscreen .mediaPlayerMediaWrapper {
max-height:100vh;
}
.mediaPlayerControlWrapper {
width:calc(100% + 1px);
position:relative;
}
.mediaPlayerContainerVideoEdit .mediaPlayerControlWrapper {
margin-top:1px;
}
.mediaPlayerControl {
width:100%;
height:34px;
opacity:1;
position:relative;
margin-top:-34px;
/* margin-right:1px; */
margin-left:0px;
margin-bottom:0px;
/* top:0px; */
bottom:0px;
z-index:5;
overflow:hidden;
/* Sonst sind die Arrwos nicht zu sehen */
/*
overflow-x:hidden;
overflow-y:visible;
*/
}

.fullscreenActive .mediaPlayerControl {
z-index:12;
}

.mediaPlayerControlImage {
margin-top:-33px;
margin-right:0px;
}
.mediaPlayerControlVideo {
background:var(--video-player-control-background-color);
}
.mediaPlayerControlFullscreen {
position:absolute;
margin-left:-30px;
}

/* Ausnahmen fuer Knowledge */
.mediaPlayerKnowledge {
max-width:50vh;
}
.mediaPlayerKnowledge .mediaPlayerMediaWrapper {
height:calc(100% - 0px);
}
.mediaPreviewMediaKnowledge .mediaPlayerContainer img {
max-width:none;
max-height:stretch;
object-position:50% 50%;
object-fit:fill;
}
.mediaPreviewMediaKnowledge .mediaPlayerContainer,
.mediaPreviewMediaKnowledge .mediaPlayerControlImage {
background-color:transparent;
}
/* Ausnahmen fuer Stream */
.shareNewsMediaWrapperVideo .mediaPlayerVideo {
max-height:60vh;
}
/* Ausnahmen fuer Messages */
.messageAttachments img.switchMedia, .messageAttachments video.mediaPlayerVideo {
max-height:60vh;
}

.mediaPlayerEditControl {
/* width:100%; */
position:relative;
/* top:0px; */
z-index:5;
margin-right:1px;
overflow:hidden;
margin-bottom:-30px;
}
.mediaPlayerEditControl {
background:var(--video-player-control-background-color);
}
/*
.mediaPlayer_editBackward, .mediaPlayer_editForward {
margin-top:6px;
cursor:pointer;
}
*/
.mediaPlayerControl .play {
width:35px;
height:32px;
cursor:pointer;
/* background:url(../graphic/default/player/control.png) no-repeat -10px 0px; */
float:left;
margin:-1px 0px 0px -1px;
overflow:hidden;
}

.mediaPlayerControl .play img, .mediaPlayerControl .play svg {
margin-top:2px;
margin-left:5px;
}
.mediaPlayerControl .play svg {
margin-top:3px;
}

.mediaPlayerControl .skip-backward {
width:20px;
height:17px;
cursor:pointer;
float:left;
margin:6px -3px 0px 0px;
overflow:hidden;
}
.mediaPlayerControl .skip-forward {
width:20px;
height:17px;
cursor:pointer;
float:left;
margin:6px 0px 0px 3px;
overflow:hidden;
}

.mediaPlayerControl .progress {
width:calc(100% - 340px);
min-width:90px;
height:32px;
/* width:390px; */
cursor:pointer;
margin-top:0px;
margin-left:7px;
padding-right:2px;
background:transparent;
/* border:1px solid #afafaf; */
float:left;
overflow:hidden;
}

.mediaPlayerControl .progressBar {
height:19px;
margin-top:5px;
/* border:1px solid #afafaf; */
border:1px solid var(--icon-icons-color);
padding-right:2px;
}

.mediaPlayerControl .bufferBar {
height:17px;
width:0px;
/*
border:1px solid #afafaf;
background:#afafaf;
*/
border:1px solid var(--icon-icons-color);
background:var(--icon-icons-color);
margin-top:0px;
margin-right:5px;
position:absolute;
opacity:0.4;
margin-right:1px;
}

.mediaPlayerControl .timeBar {
height:15px;
width:0px;
margin-top:1px;
margin-left:1px;
margin-right:2px;
/* background:#5b5b5b; */
background:var(--icon-icons-color);
position:absolute;
}

.mediaPlayerControl .autoplay {
width:18px;
height:17px;
cursor:pointer;
float:right;
margin:5px 12px 0px -5px;
overflow:hidden;
display:none;
}

.mediaPlayerControl .current {
margin-left:5px;
margin-top:2px;
text-align:left;
float:left;
}

.mediaPlayerControl .duration {
margin-right:10px;
margin-top:2px;
float:right;
text-align:right;
}

.mediaPlayerControl .current,
.mediaPlayerControl .duration {
width:50px;
height:20px;
/* font-size:18px; */
font-weight:bold;
margin-top:6px;
}

.mediaPlayerControl .speedControl {
/* font-size:18px; */
font-weight:bold;
float:right;
margin-top:6px;
margin-right:16px;
}

.mediaPlayerControl .volume {
width:38px;
height:31px;
cursor:pointer;
margin-top:0px;
margin-right:-5px;
float:right;
overflow:hidden;
display:none;
}

.mediaPlayerControl .volume svg.volumeControl {
margin-top:5px;
}

.mediaPlayerControl .fullscreen {
width:35px;
height:31px;
cursor:pointer;
margin:-2px -4px 0px 8px;
float:right;
overflow:hidden;
}

.mediaPlayerControl .fullscreen img, .mediaPlayerControl .fullscreen svg {
margin-top:4px;
}

.mediaPlayerControl .fullscreen img, .mediaPlayerControl .fullscreen svg {
margin-top:7px;
margin-left:-10px;
}

.thumbnailPreview {
width:142px;
height:80px;
margin-top:-150px;
position:absolute;
display:none;
background:#000000;
overflow:hidden;
}

.thumbnailPreviewMedia {
width:142px;
height:80px;
overflow:hidden;
}

.thumbnailPreviewTime {
width:142px;
height:20px;
padding-top:2px;
color:#FFFFFF;
}

.uploadContainerLabelText {
/* Container hat eine Style Definiton $display, daher muessen wir opacity nehmen */
opacity:0;
}
/**
Falls der Player (in Album Ansicht) immer nur Mindest-Groesse haben soll, dann wuerde
man diese Definitionen benoetigen. Der Player waere dann immer nur so gross wie das Medium,
wuerde aber natuerlich staendig in der Hoehe springen (zwischen hoeher und weniger
hoeheren Medien)
.mediaPlayerContainer {
height:auto;
max-height:calc(100% - 0px);
}
.switchPushMedia, .switchMedia, video, .mediaPlayerMediaWrapper {
height:auto;
max-height:calc(100% - 0px);
}
.mediaPreviewMedia, .mediaPlayerMediaWrapper {
height:auto;
max-height:calc(100vh - 220px);
}
.mediaPlayerControlWrapper {
margin-top:-51px;
}
.mediaPlayerControl {
margin-bottom:-20px;
}
*/

@media all and (min-width: 500px) {
.mediaPlayerControl .autoplay {
display:block;
}
.mediaPlayerControl .volume {
display:block;
}
}
/* dynamic.build.css */
/* /sapi/css/?dynamicBuild=1 dynamic build */

.bg1 {
border:1px solid var(--bg1-border-color);
}

.uploadFileProgress {outline:1px solid var(--bg1-border-color);}

.bg1-dashed {border:1px dashed var(--bg1-border-color);}
.bg1-bt {border-top:1px solid var(--bg1-border-color);}
.bg1-br {border-right:1px solid var(--bg1-border-color);}
.bg1-bl {border-left:1px solid var(--bg1-border-color);}
.bg1-bb {border-bottom:1px solid var(--bg1-border-color);}

.bg1 {
background:var(--bg1-background-color);
}

.uploadFileProgressBar {background:var(--bg1-background-color);}
.bg1-bg {background:var(--bg1-background-color);}

.bg1, div.error {
border-radius:var(--bg1-border-radius);
}

.canvasColorIcons path {
fill:var(--icon-icons-color);
}

.canvasColorLogo path {
fill:var(--icon-logo-color);
}

.color2 {
color:var(--font-secondary-color);
}

.color2-bg {background:var(--font-secondary-color);}
.color2-border {border: 1px solid var(--font-secondary-color);}
.color2-outline {outline: 1px solid var(--font-secondary-color);}
.color2-bt {border-top: 1px solid var(--font-secondary-color);}
.color2-br {border-right: 1px solid var(--font-secondary-color);}
.color2-bb {border-bottom: 1px solid var(--font-secondary-color);}
.color2-bl {border-left: 1px solid var(--font-secondary-color);}
.color2-border-dashed {border: 1px dashed var(--font-secondary-color);}

.color2-outline-dashed {outline: 1px dashed var(--font-secondary-color);}

.dropdownHeader, .dropdownContainer, .popupActive .popupWrapper {
border-radius:var(--dropdown-border-radius);
}

.dropdownHeader {
border-radius:var(--dropdown-header-border-radius);
}

.dropdownContainer {
border-radius:var(--dropdown-container-border-radius);
}

.dropdownContainerRight {
border-radius:var(--dropdown-container-right-border-radius);
}

.dropdownHeader, .dropdownContainer, .popupWrapper {
border:1px solid var(--dropdown-border-color) !important;
}

.dropdownHeader-dashed {border:1px dashed var(--dropdown-border-color) !important;}
.dropdownHeader-bt {border-top:1px solid var(--dropdown-border-color) !important;}
.dropdownHeader-br {border-right:1px solid var(--dropdown-border-color) !important;}
.dropdownHeader-bl {border-left:1px solid var(--dropdown-border-color) !important;}
.dropdownHeader-bb {border-bottom:1px solid var(--dropdown-border-color) !important;}

.dropdownContainer-dashed {border:1px dashed var(--dropdown-border-color) !important;}
.dropdownContainer-bt {border-top:1px solid var(--dropdown-border-color) !important;}
.dropdownContainer-br {border-right:1px solid var(--dropdown-border-color) !important;}
.dropdownContainer-bl {border-left:1px solid var(--dropdown-border-color) !important;}
.dropdownContainer-bb {border-bottom:1px solid var(--dropdown-border-color) !important;}

.popupWrapper-dashed {border:1px dashed var(--dropdown-border-color) !important;}
.popupWrapper-bt {border-top:1px solid var(--dropdown-border-color) !important;}
.popupWrapper-br {border-right:1px solid var(--dropdown-border-color) !important;}
.popupWrapper-bl {border-left:1px solid var(--dropdown-border-color) !important;}
.popupWrapper-bb {border-bottom:1px solid var(--dropdown-border-color) !important;}

.dropdownHeader, .dropdownOverlay, .dropdownContainer, .popupWrapper {
background:var(--dropdown-background-color);
}

.dropdownHeader-bg {background:var(--dropdown-background-color);}

.dropdownOverlay-bg {background:var(--dropdown-background-color);}

.dropdownContainer-bg {background:var(--dropdown-background-color);}

.popupWrapper-bg {background:var(--dropdown-background-color);}

.error {
border:1px solid var(--system-notification-error-border-color);
}

.error-dashed {border:1px dashed var(--system-notification-error-border-color);}
.error-bt {border-top:1px solid var(--system-notification-error-border-color);}
.error-br {border-right:1px solid var(--system-notification-error-border-color);}
.error-bl {border-left:1px solid var(--system-notification-error-border-color);}
.error-bb {border-bottom:1px solid var(--system-notification-error-border-color);}

.error {
color:var(--system-notification-error-color);
}

.error-color {
color:var(--system-notification-error-color);
}

.hoverContainer, div.counter {
background:var(--system-notification-background-color);
}


.canvasColorIconsActive path {
fill:var(--system-notification-background-color) !important;
}


.highlightContainer {
border:1px solid var(--system-notification-background-color) !important;
font-weight:bold;
}


.hoverContainer-bg {background:var(--system-notification-background-color);}

.mediaPlayerContainerFullscreen {
background:var(--media-player-fullscreen-background-color);
}

.mediaPlayerContainerFullscreen-bg {background:var(--media-player-fullscreen-background-color);}

.mediaPlayerContainerImage {
background:var(--image-player-background-color);
}

.mediaPlayerContainerImage-bg {background:var(--image-player-background-color);}

.mediaPlayerContainerVideo {
background:var(--video-player-background-color);
}

.mediaPlayerContainerVideo-bg {background:var(--video-player-background-color);}

.mediaPlayerControlImage {
background:var(--image-player-control-background-color);
}

.mediaPlayerControlImage-bg {background:var(--image-player-control-background-color);}

.mediaPlayerControlVideo {
background:var(--video-player-control-background-color);
}

.mediaPlayerControlVideo-bg {background:var(--video-player-control-background-color);}

.online {
color:var(--font-online-color);
}

.online-bg {background:var(--font-online-color);}

a, a.noHover:hover, .dropdownLayer > div:nth-child(2) > div > a:hover, .dropdownContainer > a:hover, .dynamicGroups > a:hover, a.dropdown:hover, .containerHover > a:hover {
color:var(--font-link-color);
}

a:hover {
color:var(--font-link-hover-color);
}

a.active, .color-a-hover, span.dropdownTitle:hover {color:var(--font-link-hover-color);}

body {
background-repeat:var(--body-background-image-repeat);
}

body {
background-position:var(--body-background-image-position);
}

body {
background:var(--body-background-color);
}

.body-bg {background:var(--body-background-color);}

body {
background-attachment:var(--body-background-image-attachment);
}

body, .color1, .label {
color:var(--font-primary-color);
}

.color-border {border: 1px solid var(--font-primary-color);}
.color-outline {outline: 1px solid var(--font-primary-color);}
.color-border-dashed {border: 1px dashed var(--font-primary-color);}
.color-outline-dashed {outline: 1px dashed var(--font-primary-color);}
.color-bg {background:var(--font-primary-color);}

.color1-bg {background:var(--font-primary-color);}
.color1-border {border: 1px solid var(--font-primary-color);}
.color1-outline {outline: 1px solid var(--font-primary-color);}
.color1-bt {border-top: 1px solid var(--font-primary-color);}
.color1-br {border-right: 1px solid var(--font-primary-color);}
.color1-bb {border-bottom: 1px solid var(--font-primary-color);}
.color1-bl {border-left: 1px solid var(--font-primary-color);}
.color1-border-dashed {border: 1px dashed var(--font-primary-color);}

.color1-outline-dashed {outline: 1px dashed var(--font-primary-color);}

body, .contentOuter {
max-width:var(--body-max-width);
}

div.counter {
color:var(--system-notification-color);
}

h1,h2,h3,h1 a,h2 a,h3 a {
color:var(--font-headline-color);
}

.colorPickerItemIcon {
border-color:var(--font-headline-color);
}

img {
border-radius:var(--image-border-radius);
}

img, .mediaPlayerContainer {
border-radius:var(--media-border-radius);
}

input[type=submit], input[type=button], input[type=reset] {
background:var(--button-background-color);
}

a.active {color:var(--button-background-color);}

.buttonBackground {background:var(--button-background-color);}

input[type=submit], input[type=button], input[type=reset] {
border:1px solid var(--button-border-color);
}

input[type=submit], input[type=button], input[type=reset] {
color:var(--button-color);
}

input[type=submit], input[type=button], input[type=reset] {
border-radius:var(--button-border-radius);
}

input[type=text], input[type=password], input[type=checkbox], input[type=file], select, textarea, input[type="date"], input[type="email"], input[type="tel"] {
border-radius:var(--input-border-radius);
}

input[type=text], input[type=password], input[type=checkbox], input[type=file], select, textarea, input[type="date"], input[type="email"], input[type="tel"] {
background:var(--input-background-color);
}

.inputBackground, input-bg {
background-color: var(--input-background-color);
}

input[type=text], input[type=password], input[type=checkbox], input[type=file], select, textarea, input[type="date"], input[type="email"], input[type="tel"] {
border:1px solid var(--input-border-color);
}

.inputBorder {
border: 1px solid var(--input-border-color);
}

input[type=text], input[type=password], input[type=checkbox], input[type=file], select, textarea, input[type="date"], input[type="email"], input[type="tel"] {
color:var(--input-color);
}

.inputColor {
color: var(--input-color);
}