/*6a78e687-9055-48d1-befc-ef78b44e9cde*/
:root {
    --acolor-white: #ffffff;
    --acolor-selected: #e2edea;
    --acolor-dark: #223322;
    --acolor-black: #000000;
    --acolor-middle: #99bb99;
    --acolor-light: #eeffee;
    --acolor-verylight: #bbccbb;
    --acolor-offwhite: #eeeeee;
    --acolor-buttontext: #223322;
    --acolor-menu: #cde4d2;
    --acolor-menutext: #223322;
    --acolor-menulight: #cde4d2;
    --acolor-header: #668866;
    --acolor-editcaption: #b00303;
    --acolor-calendarday: #778866;
    --acolor-resize: #778866;
    --acolor-lightred: #ffeeee;
    --acolor-alternatingeven: #f1f4f1;
    --acolor-alternatingodd: #ffffff;
    --acolor-darken: rgba(20,40,40,0.2);
    --acolor-bluish: rgb(207, 220, 251);
}
html,
body,
.content {
    height: 100%;
}
body {
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    font-size: 1rem;
    font-family: arial;
    top: 0;
    left: 0;
    margin: 0;
    overflow: hidden;
}
.content {
    display: flex;
    flex-direction: column;
}
#divmainbuttoncontainer {
    right: 0;
    display: flex;
    flex-wrap: wrap;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    align-items: center;
}
#buttonloginregister{
    align-self:flex-end;
}
#menusystem {
    flex-shrink: 0;
    padding: 0.2rem;
    font-size: 1.5rem;
    flex-grow: 1;
    display: flex;
    flex-direction: row-reverse;
}
#menusystemname {
    margin-right: 0.5rem;
}
#divloginbuttons {
    padding-top: 0.5rem;
    padding-bottom: 0.2rem;
    display: flex;
    flex-direction: row-reverse;
}
#divpopup {
    flex-direction: row-reverse;
    justify-content: center;
}
.blink_me {
    animation: blinker 1s linear infinite;
}
@keyframes blinker {
    50% {
        opacity: 0;
    }
}
.richcontainer {
    display: block;
    overflow-x: auto;
}
p {
    display: block;
    margin-block-start: 0rem;
    margin-block-end: 0rem;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
.adminurtoolbar {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    background-color: var(--acolor-white);
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
.selectoverlay {
    box-shadow: 0 0 1rem 0.3rem rgba(0, 0, 0, 0.4);
    z-index: 10;
    position: absolute;
    top: -1rem;
    min-width: 10rem;
    max-height: 10rem;
    border-radius: 0.3rem;
    padding: 0.3rem;
    overflow-y: scroll;
    background-color: var(--acolor-white);
    flex-direction: column;
    display: flex;
}
.closebutton {
    align-self: end;
    z-index: 100;
    right: 0;
    position: absolute;
}
.selectedoption{
    font-weight:bold;
    background-color:var(--acolor-selected);
}
.selectoverlaycontainer {
    display: inline;
    position: relative;
    left: 0.4rem;
    top: 1rem;
}
option.selectoverlay:hover {
    background-color: yellow;
}
.adminureditor {
    width: 100%;
    background-color: var(--acolor-white);
    border-bottom-left-radius: 0.3rem;
    border-bottom-right-radius: 0.3rem;
}
.popupcontent {
    object-fit: cover;
    max-height: 100%;
    max-width: 100%;
}
.adminureditorcontainer {
    width: 100%;
    display: flex;
    /*min-height:12rem;*/
    word-break: break-all;
    /*width: 95%;*/
    clear: both;
    flex-direction: column;
    background-color: var(--acolor-white);
}
.bottomcontainer {
    text-align: center;
    padding: 1rem;
    color: var(--acolor-menutext);
    font-weight: bold;
    background-color: rgba(160,200,150,1);
}
.headercontainer {
    z-index: 100;
    flex: 0 0 auto;
    display: flex;
    flex-direction: row;
}
.rowcontainer {
    width: 100%;
    display: flex;
    flex-shrink: 0;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
}
.itembutton {
    padding: 0.2rem;
}
.hoverfield:hover {
    /*background-color: var(--acolor-selected) !important;*/
    /*border-radius: 1.1em;*/
    /* border: 0.3rem solid var(--acolor-verylight);*/
}
.labelstyle {
    margin-left: 1rem;
    margin-right: 1rem;
    padding-top: 0.2rem;
    margin: 0.3rem;
    width:100%;
}
.infoval {
    cursor: auto;
    display: flex;
    flex-wrap: wrap;
    word-break: break-word;
    word-wrap: break-word;
    width: 100%;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -o-pre-wrap;
    margin-left: 0.2rem;
}
.infoval img {
    max-width: 100%;
}
.viewcontent {
    border: thin solid var(--acolor-offwhite);
    color: var(--acolor-dark);
    overflow: hidden; 
    flex: 1 1 auto;
    position: relative;
    overflow-x: hidden; 
    display: flex;
}
.informationtitle {
    margin: 0.2rem;
}
.tableheader {
    vertical-align: middle;
    color: var(--acolor-buttontext);
    background-color: var(--acolor-menu);
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    flex-grow: 0;
    -webkit-flex-grow: 0;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    width: 100%;
}
.tableheader::-webkit-scrollbar {
    width: 2rem;
    background: transparent;
}
.scrollbarpadding {
    overflow-y: scroll;
    visibility: hidden;
}
.tableheader::-scrollbar {
    width: 2rem;
    background: transparent;
}
.tableheadcell {
    cursor: pointer;
    display: flex;
    align-items: flex-end;
}
.linechart {
    width: 50rem;
    display: flex;
    height: 50rem;
    align-self: center;
}
#menulogo {
    padding-right: 0.4rem;
    height: 1.8rem;
    align-self: center;
    object-fit: contain;
}
.menusystem {
    text-align: center;
    font-size: 3.9rem;
    line-height: 3.8rem;
    /* margin-right: 1rem; */
    flex-grow: 1;
    margin-bottom: 1rem;
}
.hidden{
    display:none;
}
.dataitem:nth-child(even) {
    /*background: var(--acolor-alternatingeven)*/
}
.dataitem:nth-child(odd) {
    /*background: var(--acolor-alternatingodd)*/
}
.dataitem:hover:not(#selectarea):not(.edititem) {
    background: var(--acolor-offwhite)
}
.header {
    font-weight:bold;
    pointer-events:all;
    background-color:#f3fff3;
    border-bottom:  0.1rem solid var(--acolor-header);
        border-right:  0.1rem solid var(--acolor-header);
}
.targetprio
{
    position:absolute;
    height:2rem;    
    margin-top:-1rem;
    z-index: 20;
}
.sepnode {
    height:0.001rem;
    cursor: pointer;
    width:100%;
}
#divtableheader {
    min-height: 0.3rem;
}
#selectareacontainer {
    display: flex;
}
#divlogout {
    display: flex;
    flex-direction: column;
}
#divloading {
    z-index: 2000;
    font-weight: bold;
    opacity: 0.8;
}
#divselectareaheader {
    /*box-shadow: 0 0 1em 0.3em rgba(0, 0, 0, 0.4);*/
}
#divselectareapopup {
    z-index: 150;
    top: 3rem;
}
#selectareapopupcontainer {
    display: compact;
    margin: auto;
    min-width: 15rem;
    background-color: var(--acolor-light);
    box-shadow: 0 0 1em 0.3rem rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
}
.divover {
    display: none;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 200;
    position: fixed;
    justify-content: center;
    align-items: center;
    width: 100%;
/*    height: 100%;*/
    overflow-y: auto;
    background: linear-gradient(7deg, rgb(239, 255, 241) 0%, rgb(255, 255, 255) 40%, rgb(240, 255, 242) 80%);
}
  .thumb {
    height: 1rem;
    border: 1rem solid var(--acolor-black);
  }
.smallimage{
    height:2rem;
        top:0;
    padding:0.21rem;
}
form {
    margin: 0;
    display: flex;
    flex-direction: column;
}
.smallbutton{
    align-self:flex-start;
}
.expandbutton {
    top:0;
    padding:0.21rem;
}
.uploadbutton {
    top:0;
    padding:0.21rem;
    cursor: pointer;
}
.source {
    background-color:var(--acolor-middle);
}
.helptext {
    font-style: italic;
    color: var(--acolor-black);
    font-weight: lighter;
}
.center {
    padding: 0.5rem;
    width: 25rem;
    min-width: 15rem;
    max-width: 90%;
    border-radius: 1.1rem;
    /*background-color: var(--acolor-light);*/
    display: flex;
    /*box-shadow: 0 0 0.5rem 0.1rem rgba(0, 0, 0, 0.2);*/
    flex-direction: column;
}
.selecteditem:not(#selectarea):not(.dayitem) {
    /*background-color: var(--acolor-selected) !important;*/
    border: 0 !important;
    /* filter: brightness(0.95) hue-rotate(4deg); */
    box-shadow: inset 0rem 0rem 0rem 0.2rem rgba(0, 0, 0, 0.4) !important;
}
.editcaption {
    font-weight: bold;
    color: var(--acolor-editcaption);
    margin: 0.2rem;
}
.edititem:not(#selectarea) {
    /*box-shadow: inset 0rem 0rem 0rem 0.2rem rgba(0, 0, 0, 0.4) !important;*/
    flex-direction: row;
}
.menubutton:hover, .largebutton:hover, .hugebutton:hover{
    background-color: var(--acolor-middle) !important;
}
.dragovertarget {
    filter: brightness(50%);
    background-color:var(--acolor-middle)!important;
    min-height: 1rem;
}
.thumblink {
    cursor: pointer;
}
.itemtext {
    padding: 0.25rem;
    display: flex;
    flex-direction: column;
/*    flex-grow:1;*/
}
.itemtabletext {
    /*flex-grow: 1;*/
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-height: 1px;
    padding-top: 0.4rem;
    padding-right: 0.1rem;
    padding-bottom: 0.4rem;
    padding-left: 0.4rem;
}
.filters {
    border: 0.3rem solid var(--acolor-menu);
    background-color: var(--acolor-menulight);
    color: var(--acolor-menutext);
    flex-wrap: wrap;
}
.filter {
    padding: 0.3em;
}
.listmenuitem {
    cursor: pointer;
    margin: 0.3rem;
    font-weight: bold;
    padding: 1rem;
    width: 80%;
    background-color: var(--acolor-verylight);
    border-radius: 0.3em;
}
.bow {
    width: 1em;
    height: 0.7em;
    margin-top: 0.8em;
}
.viewbutton {
    align-items: center;
    display: flex;
    color: var(--acolor-buttontext);
    cursor: pointer;
    height: 1.5rem;
    white-space: nowrap;
    padding-top: 0.2rem;
    margin-top: 1rem;
    font-weight: bold;
}
.viewbuttoncontent {
    background-color: var(--acolor-menu);
    color: var(--acolor-buttontext);
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 0.2rem;
    padding-top: 0.2rem;
    border-top-left-radius: 1.1rem;
    border-top-right-radius: 1.1rem;
    font-weight: bold;
}
.whitefilter {
    color: transparent!important;
    text-shadow: 0 0 0 black;
}
.hugebutton {
    padding-top: 2rem;
    padding-bottom: 2rem;
    text-align: center;
    margin-bottom: 1rem;
    margin-top: 1rem;
    font-size: xxx-large;
    background-color: var(--acolor-menu);
    color: var(--acolor-buttontext);
    cursor: pointer;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 0.3rem;
    margin: 0.2rem;
    font-weight: bold;
    white-space: nowrap;
}
.largebutton {
    flex: 1;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: large;
    background-color: var(--acolor-menu);
    color: var(--acolor-buttontext);
    cursor: pointer;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 0.3rem;
    margin: 0.2rem;
    font-weight: bold;
    white-space: nowrap;
}
.largeinput {
    padding: 1rem !important;
    border-radius: 0.5rem;
}
.menubutton {
    background-color: var(--acolor-menu);
    color: var(--acolor-buttontext);
    line-height: 1.6rem;
    cursor: pointer;
    height: 1.3rem;
    /*box-shadow: 0.2em 0.2em 0.5em 0.05em rgba(0, 0, 0, 0.4);*/
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.2rem;
    padding-bottom: 0.4rem;
    border-radius: 0.3rem;
    margin: 0.2rem;
    font-weight: bold;
    white-space: nowrap;
}
.fullbutton{
    width:auto;
}
.dropdownmenu {
    display: none;
    overflow-y: auto;
    top: 3rem;
    z-index: 200;
    background: var(--acolor-menu);
    position: absolute;
    max-width: 100%;
    max-height: 80%;
    border-radius: 0.5rem;
    height: auto;
    box-shadow: 0.2em 0.2em 0.5em 0.05em rgba(0, 0, 0, 0.4);
    flex-direction: column;
}
#spanme {
    width:auto;
    text-align:right;
}
#contentcontainer {
    display: flex;
    overflow:hidden;
    flex:1;
}
#divmaincontent {
    min-height: -webkit-min-content;
    color: var(--acolor-dark);
    display: flex;
    flex: 1 1 auto;
    position: relative;
    min-height: 100%;
    width: 100%;
    overflow:hidden;
}
#divmaincontentcontainer {
    width: 60%;
    flex: 1 1 0%;
    overflow-y: scroll;
}
#divdrag {
    opacity: 0.8;
    z-index: 500;
    overflow: hidden;
    position: fixed;
    pointer-events: none;
    box-shadow: 0.3em 0.3em 0.3em rgba(0, 0, 0, 0.4);
}
input[type=checkbox] {
    -ms-transform: scale(2); /* IE */
    -moz-transform: scale(2); /* FF */
    -webkit-transform: scale(2); /* Safari and Chrome */
    -o-transform: scale(2); /* Opera */
    margin-right: 1rem;
    margin-left: 0.5rem;
    margin-top: 0.5rem;
}
.subcontainer {
    border-radius: 0.4rem;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.thtitle {
    overflow: hidden;
    display: flex;
    margin: 0.2rem;
    flex-grow: 1;
}
#selectarea {
    width: 100%;
    overflow-y: auto;
    padding: 1.5%;
    flex-wrap: wrap;
    display: flex;
    align-content: flex-start;
}
.colresize {
    cursor: col-resize;
    width: 0.5em;
    height: 100%;
    z-index: 100;
    display: flex;
    align-self: flex-end;
    flex-grow: 0;
    flex-shrink: 0;
}
.tableheadcell:hover .colresize {
    background-color: var(--acolor-resize);
}
input[type=datetime-local], input[type=text], input[type=time], input[type=number], select, input[type=password], input[type=date]:not([type='checkbox']) {
    font-size: 1rem;
    outline: 0;
    /*    border-radius: 0.4rem;*/
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    margin: 0.2rem;
    border-bottom: 1px solid black;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}
.darkheader{
}
#divfilters{
    display:flex;
}
#menuhamburger{
    margin-top:0.4rem;
}
.menuitem {
    padding: 1rem;
    cursor: pointer;
}
.dataitem {
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    white-space: nowrap;
    background-color:var(--acolor-white);
    flex-shrink: 0;
    border-bottom: solid 1px var(--acolor-offwhite);
}
.itemtitle {
    width: 95%;
    flex-shrink: 0;
    padding-top: 0.3rem;
    padding-left: 0.5rem;
    padding-bottom: 0.3rem;
}
.listitem {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
/*    padding:0.2rem;*/
}
.tableitem {
    flex-direction: row;
    display: -webkit-flex;
    display: flex;
    flex-grow: 0;
    -webkit-flex-grow: 0;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}
.calendaritem {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
.calendarweekitem {
    width: 100%;
    flex: 1;
    display: flex;
}
.smalltext {
    font-size: x-small;
    align-self: center;
}
.portrait {
    width: 2.5rem;
    object-fit: cover;
    height: 2.5rem;
    margin-right: 0.2rem;
    border-radius: 4rem;
    background-color: var(--acolor-offwhite);
    text-align: center;
    font-weight: 900;
    color: var(--acolor-middle);
}
.smallportrait {
    width: 1.5rem;
    object-fit: cover;
    height: 1.5rem;
    margin-right: 0.2rem;
    border-radius: 4rem;
    background-color: var(--acolor-offwhite);
    text-align: center;
    font-weight: 900;
    font-size: small;
    color: var(--acolor-middle);
}
.calendarday {
    cursor: pointer;
    overflow: hidden;
    flex-basis: 14%;
    flex-grow: 1;
    color: var(--acolor-calendarday);
    overflow: hidden;
    border: 1px solid;
}
.calendardayheader {
    width: 14%;
    flex: 1;
    display: flex;
    border: 0.2em solid var(--acolor-selected);
    border-radius: 0.4rem;
    padding: 0.3rem;
    margin: 0.2rem;
    color: var(--acolor-buttontext);
    overflow: hidden;
}
.redday {
    background-color: var(--acolor-lightred);
}
.blackday {
    background-color:var(--acolor-offwhite);
}
.nonmonthday {
    background-color: var(--acolor-selected);
    cursor:default;
}
.dayitem {
    background-color: var(--acolor-header);
    border-radius: 0.3em;
    color: var(--acolor-buttontext);
    font-size: smaller;
    margin-left: 0.5rem;
    margin: 0.1rem;
}
.bigdayitem {
    position: absolute;
    min-height: 1.5rem;
    background-color: var(--acolor-header);
    border-radius: 0.3em;
    color: var(--acolor-buttontext);
    font-size: smaller;
    box-sizing: border-box;
    filter: opacity(0.6);
    border: 1px solid white;
    cursor: pointer;
    width: 100%;
}
.hourmarker {
    width: 100%;
    flex-basis: 100%;
    flex-shrink: 0;
    height: 2rem;
    color: grey;
    /*border-top: 1px solid;*/
    position: relative;
    box-sizing: border-box;
    background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.0) 2%, rgba(0, 0, 0, 0.0) 3%, rgba(0, 0, 0, 0.0) 97%);
}
.daychannelcontainer {
    width: calc(100% - 3rem);
    display: flex;
    flex-direction: row;
    height: 2400%;
    position: absolute;
    top: 0;
    left: 3rem;
    z-index: 10;
}
.daychannel {
    flex: 1;
    display: block;
    position: relative;
}
.selectedday {
    background-color: var(--acolor-bluish);
}