section.web-app-page{--main-menu-width: 85px;--sub-menu-width: 0px;--total-menu-width: calc(var(--main-menu-width) + var(--sub-menu-width));--webapp-panel-toolbar-button-border: 1px solid #CCC;position:relative;padding:0;margin:0;width:100%;height:calc(100vh - var(--webapp-header-height));display:block}section.web-app-page .menu-bar{--webapp-menu-color-hover-background: rgba(0,0,0,0.1);--webapp-menu-color-focused-background: var(--accent-colour);position:absolute;top:0;left:0;display:flex;width:var(--main-menu-width);height:100%;background-color:var(--webapp-menu-color-background);flex-direction:column;overflow:auto;padding-top:15px;flex-shrink:0;z-index:3;overflow-x:hidden;transition:transform 0.5s ease-in-out, width 0.5s ease-in-out}section.web-app-page .menu-bar .menu-item a:hover{background-color:var(--webapp-menu-color-hover-background)}section.web-app-page .menu-bar .menu-item a[data-focused="true"]{background-color:var(--webapp-menu-color-focused-background)}section.web-app-page .menu-bar .menu-item a[data-focused="true"]:hover{background-color:var(--webapp-menu-color-hover-background)}section.web-app-page .menu-bar [data-menu-collapse-button]{display:flex;position:absolute;bottom:0;right:0;font-size:10px;padding:15px;flex-direction:row;flex-wrap:nowrap;align-items:center;color:#FFF}section.web-app-page .menu-bar [data-menu-collapse-button] i{color:var(--accent-colour);font-size:24px}section.web-app-page .menu-bar [data-menu-collapse-button] span+i{margin-left:7px}section.web-app-page .sub-menu-bar{display:block;width:var(--sub-menu-width);height:100%;background-color:var(--webapp-menu-color-background);flex-shrink:0;position:absolute;top:0;left:var(--main-menu-width);z-index:2;transition:transform 0.5s ease-in-out}section.web-app-page .sub-menu-bar .title{font-weight:bold;font-size:20px;opacity:0.75;text-align:center;font-style:italic;color:var(--webapp-submenu-color-foreground);line-height:1.1em}section.web-app-page .sub-menu-bar .title+.buttons{margin-top:25px}section.web-app-page .sub-menu-bar a.button{color:var(--webapp-submenu-color-foreground);background-color:transparent;border-radius:15px;padding:0;border:1px solid var(--webapp-submenu-color-foreground);text-align:center;justify-content:center}section.web-app-page .sub-menu-bar a.button span{width:auto}section.web-app-page .sub-menu-bar a.button[data-active="true"]{border-radius:15px !important}section.web-app-page .sub-menu-bar div[data-sub-menu]{position:absolute;padding:25px;width:100%;height:100%;overflow:auto;transition:transform 0.5s ease-in-out;transform:translate3d(-200%, 0, 0);background-color:var(--webapp-submenu-color-background)}section.web-app-page .sub-menu-bar div[data-sub-menu][data-focused="true"]{transform:translate3d(0, 0, 0)}section.web-app-page .sub-menu-bar div[data-sub-menu] .buttons a{display:block;text-transform:uppercase;line-height:1em;padding:10px 15px}section.web-app-page .sub-menu-bar div[data-sub-menu] .buttons a span+i,section.web-app-page .sub-menu-bar div[data-sub-menu] .buttons a i+span{margin-left:7px}section.web-app-page .sub-menu-bar div[data-sub-menu] .buttons a:hover{background-color:var(--accent-colour-offset);color:var(--accent-colour)}section.web-app-page .sub-menu-bar div[data-sub-menu] .buttons a+a{margin-top:3px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion{position:relative;margin-top:15px;overflow:auto;scrollbar-color:var(--webapp-submenu-color-foreground) transparent;scrollbar-width:thin}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item{position:relative}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-label{padding-left:20px;position:relative;line-height:1em;font-size:14px;padding-top:7px;padding-bottom:7px;user-select:none;cursor:pointer;transition:color 0.5s ease-in-out}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-label i.fa{position:absolute;left:0;top:8px;transition:transform 1s ease-in-out;font-size:13px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-label span{color:var(--webapp-submenu-color-foreground)}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-label:hover{color:var(--accent-colour)}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content{display:block;padding-left:20px;overflow:hidden;pointer-events:none;transition:all 0.7s ease-in-out;height:1px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul{list-style-type:none;margin:0;padding:0}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li{display:block;margin:0;padding:0;transition:transform 0.5s ease-in-out}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a{display:flex;color:var(--webapp-submenu-color-foreground);flex-wrap:nowrap;width:100%;align-items:center;padding:9px 0;transition:all 0.5s ease-in-out;border-radius:7px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a i{display:block;font-size:18px;width:28px;height:28px;line-height:28px;text-align:center;flex-shrink:0}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a span{display:block;line-height:1em;width:100%}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a[data-active="true"]{background-color:rgba(0,0,0,0.1)}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a i+span,section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a span+i{margin-left:7px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content ul li a:hover{transform:translate3d(5px, 0, 0);background-color:rgba(0,0,0,0.05)}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item .item-content .accordion{margin-left:20px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item[data-open="true"] .item-label i.fa{transform:rotate(90deg)}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item[data-open="true"] .item-content{height:auto;opacity:1;pointer-events:all}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item+.item{margin-top:7px}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item[data-flat-mode="true"] .item-label{display:none}section.web-app-page .sub-menu-bar div[data-sub-menu] .accordion .item[data-flat-mode="true"] .item-content{padding-left:0;height:auto;pointer-events:all}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu{position:absolute;top:0;left:0;width:100%;height:100%;transform:translate3d(-100%, 0, 0)}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu{position:absolute;top:0;left:0;width:100%;height:100%;overflow:auto;transition:transform 0.7s ease-in-out;transform:translate3d(-200%, 0, 0);padding:25px;background-color:var(--webapp-submenu-color-background)}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .title-bar{position:relative;display:flex;flex-wrap:nowrap;align-items:center}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .title-bar [data-item-menu-close-button]{display:block;top:0;left:0;width:40px;height:40px;line-height:40px;text-align:center;font-size:24px;border-radius:50%;color:var(--accent-colour);flex-shrink:0}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .title-bar [data-item-menu-close-button]:hover{background-color:rgba(0,0,0,0.05)}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .title-bar .title{width:100%;padding-left:15px;font-weight:bold;line-height:1.1em}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu[data-focused="true"]{transform:translate3d(100%, 0, 0)}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .toolbar{margin-top:15px}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .toolbar a.button{width:100%}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu{padding:15px}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu a{display:flex;color:var(--webapp-submenu-color-foreground);flex-wrap:nowrap;width:100%;align-items:center;padding:7px 0;transition:all 0.5s ease-in-out}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu a i{display:block;font-size:18px;width:28px;height:28px;line-height:28px;text-align:center;flex-shrink:0}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu a span{display:block;line-height:1em;color:#A36B35;width:100%;font-style:italic}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu a:hover{background-color:rgba(0,0,0,0.05)}section.web-app-page .sub-menu-bar div[data-sub-menu] .items-menu .item-menu .menu a[data-active="true"]{padding-left:15px}section.web-app-page .sub-menu-bar a[data-active="true"]{background-color:var(--accent-colour-offset);color:var(--accent-colour);border-radius:7px}section.web-app-page [data-panels]{width:calc(100% - var(--total-menu-width));left:var(--total-menu-width);display:block;height:100%;z-index:1;position:absolute;top:0}section.web-app-page[data-main-menu-enabled="false"] .sub-menu-bar{left:0}section.web-app-page[data-main-menu-enabled="false"] [data-panels]{left:var(--sub-menu-width);width:calc(100% - var(--sub-menu-width))}section.web-app-page[data-submenu-enabled="false"] .sub-menu-bar{transform:translate3d(-100%, 0, 0);pointer-events:none}section.web-app-page[data-submenu-enabled="false"] [data-panels]{left:var(--main-menu-width);width:calc(100% - var(--main-menu-width))}section.web-app-page .panel-search-container{position:relative;text-align:right}section.web-app-page .panel-search-container input[type="search"]{padding:0;border:1px solid #ccc;font-weight:bold;text-align:center;font-size:16px;width:100%;height:30px;transition:all 0.5s ease-in-out;border-radius:15px}section.web-app-page .panel-search-container input[type="search"]::placeholder{font-style:italic;font-weight:normal;font-size:12px;color:#CCC}section.web-app-page .panel-search-container input[type="search"]:focus{border:1px solid #999}section.web-app-page .panel-search-container a[data-search-button]{position:absolute;right:7px;top:50%;transform:translateY(-50%)}@media only screen and (max-width: 639px){section.web-app-page [data-panels]{left:0 !important;width:100% !important}}