* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  font-family: inherit;
  margin: 0;
  padding: 0;
}

:focus,
 :active {
  outline: 0;
}

::-moz-focus-inner {
  border: 0;
}

select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

body {
  color: #333;
  font-family: Roboto, helvetica, arial, sans-serif;
  font-size: 1em;
  font-weight: 400;
  line-height: 1.5rem;
  padding: 90px 0 0;
}

h1 {
  font-size: 1.77rem;
  font-weight: 400;
  line-height: 2.77rem;
}

h2 {
  font-size: 1.61rem;
  font-weight: 400;
  line-height: 2.61rem;
}

h3 {
  font-size: 1.46rem;
  font-weight: 400;
  line-height: 2.46rem;
}

h4 {
  font-size: 1.33rem;
  font-weight: 400;
  line-height: 2.33rem;
}

h5 {
  font-size: 1.21rem;
  font-weight: 400;
  line-height: 2.21rem;
}

h6 {
  font-size: 1.1rem;
  font-weight: 400;
  line-height: 2.1rem;
}

table {
  border: 1px solid #8a8a8a;
  border-collapse: collapse;
  margin: 10px 0;
  padding: 10px;
  text-align: left;
}

table td {
  border: 1px solid #ccc;
  padding: 5px;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

pre,
code {
  background: #eee;
  font-family: Roboto Mono, monospace;
  font-size: small;
  overflow: auto;
  padding: 10px;
}

code {
  display: inline-block;
  height: 18px;
  line-height: 18px;
  margin-top: -4px;
  padding: 0 2px;
  vertical-align: middle;
}

.textfield,
.dropdown {
  display: inline-block;
  margin: 5px 0;
  position: relative;
  width: 300px;
}

.textfield_tiny,
.dropdown_tiny {
  width: 80px;
}

.dropdown_xsmall {
  width: 120px;
}

.textfield_small,
.dropdown_small {
  width: 200px;
}

.textfield_big,
.dropdown_big {
  width: 100%;
}

.textfield__input,
.textfield__textarea,
.dropdown__select {
  background: transparent;
  border: none;
  display: inline;
  font-family: Roboto Mono, monospace;
  height: 30px;
  padding: 5px 10px;
  width: 100%;
}

.textfield__input,
.textfield__textarea {
  -webkit-transition: background-color 200ms ease;
  -o-transition: background-color 200ms ease;
  transition: background-color 200ms ease;
}

.textfield__textarea {
  height: 200px;
  padding-top: 8px;
  resize: vertical;
}

.textfield__placeholder ,
.dropdown__placeholder {
  color: #60699e;
  cursor: text;
  font-weight: 700;
  left: 10px;
  top: 5px;
  position: absolute;
  -webkit-transition: font-size 200ms ease, top 200ms ease;
  -o-transition: font-size 200ms ease, top 200ms ease;
  transition: font-size 200ms ease, top 200ms ease;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.textfield__underline,
.dropdown__underline {
  background: #aaa;
  bottom: 0;
  left: 0;
  position: absolute;
  height: 1px;
  width: 100%;
}

.textfield__underline:after,
.dropdown__underline:after {
  background: #60699e;
  bottom: -1px;
  content: ' ';
  height: 2px;
  position: absolute;
  -webkit-transition: width 200ms ease;
  -o-transition: width 200ms ease;
  transition: width 200ms ease;
  width: 0;
}

.textfield__input:focus,
.textfield__textarea:focus {
  background-color: #ddd;
}

.textfield__input:disabled,
.textfield__textarea:disabled {
  color: #aaa;
  cursor: not-allowed;
}


.textfield__input:focus+.textfield__placeholder,
.textfield__textarea:focus+.textfield__placeholder,
.textfield__input_non-empty+.textfield__placeholder,
.dropdown__select:focus+.dropdown__placeholder,
.dropdown__select_non-empty+.dropdown__placeholder {
  font-size: 0.8rem;
  top: -20px;
}

.textfield__input.error+.textfield__placeholder,
.textfield__textarea.error+.textfield__placeholder,
.dropdown__select.error+.dropdown__placeholder {
  color: #f00;
}

.textfield__input:disabled+.textfield__placeholder,
.textfield__textarea:disabled+.textfield__placeholder,
.dropdown__select:disabled+.dropdown__placeholder {
  color: #aaa;
}

.textfield__input:focus+.textfield__placeholder+.textfield__underline:after,
.textfield__textarea:focus+.textfield__placeholder+.textfield__underline:after,
.textfield__input_non-empty+.textfield__placeholder+.textfield__underline:after,
.dropdown__select:focus+.dropdown__placeholder+.dropdown__underline:after,
.dropdown__select_non-empty+.dropdown__placeholder+.dropdown__underline:after {
  width: 100%;
}

.textfield__input:disabled+.textfield__placeholder+.textfield__underline:after,
.textfield__textarea:disabled+.textfield__placeholder+.textfield__underline:after,
.dropdown__select:disabled+.dropdown__placeholder+.dropdown__underline:after {
  background: #aaa;
  width: 100%;
}

.textfield__input.error+.textfield__placeholder+.textfield__underline,
.textfield__textarea.error+.textfield__placeholder+.textfield__underline,
.textfield__input.error+.textfield__placeholder+.textfield__underline:after,
.textfield__textarea.error+.textfield__placeholder+.textfield__underline:after,
.dropdown__select.error+.dropdown__placeholder+.dropdown__underline,
.dropdown__select.error+.dropdown__placeholder+.dropdown__underline:after {
  background: #f00;
}

.dropdown__select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url(/resources/imgs/icon-dropdown.png);
  background-position: right 3px center;
  background-repeat: no-repeat;
  -webkit-background-size: 20px 20px;
          background-size: 20px;
  cursor: pointer;
  height: auto;
}

.btn {
  background: #394486;
  border: 1px solid #394486;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  line-height: 32px;
  padding: 0 16px;
  text-decoration: none;
  vertical-align: middle;
}

.btn:hover {
  background: #60699e;
  text-decoration: none;
}

.btn_raised {
  -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
          box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
}

.btn_secondary {
  background: #fff;
  border: 1px solid #394486;
  color: #394486;
}

.btn_secondary:hover {
  background: #ddd;
}

.btn:disabled {
  background: #ddd;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #a6a6a6;
  cursor: not-allowed;
}

.btn:disabled:active {
  -webkit-box-shadow: none;
          box-shadow: none;
}



.date {
  background-image: url(/resources/imgs/icon-date-picker.png);
  background-position: right 3px center;
  background-repeat: no-repeat;
  -webkit-background-size: 20px 20px;
          background-size: 20px;
}

.date-picker {
  background: #fff;
  border: 1px solid #aaa;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #333;
  padding: 10px;
  position: fixed;
  width: 333px;
  z-index: 10;
}

.date-picker__nav {
  background: #dde3ea;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  width: 100%;
}

.date-picker__nav-menu {
  cursor: pointer;
  padding: 10px;
}

.date-picker__nav-heading {
  cursor: default;
  -webkit-box-flex: 4;
  -webkit-flex: 4;
      -ms-flex: 4;
          flex: 4;
  padding: 10px;
}

.date-picker__display {
  margin: 10px 0;
  width: 100%;
}

.date-picker__display-cell {
  cursor: pointer;
  padding: 5px;
  width: 14%;
}

.date-picker__display-cell_current {
  background: #dde3ea;
}

td.date-picker__display-cell:hover,
.date-picker__display-cell_selected {
  background: #2f81a7;
  color: #eee;
}

header {
  background: #1e2c3e;
  height: 60px;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 6;
}

.logo {
  display: inline-block;
  height: 60px;
  vertical-align: middle;
}

.logo img {
  display: inline-block;
  margin: 5px 0;
  height: 50px;
}

.nav {
  display: inline-block;
  float: right;
  font-family: Rajdhani, serif;
  max-width: -webkit-calc(100% - 400px);
  max-width: calc(100% - 400px);
  vertical-align: middle;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.nav__menu {
  display: inline-block;
  line-height: 60px;
}

.nav__menuitem {
  color: #fff;
  display: inline-block;
  font-size: x-large;
  height: 60px;
  padding: 0 20px;
}

.nav__menuitem:hover,
.nav__menuitem_current {
  -webkit-box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
          box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
  color: #0098cf;
  text-decoration: none;
}

.burger {
  display: none;
}

.burger__avatar {
  background: #1e2c3e;
  cursor: pointer;
  height: 60px;
  padding: 6px;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  width: 60px;
  z-index: 8;
}

.burger__avatar:hover,
.burger:checked+.burger__avatar {
  -webkit-box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
          box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
}

.burger:checked+.burger__avatar,
.burger:checked+.burger__avatar+.burger__drawer {
  -webkit-transform: matrix(1, 0, 0, 1, -300, 0);
      -ms-transform: matrix(1, 0, 0, 1, -300, 0);
          transform: matrix(1, 0, 0, 1, -300, 0);
}

.burger__avatar img {
  height: 48px;
  width: 48px
}

.burger__drawer {
  background: #eee;
  color: #333;
  bottom: 0;
  left: 100%;
  overflow-y: auto;
  padding: 10px;
  position: fixed;
  top: 0;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  width: 300px;
  z-index: 7;
}

.burger_guest section {
  margin: 10px 0;
}

.burger__drawer_user {
  padding: 0;
}

.burger__drawer_user .burger_guest {
  display: none;
}

.burger__drawer_guest .burger_user {
  display: none;
}

.burger__drawer h4,
.burger__drawer table {
  margin: 10px 0;
  width: 100%;
}

.burger__drawer h4,
.burger_user-card {
  font-family: Rajdhani, serif;
  font-size: x-large;
  font-weight: 700;
}

.burger__drawer p {
  margin: 10px 0;
}

.burger__drawer .input,
.burger__drawer .btn {
  margin: 5px;
  width: auto;
}

.burger_user-card {
  background: #171e2f;
  color: #fff;
  height: 60px;
  line-height: 60px;
  padding: 0 20px;
  width: 100%;
}

.burger-nav {
  font-size: large;
  list-style: none;
  padding: 0;
}

.burger-nav__menu {
  padding-left: 20px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.burger-nav__menu:hover,
.burger-nav__menu_current {
  background: #171e2f;
  color: #fff;
}

.burger-nav__menuitem {
  display: block;
  height: 60px;
  line-height: 60px;
  position: relative;
  width: 100%;
}

.burger-nav__menuitem:hover {
  text-decoration: none;
}

.burger-nav input[type=checkbox] {
  display: none;
}

.burger-nav__submenu {
  display: none;
  list-style: none;
}

.burger-nav input[type=checkbox]:checked+label {
  border-bottom: 1px solid #aaa;
}

.burger-nav input[type=checkbox]:checked+label+.burger-nav__submenu {
  display: block;
}

.burger-nav__submenuitem {
  display: inline-block;
  height: 60px;
  line-height: 60px;
  padding-left: 20px;
  width: 100%;
}

.burger-nav__submenuitem:hover {
  text-decoration: underline;
}

.burger-nav__icon {
  display: inline-block;
  float: right;
  height: 24px;
  margin: 16px;
}

.sub-nav {
  background: #171e2f;
  color: #fff;
  height: 30px;
  left: 0;
  list-style: none;
  position: fixed;
  right: 0;
  text-align: right;
  top: 60px;
}

.sub-nav__menu {
  display: inline-block;
}

.sub-nav__menuitem {
  display: inline-block;
  font-size: medium;
  height: 30px;
  line-height: 30px;
  padding: 0 20px;
}

.sub-nav__menuitem:hover,
.sub-nav__menuitem_current {
  -webkit-box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
          box-shadow: inset 0px 5px 5px 5px rgba(0, 0, 0, 0.3);
  color: #0098cf;
  text-decoration: none;
}

.table-of-content {
  background: #171e2f;
  bottom: 0;
  color: #fff;
  left: 0;
  top: 90px;
  overflow: auto;
  position: fixed;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  width: 300px;
}

.table-of-content__table {
  list-style: none;
}

.table-of-content__link,
.table-of-content__label {
  cursor: pointer;
  display: block;
  line-height: 30px;
  padding: 10px;
}

.table-of-content__link:hover,
.table-of-content__link_current,
.table-of-content__label:hover,
.table-of-content__toggle:checked+.table-of-content__label {
  background: rgba(255, 255, 255, .9);
  color: #171e2f;
  text-decoration: none;
}

.table-of-content__link:hover,
.table-of-content__label:hover,
.table-of-content__toggle:checked+.table-of-content__label {
  background: #fff;
  color: #171e2f;
  text-decoration: none;
}

.table-of-content__toggle,
.table-of-content__toggle+.table-of-content__label+.table-of-content__sub-table {
  display: none;
  list-style: none;
  padding-left: 20px;
}

.table-of-content__toggle:checked+.table-of-content__label+.table-of-content__sub-table {
  display: block;
}

#table-of-content {
  display: none;
}

#table-of-content+.table-of-content__burger {
  background: rgba(0,0,0,.5);
  color: #fff;
  display: none;
  font-size: 2rem;
  left: 0;
  line-height: 50px;
  position: fixed;
  text-align: center;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  top: 90px;
  width: 50px;
  z-index: 5;
}

#table-of-content+.table-of-content__burger:hover {
  background: #000;
}

.notification {
  background: #ff4c89;
  color: #fff;
  -webkit-border-radius: 50%;
          border-radius: 50%;
  display: inline-block;
  font-family: Roboto Mono, monospace;
  font-size: small;
  font-weight: 900;
  height: 20px;
  line-height: 20px;
  position: absolute;
  right: 5px;
  text-align: center;
  top: 5px;
  vertical-align: middle;
  width: 20px;
}

.burger:checked+.burger__avatar+.burger__drawer,
.btn_raised:active,
.raised {
  -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
          box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

.raised__more {
  -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
          box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);
}

.wrap {
  display: block;
  margin: 0 auto;
  max-width: 980px;
  position: static;
}

.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 100%;
}

.flex__box {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-height: 0;
}

.flex__box_medium {
  -webkit-box-flex: 2;
  -webkit-flex: 2;
      -ms-flex: 2;
          flex: 2;
  max-height: -webkit-calc(100% - 0px);
  max-height: calc(100% - 0px);
}

.flex__box_large {
  -webkit-box-flex: 3;
  -webkit-flex: 3;
      -ms-flex: 3;
          flex: 3;
  max-height: -webkit-calc(100% - 0px);
  max-height: calc(100% - 0px);
}

.flex__box_huge {
  -webkit-box-flex: 9;
  -webkit-flex: 9;
      -ms-flex: 9;
          flex: 9;
}

.flex__box_gigantic {
  -webkit-box-flex: 15;
  -webkit-flex: 15;
      -ms-flex: 15;
          flex: 15;
}

.app section {
  margin: 10px 0;
  min-height: 20px;
}


.app ul,
.app ol {
  padding-left: 20px;
}

.app ul.dropdown-menu__menu,
.app ul.side-nav__menu {
  padding-left: 0;
}

.app p {
  margin: 10px 0;
  white-space: pre-wrap-wrap;
}

.minor,
footnote {
  color: #666;
  font-size: small;
}

.anchor__link {
  background-image: url(/resources/imgs/icon-docs-link.png);
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: 16px 16px;
          background-size: 16px;
  margin-left: 10px;
  display: none;
  height: 16px;
  width: 16px;
}

.anchor__link,
.anchor__link:hover {
  text-decoration: none;
}

.anchor:hover .anchor__link {
  display: inline-block;
}

.card {
  background: #fff;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  margin: 10px 0;
  padding: 10px;
}

.card:first-child {
  margin-top: 0;
}

.cvl-wrap {
  border: 1px solid #ccc;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  position: relative;
}

.cvl-wrap .btn {
  display: none;
  position: absolute;
  right: 0;
  top: 2px;
  z-index: 3;
}

.cvl-wrap:hover .btn {
  display: inline-block;
}

.preview-wrap {
  border-bottom: 1px dashed #555;
  border-top: 1px dashed #555;
  display: none;
  margin: 10px 0;
}

.list-view {
  background: #fff;
  border: none;
  border-collapse: collapse;
  border-top: 1px solid #aaa;
  width: 100%;
}

.list-view__list {
  border-bottom: 1px solid #aaa;
}

.list-view__column {
  border: none;
  padding: 10px;
  vertical-align: top;
}

.list-view__icon {
  display: block;
  width: 24px;
}

.list-view__section {
  display: inline-block;
  margin: 0 30px 10px 0;
}

.list-view__section:before {
  clear: both;
  color: #666;
  content: attr(section);
  display: block;
  font-size: small;
}

.list-view__section_block {
  display: block;
  margin: 0 0 10px;
  white-space: pre-wrap;
}

.pagination {
  font-family: Roboto Mono, monospace;
  padding-top: 10px;
}

.pagination__goto .input {
  border: 1px solid #394486;
  -webkit-border-bottom-right-radius: 5px;
          border-bottom-right-radius: 5px;
  border-left: none;
  -webkit-border-top-right-radius: 5px;
          border-top-right-radius: 5px;
  height: 100%;
  padding: 5px;
  vertical-align: middle;
}

.pagination__page {
  background: #fff;
  border: 1px solid #394486;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #394486;
  cursor: pointer;
  display: inline-block;
  line-height: 30px;
  margin: 5px 5px 0 0;
  padding: 0 10px;
}

.pagination__action {
  background: #fff;
  border: 1px solid #394486;
  color: #394486;
  cursor: pointer;
  display: inline-block;
  font-size: small;
  line-height: 30px;
  padding: 0 5px;
}

.pagination__action:last-child {
  -webkit-border-bottom-right-radius: 5px;
          border-bottom-right-radius: 5px;
  -webkit-border-top-right-radius: 5px;
          border-top-right-radius: 5px;
}

.pagination__page:hover,
.pagination__page_current,
.pagination__action:hover,
.pagination__action_current {
  background: #394486;
  color: #fff;
  text-decoration: none;
}

.progress-bar {
  background: #e6e6e6;
  height: 4px;
}
.progress-bar__progress {
  background: #171e2f;
  height: 4px;
  -webkit-transition: width 300ms ease;
  -o-transition: width 300ms ease;
  transition: width 300ms ease;
  width: 0;
}

.side-nav {
  background: #171e2f;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #eee;
  margin-left: 20px;
  padding: 10px;
}

.side-nav__heading {
  font-size: x-large;
}

.side-nav__menu {
  list-style: none;
  padding: 0;
}

.side-nav__menuitem {
  display: block;
  padding: 5px 0 0 20px;
  position: relative;
  word-wrap: break-word;
}

.side-nav__menuitem:before {
  content: '- ';
  left: 0;
  position: absolute;
}

.side-nav__menuitem:hover:before,
.side-nav__menuitem_current:before {
  content: '->';
}

.app {
  margin: 10px 0;
}

.pointer {
  cursor: pointer;
}

.dropdown-menu {
  position: relative;
  text-align: left;
}

.minor .dropdown-menu {
  float: right;
}

.dropdown-menu__checkbox {
  display:none;
}

.dropdown-menu__toggle {
  cursor: pointer;
  padding: 10px 5px;
}

.dropdown-menu__toggle img {
  height: 24px;
}

.dropdown-menu__menu {
  background: #fff;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  list-style: none;
  padding: 5px 0;
  position: absolute;
  right: 0;
  top: 20px;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: 100% 0;
      -ms-transform-origin: 100% 0;
          transform-origin: 100% 0;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  width: 200px;
  z-index: 1;
}

.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu li {
  padding: 5px;
}

.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu li:hover {
  background: #eee;
}

.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu li>a,
.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu li>span {
  display: inline-block;
  height: 100%;
  width: 100%;
}

.dropdown-menu__checkbox:checked+.dropdown-menu__toggle+.dropdown-menu__menu a:hover {
  cursor: pointer;
  text-decoration: none;
}

.toast {
  background: #333;
  color: #ddd;
  padding: 10px;
  position: fixed;
  z-index: 7;
}

.alert {
  background: #74a7d4;
  border-bottom: 10px solid #696969;
  color: #000;
  font-family: Rajdhani;
  font-size: large;
  height: 90px;
  left: 0;
  position: fixed;
  right: 0;
  top: -90px;
  -webkit-transition: -webkit-transform 100ms ease;
  transition: -webkit-transform 100ms ease;
  -o-transition: transform 100ms ease;
  transition: transform 100ms ease;
  transition: transform 100ms ease, -webkit-transform 100ms ease;
  z-index: 9;
}

.alert:before {
  content: " ";
  display: inline-block;
  height: 90px;
  vertical-align: middle;
}

.alert_warning {
  background: #e69592;
}

.alert_clear {
  background: #91d792;
}

.alert__msg {
  display: inline-block;
  padding: 10px;
  vertical-align: middle;
}

.alert__msg:before {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: 65% 65%;
          background-size: 65%;
  content: " ";
  display: inline-block;
  height: 50px;
  vertical-align: middle;
  width: 50px;
}

.alert__msg:before {
  background-image: url(/resources/imgs/icon-alert-info.png);
}

.alert__msg_warning:before {
  background-image: url(/resources/imgs/icon-alert-warning.png);
}

.alert__msg_clear:before {
  background-image: url(/resources/imgs/icon-alert-ok.png);
}

.alert__link {
  text-decoration: underline;
}

.confirm-wrap.below:before {
  border-bottom: 5px solid #eee;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  content: ' ';
  height: 0;
  left: 10px;
  position: absolute;
  top: -5px;
  width: 0;
}

.confirm-wrap.above:before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #eee;
  bottom: -5px;
  content: ' ';
  height: 0;
  left: 10px;
  position: absolute;
  width: 0;
}

.confirm-wrap {
  background: #eee;
  color: #333;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  padding: 5px;
  position: fixed;
  z-index: 5;
}

.confirm-wrap>div {
  float: left;
  line-height: 32px;
  margin: 0 5px;
}

.confirm-option:hover {
  text-decoration: underline;
}

.interface__handles {
  background: #ddd;
  border: none;
  font-family: Roboto Mono, monospace;
  font-size: 0.8rem;
  line-height: 0.8rem;
  width: 100%;
}

.interface__handles td {
  border: none;
  padding: 5px;
  vertical-align: top;
}

.interface__handles td:nth-child(2) {
  width: 60%;
}

.interface__status {
  width: 20px;
}

.interface__status_highlight:before {
  background: #394486;
  -webkit-border-radius: 50%;
          border-radius: 50%;
  content: " ";
  display: inline-block;
  height: 10px;
  vertical-align: middle;
  width: 10px;
}

.user-info {
  display: inline;
  position: relative;
}

.user-info__info-wrap {
  background: #fff;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  display: block;
  font-size: small;
  margin-left: 2px;
  position: absolute;
  left: 100%;
  top: 0;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: 0 0;
      -ms-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transition: -webkit-transform 300ms ease;
  transition: -webkit-transform 300ms ease;
  -o-transition: transform 300ms ease;
  transition: transform 300ms ease;
  transition: transform 300ms ease, -webkit-transform 300ms ease;
  z-index: 6;
}

.user-info__info-wrap:before {
  border-bottom: 5px solid transparent;
  border-right: 5px solid #1e2c3e;
  border-top: 5px solid transparent;
  content: ' ';
  height: 0;
  left: -5px;
  position: absolute;
  top: 5px;
  width: 0;
}

.user-info:hover .user-info__info-wrap {
  display: block;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

.user-info__header {
  background: #1e2c3e;
  -webkit-border-top-left-radius: 5px;
          border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
          border-top-right-radius: 5px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 60px;
  width: 180px;
}

.user-info__icon {
  display: inline-block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  vertical-align: center;
}

.user-info__name {
  color: #fff;
  display: inline-block;
  -webkit-box-flex: 2;
  -webkit-flex: 2;
      -ms-flex: 2;
          flex: 2;
  font-family: Rajdhani, serif;
  font-size: x-large;
  height: 60px;
  line-height: 60px;
}

.user-info__tools {
  color: #333;
  padding: 5px;
}

.user-info__tools span:hover {
  text-decoration: underline;
}

.tag {
  background: #dedede;
  border: 0;
  -webkit-border-radius: 16px;
          border-radius: 16px;
  color: #555;
  display: inline-block;
  font-size: small;
  height: 28px;
  line-height: 28px;
  margin: 2px;
  padding: 0 12px;
  text-decoration: none;
}

.tag:hover {
  background: #b1b1b1;
  text-decoration: none;
}

.tag:first-child {
  margin-left: 0;
}

.message {
  background: #fff;
  border: 1px solid #aaa;
  bottom: 0;
  position: fixed;
  right: 10px;
  width: 400px;
  z-index: 9;
}

.message__heading {
  background: #fff;
  background: #171e2f;
  color: #ddd;
  padding: 10px;
}

.message__control {
  padding: 5px;
}

.center-align {
  text-align: center;
}

.right-align {
  text-align: right;
}

.right-floating {
  float: right;
}

.horizontal-margin {
  margin: 0 5px;
}

.vertical-margin {
  margin: 5px 0;
}

.clear {
  clear: both;
}

.error {
  color: #f00 !important;
}

.input.error,
.textbox.error {
  border: 1px solid #f00;
}

.empty {
  color: #888;
  font-size: x-large;
  padding: 20px;
}

.force-wrap {
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.spacer {
  min-height: 50vh;
}

.spacer__small {
  min-height: 20vh;
}

.login-overlay {
  background: rgba(0, 0, 0, 0.9);
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 90px;
  z-index: 5;
}

.top {
  background: #fff;
  border: 1px solid #394486;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  color: #394486;
  bottom: 10px;
  cursor: pointer;
  display: none;
  padding: 5px;
  position: fixed;
  right: 10px;
  z-index: 9;
}

.top:hover {
  background: #394486;
  color: #fff;
}

@media screen and (max-width: 1500px) {
  .app {
    margin: 10px;
  }

  #table-of-content+.table-of-content__burger {
    display: block;
  }

  #table-of-content:checked+.table-of-content__burger {
    -webkit-transform: matrix(1, 0, 0, 1, 300, 0);
        -ms-transform: matrix(1, 0, 0, 1, 300, 0);
            transform: matrix(1, 0, 0, 1, 300, 0);
  }

  .table-of-content {
    -webkit-transform: matrix(1, 0, 0, 1, -300, 0);
        -ms-transform: matrix(1, 0, 0, 1, -300, 0);
            transform: matrix(1, 0, 0, 1, -300, 0);
    z-index: 5;
  }

  #table-of-content:checked+.table-of-content__burger+.table-of-content {
    -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
            transform: matrix(1, 0, 0, 1, 0, 0);
  }
}

@media screen and (max-width: 767px) {
  body {
    padding: 120px 0 0;
  }

  .logo img {
    margin-left: 5px;
  }

  .login-overlay {
    top: 120px;
  }

  .app {
    margin: 10px;
  }

  .overlay {
    padding-top: 25vh;
  }

  #table-of-content+.table-of-content__burger {
    display: block;
    top: 120px;
  }

  .table-of-content {
    top: 120px;
  }

  .pagination__goto,
  .pagination__limit,
  .sidebar {
    display: none;
  }

  .nav {
    background: #171e2f;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    float: unset;
    height: 30px;
    left: 0;
    max-width: 100%;
    position: fixed;
    right: 0;
    top: 60px;
  }

  .nav__menu {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    height: 30px;
    line-height: 30px;
    text-align: center;
  }

  .nav__menuitem {
    font-size: medium;
    height: 30px;
    line-height: 30px;
  }

  .sub-nav {
    top: 90px;
  }

  .sub-nav .wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  .sub-nav__menu {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }

  .sub-nav__menuitem {
    font-size: small;
    height: 30px;
    line-height: 30px;
  }

  .alert {
    height: 120px;
  }

  .top {
    opacity: 0;
    z-index: -1;
  }
}