html {
  font-size: 80%;
  line-height: 1.15;
  box-sizing: border-box;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
article, aside, nav, section {
  display: block;
}
header, footer, main {
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   align-items:center;
   width: 100%;
   margin: 0;
}
iframe {
   border: none;
   display: block;
}
table {
  border-collapse: collapse;
  border-spacing: 0px;
  padding: 0;
  margin: 0;
}
img {
   border-style: none;
   vertical-align: middle;
}
form {
   border: none;
   margin: 0;
}
button, input {
   overflow: visible;
}

/* Layout            */

.row, .column, .grid, .flow, .centered {
   display: flex;
   margin-bottom: 0.2em;
   max-width: 100%;
   flex: 0 0 auto;
}
.flow {
   flex-flow: row wrap;
   justify-content: flex-start;
   width: 100%;
}
.column {
   flex-flow: column nowrap;
}
.row {
   flex-flow: row nowrap;
   justify-content: flex-start;
   width: 100%;
}
.centered {
   flex-wrap: wrap;
   justify-content: center;
   gap: 1rem;
}
.grid {
   flex-flow: row wrap;
   justify-content: flex-start;
   width: 100%;
}

.rec-grid, .entrybox-grid, .searchbox-grid, .bform-grid {
   display: grid;
}
.rec-footer {
   /* display: grid; */
   grid-column: 1/ -1;
}
.full-row {
   grid-column: 1 / -1;
}
.radio-group, .checkbox-group {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(8em, 1fr));
}

/* Index Page  */

.index {
   margin: 0;
   padding: 0;
   overflow-x: hidden;
   height: 100vh;
   width: 100vw;
   display: grid;
   grid-template-columns: 160px auto;
   grid-template-rows: 54px auto;
   grid-template-areas:
      'topbar topbar'
      'sidebar main' ;
}
.hidesb {
   grid-template-columns: 0px auto;
}
#togglesb {
   position: absolute;
   top: 10px;
   left: 1px;
}
.main {
   grid-area: main ;
   width: 100%;
   height: 100%;
}
.menu-topbar {
   grid-area: topbar ;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-end;
   align-items: center;
   text-align: left;
   width: 100%;
}
.hidesb .sidebar {
   display: none;
}

/* Utility        */

.wrapper {
   max-width: max-content;
   margin-top: 0.25em;
   margin-left: 0.3em;
   display: block;
}
.left {
   position: absolute;
   left: 10px;
}
.right {
   position: absolute;
   right: 10px;
}

.float-left    { float: left; }
.float-right   { float: right; }
.fixed         { position: fixed; }

.align {
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.footer {
  position: fixed;
  bottom: 0;
  right: 0;
  padding: 0 10px 0 0;
}
