.ao{ 
	--gradient: linear-gradient(270deg, rgba(0,82,156,1) 0%, rgba(0,173,239,1) 100%);
	--shadow: 0px 0px 3px #aaa;
	--blue: #00529c;
	--lightblue: #00adef;
	--gray: #dcdcdc;
	--lightgray: #ececec;
}

.ao ::-webkit-scrollbar{ width: 8px; height: 8px; }
.ao ::-webkit-scrollbar-track{ background: var(--blue); }
.ao ::-webkit-scrollbar-thumb{ background: var(--lightblue); border-left: 1px solid #fff; }
.ao ::-webkit-scrollbar-thumb:hover{ background: var(--lightblue); }

.ao{ width: 100%; height: 100%; padding: 4em 0em 0em 4em; overflow: hidden; }

.ao-size-1>*{ font-size: 1.125em; }
.ao-size-2>*{ font-size: 1.25em; }

.ao-burger{ display: none; }
.ao-expand{ display: none; }

.ao-header{ height: 100%; position: fixed; top: 0; left: 0; z-index: 100; width: 4em; flex: 0 0 4em; }
.ao-header{ overflow: hidden; transition: all .25s; }
.ao-header:hover{ width: 20em; flex: 0 0 20em; }
.ao-header{ background: #fff; box-shadow: var(--shadow); }
.ao-nav{ height: 100%; width: 100%; padding: 1px; display: flex; flex-direction: column; align-items: center; }
.ao-nav>*{ width: 100%; }
.ao-logo{ text-decoration: none !important; height: 4em; width: 100%; }
.ao-logo{ display: flex; align-items: center; justify-content: center; }
.ao-logo{ background: url(/img/icon.png) no-repeat center center / auto 2.5em; background-color: var(--lightgray); }
.ao-header:hover .ao-logo{ background-image: url(/img/logoh.png); }

.ao-menu{ flex-grow: 1; overflow-x: hidden; overflow-y: auto; position: relative; }
.ao-menu-li{ border-bottom: 1px dashed var(--gray); }
.ao-menu-item{ display: flex; width: 100%; align-items: center; text-decoration: none; }
.ao-menu-item{ cursor: pointer; padding: .75em; color: #000 !important; }
.ao-menu-item:focus{ background: var(--blue); color: #fff !important; outline: none; text-decoration: none; }
.ao-menu-icon{ height: 2.25em; width: 2.25em; margin-right: 1em; } 
.ao-menu-text{ font-size: 1.25em; white-space: nowrap; } 

.ao-submenu{ background: var(--lightgray); }
.ao-submenu-li{ border-bottom: 1px dashed #fff; }
.ao-submenu-li:last-child{ border-bottom: none; }
.ao-submenu-item{ display: flex; width: 100%; align-items: center; text-decoration: none; }
.ao-submenu-item{ cursor: pointer; padding: .75em 2em; color: #000 !important; }
.ao-submenu-item:focus{ background: var(--blue); color: #fff !important; outline: none; text-decoration: none; }
.ao-submenu-icon{ height: 1.5em; margin-right: 1em; } 
.ao-submenu-text{ font-size: 1.25em; white-space: nowrap; } 

.ao-tray{ width: 100%; overflow: hidden; display: flex; align-items: center; justify-content: flex-end; }
.ao-tray{ height: 3.25em; padding: 1px .5em; position: fixed; top: 0; left: 0; background: var(--gradient); }
.ao-tray{ z-index: 99; box-shadow: var(--shadow); border-bottom: 1px solid #fff; }
.ao-tray-item{ display: flex; overflow: hidden; align-items: center; cursor: pointer; }
.ao-tray-item{ padding: .25em .5em; color: #fff !important; }
.ao-tray-item:focus{ position: relative; text-decoration: none; z-index: 1; outline: 1px dashed #fff; }
.ao-tray-icon{ background-repeat: no-repeat; background-position: center center; background-size: cover; }
.ao-tray-icon{ margin-right: .5em; height: 2.5em; width: 2.5em; flex: 0 0 2.5em; }
.ao-tray-label{ font-size: .875em; line-height: 1em; }
.ao-tray-value{ white-space: nowrap; }
.ao-tray-value{ font-size: 1em; font-weight: bold; }
.ao-tray-worker-value{ display: flex; align-items: center; }
.ao-tray-remove{ height: 1.25em; width: 1.25em; flex: 0 0 1.25em; margin-left: .25em; filter: grayscale(1) brightness(10); }
.ao-tray-remove:focus{ filter: grayscale(1) brightness(10); outline: 1px dashed #fff; }
.ao-tray-size-icon{ background-image: url(/img/menu.size.png); }
.ao-tray-icon[class*="off"]{ filter: grayscale(1); }
.ao-tray-workshop-icon{ background-image: url(/img/menu.workshops.png); }
.ao-tray-worker-icon{ background-image: url(/img/menu.workers.png); }
.ao-tray-user-icon{ background-image: url(/img/menu.user.png); }

.ao-disconnect{ display: flex; align-items: center; padding: .5em; cursor: pointer; }
.ao-disconnect-icon{ height: 1.75em; margin-right: 1em; filter: saturate(0) brightness(10); }
.ao-disconnect-text{ font-size: 1.125em; color: #fff; }
.ao-disconnect:focus{ outline-color: #fff; }

.ao-author{ width: 100%; padding: 1px; white-space: nowrap; }
.ao-author-link{ display: flex; width: 100%; align-items: center; justify-content: center; padding: .5em; }
.ao-author-link{ text-decoration: none; }
.ao-author-text{ display: none; margin-right: 1em; font-size: .75em; }
.ao-author-icon{ height: 1.5em; width: 4em; background: url(/core/img/emiagic.png) no-repeat center center / contain; }
.ao-header:hover .ao-author-text{ display: block; }

.ao-body{ flex-grow: 1; overflow: hidden; position: fixed; }
.ao-body{ top: 3.25em; left: 4em; width: calc(100% - 4em); height: calc(100% - 3.25em); }
.ao-view{ height: 100%; width: 100%; overflow-y: auto; }

.ao a{ color: var(--blue); }
.ao button, .ao .button, .ao .core-button{ background: var(--blue); border: 1px solid var(--blue); color: #fff; }
.ao button:focus, .ao .button:focus, .ao .core-button:focus{ background: var(--blue); border: 1px solid var(--blue); color: #fff; }
.ao button:focus:before, .ao .button:focus:before, .ao .core-button:focus:before{ filter: grayscale(1) brightness(10); }
.ao button:focus:after, .ao .button:focus:after, .ao .core-button:focus:after{ filter: grayscale(1) brightness(10); }
.ao button[disabled], .ao .button[disabled], .ao .core-button[disabled]{ background: none; border: 1px solid var(--gray); color: #aaa; }
.ao button[disabled]:before, .ao .button[disabled]:before, .ao .core-button[disabled]:before{ filter: grayscale(1); opacity: .375; }

.ao .mi-richtext-editor .tox-tbtn{ background-color: initial; border: initial; color: initial; }

@media (max-width: 1280px){
	.ao{ display: block; }
	.ao-burger{ display: block; position: fixed; z-index: 200; top: 0em; left: 0em; height: 3.5em; width: 3.5em; cursor: pointer; }
	.ao-burger{ background: url(/img/menu.png) no-repeat center center / 2.5em 2.5em; background-color: #fff;  }
	.ao-burger:not(.expand){ left: 0em; top: 0em; box-shadow: var(--shadow); }
	.ao-header{ top: 3.5em; height: calc(100% - 3.5em); left: 0em; width: auto !important; flex: 0 0 auto !important; }
	.ao-header:not(.expand){ left: -4em; width: 4em !important; flex: 0 0 4em !important; }
	.ao-menu-item{ padding: .75em 2em .75em 1.5em; }
	.ao-logo{ background-image: url(/img/logoh.png) !important; }
	.ao-tray{ height: 3.5em; }
	.ao-body{ left: 0; top: 3.5em; width: 100%; height: calc(100% - 3.5em); }
}

.ao-calendars-icon{ background-image: url(/img/menu.calendars.png); }
.ao-organigram-icon{ background-image: url(/img/menu.organigram.png); }
.ao-tasks-icon{ background-image: url(/img/menu.todolist.png); }
.ao-tutorials-icon{ background-image: url(/img/menu.tutorials.png); }
.ao-user-icon{ background: url(/img/menu.user.png) no-repeat center center / contain; }
.ao-users-icon{ background: url(/img/menu.users.png) no-repeat center center / contain; }
.ao-workers-icon{ background-image: url(/img/menu.workers.png); }
.ao-workshops-icon{ background-image: url(/img/menu.workshops.png); }
