@media (max-width: 1030px) {
     .box-group,
     .stack-group {
          display: block;
          /* width:100%;margin-bottom:10px; */
          /* border:var(--primary-border);border-left:0;border-right:0;border-bottom:0; */
     }

     /* .box-group:first-child {border-top:0;} */
     /* .box-group:last-child {border-bottom:0;} */
     /* .box-group:not(:only-of-type):not(:first-child) {border-left:0;} */
     .box-wrapper,
     .stack-wrapper {
          display: block;
     }

     .box-group.image-wrap-small,
     .stack-group.image-wrap-small {
          display: inline-flex;
          height: 80px;
     }

     .box-group.box-file-buttons {
          display: inline-flex;
          height: 80px;
          flex-direction: column;
          justify-content: space-around;
     }

     #content-search {
          display: none;
          visibility: hidden;
          width: 0;
          height: 0;
          overflow: hidden;
     }
     .box-hover {
          min-width: auto;
          max-width: calc(100% - 20px);
          max-height: calc(100vh - 100px);
     }

     .page-container {
          max-width: calc(100vw - 20px);
     }

     .box-group.box-image-wrap {
          flex: 1;
          width: auto;
     }
}

@media (max-width: 700px) {
     .restriction-wrapper {
          flex-direction: column;
     }

     #app-content {
          padding: 0;
          border-radius: 0;
          left: 0;
          max-width: 100%;
     }

     #app-content.full {
          left: 0;
          max-width: 100%;
     }

     #app-wrapper {
          padding: 0;
          gap: 0;
     }

     .wrapper {
          flex-direction:column;
     }

     .menu-category {
          opacity: 0;
          display: none;
          visibility: hidden;
          height: 0;
     }

     .menu-spacer-half {
          height: 15px;
     }

     .menu-divider {
          width: 40px;
          margin: 0 5px;
          display: none;
     }

     #content-submenu-name {
          display: none;
     }

     .box-frame,
     .box-container {
          display: block;
          min-width: auto;
     }

     .box-label,
     .box-value {
          display: block;
          text-align: left;
     }

     .box-label::after {
          content: "";
     }

     .box-value {
          display: block;
     }

     .box-content {
          flex-direction: column;
          grid-template-columns: auto;
     }

     .box-half {
          width: calc(100% - 10px);
     }

     #content-tabs {
          padding: 0 4px;
     }

     #content-pages {
          padding: 0 4px;
     }

     .page-container {
          max-width: calc(100vw - 10px);
     }

     .tabbar-wrapper {
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          align-content: center;
          justify-content: flex-start;
          height: auto;
          width: 100%;
          padding: 0 0 8px 0;
          top: 0;
     }

     .tabs-tab,
     .tabs-tab.active {
          display: inline-flex;
          flex-direction:row;
          flex: 0 1 auto;
          gap:4px;
          align-items: center;
          justify-content: center;
          margin: 0 4px 4px 0;
          border-radius: var(--radius);
          height: 30px;
          line-height: 30px;
     }

     .tabs-tab.active {
          border-bottom-left-radius: 4px;
          border-bottom-right-radius: 4px;
          border-bottom: 2px solid var(--tabbar-border);
     }

     .box-hover {
          min-width: auto;
          max-width: calc(100% - 20px);
          max-height: calc(100vh - 100px);
     }

     #app-content.full #content-body,
     #app-content.full #content-header {
          max-width: 100%;
     }

     #content-body, #content-body.scrollable {
          padding:0 4px;
          border:0;
          background:transparent;
     }

     #app-menu,#app-menu.full, #app-menu.partial {
          margin: 0;
          height: 100%;
          min-height: 100%;
          border-radius: 0;
          margin-right:0;
     }

     #app-header {
          justify-content:space-between;
     }

     #app-header-title {
          padding: 4px;
     }

     #content-header {
          border-radius: 0;
          padding: 0;
          max-width: 100%;
     }

     #content-header-title {
          border-radius: 0;
     }

     .content-page-title {
          flex-direction: column;
     }

     .content-page-title-text {
          min-width: 100%;
          max-width: 100%;
     }

     .content-page-title-controls {
          min-width: 100%;
          max-width: 100%;
          text-align: right;
     }

     .loader-wrapper {
          left: 0;
          right: 0;
          top: 0;
          bottom: 0;
          width: 100%;
          height: 100%;
          border-radius: 0;
     }

     .max-width-x1, .max-width-x2, .max-width-x3, .max-width-x4 {
          max-width:100%;
     }
}

@media (max-height: 450px) {
     .menu-spacer-half {
          height: 5px;
     }
}

@media print {
     html,
     body {
          background: white;
          color: black;
     }

     #app-menu,
     #content-header,
     #content-tabs,
     .tabbar-wrapper,
     #app-menu-toggle,
     .no-print,
     .noprint {
          display: none;
     }

     input,
     select {
          background: transparent;
          color: #000;
          border: 1px solid transparent;
     }

     #app-content,
     #app-content.full {
          max-width: 100%;
          width: 100%;
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
     }

     #app-wrapper,
     #app-content {
          max-width: 100%;
          width: 100%;
          min-height: 100%;
          background:white;
     }

     #content-body {
          max-width: 100%;
          width: 100%;
          height: 100%;
          padding-bottom: 0;
          background:white;
     }

     /* Calendar */
     #calendar-controls,
     #calendar-event-options,
     #calendar-options,
     #calendar-controls-toggle {
          display: none;
     }

     .button {
          display: none;
     }

     html, body, #app-wrapper, #app-content, #content-body, #content-pages {
          height:auto;
          min-height:auto;
          max-height:none;
          overflow:initial;
     }
}