/*  
	CSS Reset by Eric Meyer - Released under Public Domain
    http://meyerweb.com/eric/tools/css/reset/
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, 
caption, tbody, tfoot, thead, tr, th, td 
                  {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
body              {line-height: 1;}
ol, ul            {list-style: none;}
blockquote, q     {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';	content: none;}
:focus            {outline: 0;}
ins               {text-decoration: none;}
del               {text-decoration: line-through;}
table             {border-collapse: collapse;border-spacing: 0;}
@font-face {
    font-family: 'Source Sans Pro';
    src: url('assets/fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
          url('assets/fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: lighter;
    font-style: normal;
}
@font-face {
  font-family: 'System';
  src: local('Segoe UI'), local('SegoeUI');
  font-style: normal;
}
html {
  --R: 133;
  --G: 133;
  --B: 138;
}
body {
  background-color: rgb(var(--R), var(--G), var(--B));
  background-size: cover;
  font-family: 'Source Sans Pro';
  -ms-overflow-style: none;
  overflow: hidden;
  border: #6d6e6f 1px solid;
  height: calc(100vh - 2px);
  text-rendering: optimizeLegibility;
  scrollbar-gutter: stable;
}
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-button:start:decrement:vertical,
::-webkit-scrollbar-button:end:increment:vertical {
  height: 0;
}
::-webkit-scrollbar-button:start:decrement:horizontal,
::-webkit-scrollbar-button:end:increment:horizontal {
  width: 0;
}
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}
h1 {
  font-size: larger;
  font-weight: bolder;
}
h2 {
  font-size: large;
  font-weight: bold;
  margin-top: 2rem;
  margin-bottom: 1rem;
  text-align: center;
}
.modal-body {
  background-color: rgba(0, 0, 0, 0.45);
}
.modal-body .formbox {
  margin: 20rem;
}
.modal-body .singleoperation {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  min-width: 20rem;
  max-width: 30rem;
}
.modal-body .updatebox {
  margin: 2rem;
  margin-top: 5rem;
  height: calc(100% - 10rem);
  padding: 1rem 2rem;
}
.modal-body .updatebox .item {
  max-height: 90%;
  min-height: 90%;
  overflow-y: scroll;
}
.modal-body .updatebox .item h1 {
  padding-top: 1rem;
  text-decoration: underline;
  text-underline-position: under;
}
.modal-body .updatebox .item ul {
  list-style: none;
  padding: 0.5rem 0;
}
.modal-body .formbox .item select {
  width: 100%;
  margin: 1rem auto;
}
.modal-body .formbox .selector {
  max-width: 25rem;
}
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}
.tab button:hover {
  background-color: #ddd;
}
.tab button.active {
  background-color: #ccc;
}
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}
#preamble {
    font-size: 80%;
    width: 100%;
    margin: 1rem;
}
#coach-selector {
  margin: 0 auto;
  padding-top: 1rem;
  width: 100%;
}
select.coach-selector {
  width: calc(100% - 1rem) !important;
}
a {
  text-emphasis: none;
  text-decoration: none;
  color: white;
}
span {
  padding: 0 .25rem;
}
.noSelect {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.noSelect:focus {
  outline: none !important;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.resetting {
  opacity: 0;
}
#window-title-bar {
  display: block;
  position: fixed;
  height: 29px;
  width: calc(100% - 2px); /*Compensate for body 1px border*/
  background-color: var(--title-bar-background, #fff);
}
#window-title-bar #drag-region {
  width: calc(100% - 90px);
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  -webkit-app-region: drag;
}
#window-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  font-family: 'System';
  left: 0.4rem;
  font-size: 12px;
  font-weight: 500;
}
#window-title-logo {
  background-image: url("./assets/icons/onero.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
  background-color: rgba(255, 255, 255, 1);
  width: 24px;
  height: 24px;
  margin-right: 5px;
}
#window-title-controls {
  position: absolute;
  display: flex;
  flex-direction: row;
  top: 0px;
  right: 0px;
}
#window-title-controls * {
  width: 45px;
  height: 29px;
}
#window-title-controls *:hover {
  color: white;
}
#window-title-controls #help:hover {
  background-color: rgb(17, 35, 232);
}
#window-title-controls #quit:hover, #window-title-controls #btnClose:hover {
  background-color: rgb(232, 17, 35);
}
#window-title-controls #help::before {
  position: absolute;
  content: "\003F";
  font-size: 18px;
  font-weight: bold;
  top: 8px;
  right: 64px;
}
#window-title-controls #quit::before, #window-title-controls #btnClose::before {
  position: absolute;
  content: "\2716";
  top: 8px;
  right: 16px;
  font-weight: 100;
}
fieldset {
  background-color: #f7f7f7;
  border: 2px groove #ccc;
  border-radius: 4px;
  padding: 10px;
  margin: 15px 10px;
}
fieldset.multiple {
  border: 2px groove red;
}
legend {
  background-color: rgba(255, 255, 255, 0.85);
  padding: 5px 10px;
  border-radius: 3px;
}
.inner-fieldset-row {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
#inner-fieldset-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.inner-fieldset-group button {
  margin-left: auto;
}
.error-message {
  position: absolute;
  width: 100%;
  bottom: 0;
  background-color: orange;
  visibility: hidden;
  min-height:1rem;
  padding: 0.5rem;
}
.app-logo {
  background-image: url(assets/icons/onero.svg);
  background-repeat: no-repeat;
  background-position-x: 2px;
  background-size: 42px 42px;
  z-index: -10;
  position: absolute;
  max-height: 48px;
  min-height: 48px;
  pointer-events: none;
  right: 0;
  bottom: 3.5rem;
}
.app-logo p {
  color: #ecedef;
  font-size: 11px;
  max-width: 60px;
  text-shadow: 1px 1px 1px #000, 1px 1px 1px #000, 1px 1px 1px #000, 1px 1px 2px #000, 1px 1px 2px #000, 1px 1px 3px #000, 1px 1px 3px #000;
  padding-top: 44px;
}
#status {
  position: absolute;
  display: flex;
  width: 70px;
  top: 30px;
  right: 1px;
  padding: 0.25rem;
  border-bottom-left-radius: 4px;
  color: white;
  font-weight: bold;
  font-size: smaller;
  justify-content: space-between;
}
.status-online {
  background-color: lightgreen;
}
.status-offline {
  background-color: red;
}
.status-nosession {
  background-color: orange;
}
#status-info-icon {
  align-self: flex-start;
  color: rgba(0, 0, 0, 0.45);
  font-weight: normal;
  font-size: medium;
}
#status-info-icon::before {
  content: '\1f6c8';
}
.app-messages {
  display: block;
  position: absolute;
  left: 0.5rem;
  bottom: 0.5rem;
  background-color: lightgreen;
  border: 1px solid green;
  border-bottom: 1px solid darkgreen;
  min-width: 100px;
  padding:0.75rem;
  border-radius: 4px;
  visibility: hidden;
}
.workbox {
  display: flex;
  flex-direction: row;
  background-color: rgb(calc(var(--R) + 60), calc(var(--G) + 60), calc(var(--B) + 60));
  min-width: 75%;
  min-height: calc(100vh - 3rem - 29px - 2px);
  max-width: 85%;
  max-height: calc(100vh - 3rem - 29px - 2px);
  margin: 2rem auto;
  margin-top: calc(1.5rem + 29px);
  border-radius: 4px;
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40), 0.533);
}
.formbox, .updatebox {
  display: flex;
  flex-direction: column;
  background-color: rgba(255, 255, 255, 0.85);
  max-width: 85%;
  max-height: 85%;
  margin: calc(3rem + 30px) auto;
  margin-bottom: 7vh;
  border-radius: 4px;
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40), 0.533);
}
.formbox.appointments {
  margin-top: 1rem;
}
.modal {
  margin: 2rem auto;
}
.workbox .item {
  background-color: rgba(calc(var(--R) + 110), calc(var(--G) + 110), calc(var(--B) + 105), 0.667);
  margin: 1rem;
  border-radius: 4px;
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 20), calc(var(--G) - 20), calc(var(--B) - 20), 0.9);
  padding: 0.25rem;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.formbox .item, .updatebox .item {
  min-width: 90%;
}
.workbox .nonForm {
  padding: 0.5rem;
}
.workbox .item .inputrow {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 95%;
  margin: 1rem 0;
}
.formbox .item .inputrow {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  width: 95%;
  margin: calc(1.5rem - 4px) auto;
  padding: 4px;
  border: 1px solid transparent;
  min-height: 30px;  
}
.formbox .item .two-wide {
  display: grid;
  grid-template-columns: 11rem 8rem 1fr 11rem 8rem;
  grid-auto-flow: column dense;
  grid-template-areas: "left-label left-input gutter right-label right-input";
  grid-column-gap: 0;
  width: 85%;
  text-wrap: nowrap;
}
.formbox .subrow {
  display: inline-block;
  flex-wrap: nowrap;
}
.workbox label, .formbox label {
  min-width: 30%;
  max-width: 30%;
}
#client-grid-container .client input, .workbox input, .formbox input, .formbox select {
  padding: .3rem 0;
  padding-left: 2px;
  background-color: white;
  border-radius: 4px;
  border: 1px solid rgb(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40));
  border-bottom: 3px solid #005fb8;
  min-width: 70%;
  margin-left: 0.5rem;
} 
#client-grid-container .client input:disabled, .workbox input:disabled, .formbox input:disabled, .formbox select:disabled {
  box-shadow: none;
  border: 1px solid rgb(209, 209, 209);
  border-bottom: 3px solid rgb(209, 209, 209);
  background-color: rgb(225, 225, 225);
  color: rgb(125, 125, 125);
  text-shadow: 1px 1px 0px rgb(239, 239, 239);
  cursor: default;
}
.required label:not(.subrow label)::after {
  content: ' *';
  font-size: large;
  font-weight: bold;
  color: red;
}
.formbox .item .errored {
  border: 1px solid rgb(196, 30, 58);
  border-radius: 4px;
}
.formbox .subrow input[type="radio"] {
  min-width: 20px;
  margin-right: 2rem; 
}
.formbox .subrow select {
  min-width: 20px;
  margin-right: 0.25rem;
}
input.touched:invalid {
  border: 2px solid red;
}
.buttonrow {
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  margin-bottom: 0.5rem;
  width: 100%;
}
.buttoncolumn {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 85%;
  margin-top: 4rem;
}
.button, .small, .tablet, .buttonlist {
  display: grid;
  grid-template-columns: 0.3rem 1rem 2px 1fr 1rem;
  grid-auto-flow: column dense;
  grid-template-areas: "left-gutter light icon label right-gutter";
  grid-column-gap: 0;
  align-items: center;
  color: rgb(calc(var(--R) - 110), calc(var(--G) - 110), calc(var(--B) - 110));
  font-size: medium;
  border-radius: 4px;
  background-color: rgb(calc(var(--R) + 118), calc(var(--G) + 118), calc(var(--B) + 113));
  border: 1px solid rgb(calc(var(--R) + 103), calc(var(--G) + 103), calc(var(--B) + 98));
  border-bottom: 1px solid rgb(calc(var(--R) + 71), calc(var(--G) + 71), calc(var(--B) + 71));
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40), 0.533);
  padding: 0.5rem 3px;
  margin: 0.55rem;
  cursor: pointer;
}
a.login {
  color: rgb(calc(var(--R) - 110), calc(var(--G) - 110), calc(var(--B) - 110));
  cursor: pointer;
}
.menu {
  grid-template-columns: 0.3rem 1rem 2px 15rem 1rem;
}
.small {
  grid-template-columns: 0.3rem 1rem 2px 1fr 1rem;
  font-size: small;
  padding: 0.3rem 1px;
  padding-left: 3px;
  margin: 0.2rem;
  margin-top: 1rem;
}
.tablet {
  grid-template-columns: 0.3rem 1rem 2px 1fr 1rem;
  padding: 0.5rem 1px;
  padding-left: 3px;
  margin: 0.2rem;
  margin-top: 1rem;
}
.buttonlist {
  margin: 0.1rem;
}
.button .left-gutter { 
  grid-area: left-gutter; 
}
.button .light { 
  grid-area: light; 
}
.button .icon { 
  grid-area: icon; 
  font-size: 14px;
  margin-bottom: 1px;
  line-height: 14px;
}
.button .label { 
  grid-area: label; 
}
.button .right-gutter { 
  grid-area: right-gutter; 
}
.button .button-grid {
  text-align: left;
  align-items: baseline;
  align-self: center;
}
.button .light {
  height: 150%;
  min-width: 4px;
  max-width:4px;
  border-radius: 2px;
  background-color: rgb(0, 95, 184);
}
.button:hover {
  background-color: rgb(241, 241, 241);
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40), 0.733);
}
.small:hover {
  box-shadow: 1px 1px 3px 1px rgba(209, 209, 209, 0.733);
}
.button:hover .light {
  background: radial-gradient(circle, rgb(0, 225, 255) 0%, rgb(32, 183, 209) 80%, rgb(0, 95, 184) 100%);
  box-shadow: inset 0px 0px 1px 1px rgb(0, 95, 184);
}
.button:active {
  background-color: #fafafa;
  box-shadow: none;
  border: 1px solid #eaeaea;
}
.button:active .light {
  background: radial-gradient(circle, rgb(255, 255, 255) 2%, rgb(160, 244, 255) 30%, rgb(89, 236, 255) 100%);
  box-shadow: inset 0px 0px 1px 1px rgb(0, 95, 184), 0px 0px 1px 2px rgba(89, 236, 255, 0.25);
}
.button.disabled, .button.disabled:hover {
  box-shadow: none;
  border: 1px solid rgb(calc(var(--R)), calc(var(--G)), calc(var(--B)));
  background-color: rgb(225, 225, 225);
  color: rgb(125, 125, 125);
  text-shadow: 1px 1px 0px rgb(239, 239, 239);
  cursor: default;
}
.button.disabled .light, .button.disabled:hover .light {
  background: rgb(209, 209, 209);
  box-shadow: none;
}
.button.disabled .icon::before {
  color: rgb(180, 180, 180);
}
.buttonrow:has( .download ) {
  margin-bottom: 0;
}
.download {
  grid-template-columns: 0.1rem 1rem 0.3rem;
  grid-template-areas: "left-gutter label right-gutter";
  line-height: 0.8rem;
  margin-left: -0.5rem;
}
.download .label::before {
  content: url("data:image/svg+xml,%3Csvg%20version%3D%271.1%27%20viewBox%3D%270%200%2016%2016%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3Bopacity%3A0%3B%7D.cls-2%7Bfill%3A%23231f20%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20transform%3D%27scale%28.66857%29%27%20data-name%3D%27Layer%202%27%3E%3Cg%20data-name%3D%27download%27%3E%3Crect%20class%3D%27cls-1%27%20width%3D%2724%27%20height%3D%2724%27%2F%3E%3Crect%20class%3D%27cls-2%27%20x%3D%274%27%20y%3D%2718%27%20width%3D%2716%27%20height%3D%272%27%20rx%3D%271%27%20ry%3D%271%27%2F%3E%3Crect%20class%3D%27cls-2%27%20transform%3D%27rotate%28-90%2C5%2C18%29%27%20x%3D%273%27%20y%3D%2717%27%20width%3D%274%27%20height%3D%272%27%20rx%3D%271%27%20ry%3D%271%27%2F%3E%3Crect%20class%3D%27cls-2%27%20transform%3D%27rotate%28-90%2C19%2C18%29%27%20x%3D%2717%27%20y%3D%2717%27%20width%3D%274%27%20height%3D%272%27%20rx%3D%271%27%20ry%3D%271%27%2F%3E%3Cpath%20class%3D%27cls-2%27%20d%3D%27m12%2015a1%201%200%200%201-0.58-0.18l-4-2.82a1%201%200%200%201-0.24-1.39%201%201%200%200%201%201.4-0.24l3.42%202.39%203.4-2.56a1%201%200%200%201%201.2%201.6l-4%203a1%201%200%200%201-0.6%200.2z%27%2F%3E%3Cpath%20class%3D%27cls-2%27%20d%3D%27m12%2013a1%201%200%200%201-1-1v-8a1%201%200%200%201%202%200v8a1%201%200%200%201-1%201z%27%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A");
  display: inline-block;
  height: 24px;
  width: 24px;
  margin-left: -2px;
  vertical-align: middle;
}
/*
.cancel .icon::before {
  content: '\1F5D9';
  color: #b80000;
}
.login .icon::before {
  content: '\2386';
  font-weight: bold;
  font-size: 22px;
  color: #00b800;
}
.save .icon::before {
  content:'\1F5AB';
  font-weight: bold;
  color: #0000b8;
}
.client .icon::before {
  content:'\1F464';
}*/
#month-banner, #selected-date {
  color: white;
  font-size: 24px;
  padding: 1rem;
  margin-top: 32px;
  text-wrap: nowrap;
}
#calendar {
  margin-bottom: 1rem;
  padding-top: 1rem;
}
.calendar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.calendar * {
  display: flex;
  justify-content: center;
  min-width: 4.5rem;
  min-height: 4.5rem;
  border: solid 1px rgba(108, 108, 108, 0.65);
  border-radius: 4px;
  /*color: white;*/
  margin: 2px;
}
.calendar .day {
  align-items: center;
  background-color: rgba(108, 108, 108, 0.15);
  font-weight: bold;
  font-size: small;
}
.calendar .date {
  align-items: center;
  background-color: rgba(108, 108, 108, 0.25);
}
.calendar .today {
  background-color: rgba(108, 108, 108, 0.7);
  color:white;
}
.calendar .blank {
  align-items: center;
  background-color: rgba(255, 255, 255, 0.45);
}
.calendar .break {
  flex-basis: 100%;
  min-height: 0;
  border: none;
  margin: 0;
}
.calendar .date:hover {
  background-color: rgba(108, 108, 108, 0.45);
  cursor: pointer;
}
.calendar .disabled {
  background-color: rgba(255, 255, 255, 0.45);
  color: rgba(108, 108, 108, 0.45);
  pointer-events: none;
  cursor: not-allowed;
}
 #class-list, #class-list-header {
  width: calc(100vw - 4rem);
  display: flex;
  flex-direction: column;
  margin:  0 2rem;
}
#class-list-header {
  flex-direction: row;
  margin-top: 2rem;
  background-color: rgba(255, 255, 255, 0.55);
}
.timeslot {
  border: 1px solid #ccc;
  padding: 5px;
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
}
#planner {
  display: flex;
  flex-direction: column;
  margin:  0 2rem;
  margin-top: 2rem;
  overflow-y: auto;
  height:70vh;
}
#client-detail  {  
  display: grid;
  grid-template-columns: 1rem 1fr 1fr 1rem 1fr 1fr 1rem;
  grid-template-rows: 1rem 1fr 1fr 1fr 1rem 1fr;
  grid-auto-rows: 1fr;
  gap: 5px 5px;
  grid-auto-flow: row dense;
  justify-items: stretch;
  align-items: stretch;
  grid-template-areas:
    ". . . . . . ."
    ". photo photo . fname fname ."
    ". photo photo . sname sname ."
    ". photo photo . pname pname ."
    ". . . . . . ."
    ". dob dob . age age ."
    ". lclass lclass . . . ."
    ". notes notes notes notes notes ."
    ". notes notes notes notes notes ."
    ". lasses lasses . . . ."
    ". height height . weight weight ."
    ". lsts lsts . thts thts ."
    ". fnts fnts . . . ."
    ;
}
#client-detail .yellow {
  background-color: rgba(255, 255, 69, 0.55);
  border: 1px solid rgba(255, 255, 69, 0.7);
  border-radius: 4px;
}
#client-detail .photo { 
  grid-area: photo;
  min-width: 128px;
  max-width: 128px;
  min-height: 128px;
  max-height: 128px;
  border: none;
}
#client-detail .fname { grid-area: fname; }
#client-detail .sname { grid-area: sname; }
#client-detail .pname { grid-area: pname; }
#client-detail .dob { grid-area: dob; }  
#client-detail .age { grid-area: age; }
#client-detail .lclass { grid-area: lclass; }
#client-detail .notes { grid-area: notes; max-height: 80px; overflow-y: scroll; word-break: break-all; }
#client-detail .lasses {grid-area: lasses;}
#client-detail .height { grid-area: height; }
#client-detail .weight { grid-area: weight; }
#client-detail .lsts { grid-area: lsts; }
#client-detail .thts { grid-area: thts; }
#client-detail .fnts { grid-area: fnts; }
.booked {
  background-color: #ccc;
  display: inline-flex;
  width: 70%;
  height: 40px;
  color: white;
  font-weight: bold;
  padding: 0 1rem;
  float: right;
  align-items: center;
  cursor: pointer;
}
.subcolumn {
  display: flex;
  flex-direction: column;
  width: 100%;
}
#client-lookup-result, #class-client-lookup-result, #edit-client-lookup-result, #edit-client-class-lookup-result {
  background-color: rgb(calc(var(--R) + 140), calc(var(--G) + 140), calc(var(--B) + 140));
  border: 1px solid rgb(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40));
  position: fixed;
  overflow-y: auto;
  min-width: 35rem;
  max-height: 20rem;
  margin-top: 2rem;
  visibility: hidden;
  z-index: 99;
}
#client-lookup-result div, #class-client-lookup-result div, #edit-client-lookup-result div, #edit-client-class-lookup-result div {
  padding: 0.4rem 0.3rem;
  cursor: pointer;
  border-bottom: 1px solid rgb(calc(var(--R)), calc(var(--G)), calc(var(--B)));
}
#client-lookup-result div:nth-child(odd), #class-client-lookup-result div:nth-child(odd), #edit-client-lookup-result div:nth-child(odd), #edit-client-class-lookup-result div:nth-child(odd) {
  background-color: rgb(calc(var(--R) + 100), calc(var(--G) + 100), calc(var(--B) + 100));
}
#client-lookup-result div:nth-child(even), #class-client-lookup-result div:nth-child(even), #edit-client-lookup-result div:nth-child(even), #edit-client-class-lookup-result div:nth-child(even) {
  background-color: rgb(calc(var(--R) + 90), calc(var(--G) + 90), calc(var(--B) + 90));
}
#client-lookup-result div:hover, #class-client-lookup-result div:hover, #edit-client-lookup-result div:hover, #edit-client-class-lookup-result div:hover {
  background-color: rgb(calc(var(--R) + 105), calc(var(--G) + 105), calc(var(--B) + 200));
}
sup {
  font-size:xx-small; 
  vertical-align:super;
}
#user-manual {
  position: fixed;
  margin: auto;
  width: 950px;
  height: 565px;
  top: 60px;
  left: 25px;
}
#user-manual iframe {
  width: 100%;
  height: 100%;
}
#client-class-container {
  max-height: 25rem;
  overflow-y: scroll;
}
#edit-class-container {
  max-height: 34rem;
  overflow-y: scroll;
}
#edit-class-container::-webkit-scrollbar-button {
  display: none;
  height: 0;
  width: 0;
}
#client-table-container {
  max-height: 30rem;
  overflow-y: scroll;
}
#client-table-container table {
  margin: 0 auto;
  max-width: 98%;
}
#client-table-container input {
  width: 90%;
}
#client-table-container tr {
  display: grid;
  grid-template-columns: 26px 32px 6fr 1.5fr 1.5fr 1.5fr 1fr 1fr 3fr 32px 32px 32px 32px;
  grid-template-areas: "toggle photo name dl pr sq f fx note detail history edit remove";
  grid-auto-flow: column dense;
  grid-gap: 0 0.35rem;
  align-items: center;
  align-content: center;
}
th {
  font-size: small;
  font-weight: lighter;
}
#client-table-container .toggle {
  grid-area: toggle;
}
#client-table-container .photo { 
  grid-area: photo;
}
#client-table-container .name { 
  grid-area: name;
}
#client-table-container .dl { 
  grid-area: dl; 
}
#client-table-container .pr { 
  grid-area: pr; 
}
#client-table-container .sq { 
  grid-area: sq; 
}
#client-table-container .f { 
  grid-area: f; 
}
#client-table-container .fx { 
  grid-area: fx; 
}
#client-table-container .note { 
  grid-area: note; 
}
#client-table-container .detail { 
  grid-area: detail; 
}
#client-table-container .history { 
  grid-area: history; 
}
#client-table-container .edit { 
  grid-area: edit; 
}
#client-table-container .remove { 
  grid-area: remove; 
}
#client-table-container td .toggle, #client-table-container td .remove, #client-table-container td .detail, #client-table-container td .history, #client-table-container td .edit, #inner-fieldset-group div.save, #inner-fieldset-group div.remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background-color: #fbfbfb;
  border: 1px solid #ececec;
  border-bottom: 1px solid #d1d1d1;
  box-shadow: 1px 1px 3px 1px #d1d1d188;
  cursor: pointer;
  min-width: 26px;
  max-width: 26px;
  min-height: 26px;
  max-height: 26px;
}
#client-table-container td .toggle:hover, #client-table-container td .detail:hover, #client-table-container td .history:hover, #client-table-container td .remove:hover, #client-table-container td .edit:hover, #inner-fieldset-group div.save:hover, #inner-fieldset-group div.remove:hover {
  background-color: rgb(241, 241, 241);
  box-shadow: 1px 1px 3px 1px rgba(calc(var(--R) - 40), calc(var(--G) - 40), calc(var(--B) - 40), 0.333);
}
#client-table-container td .toggle:active, #client-table-container td .detail:active, #client-table-container td .history:active, #client-table-container td .remove:active, #client-table-container td .edit:active, #inner-fieldset-group div.save:active, #inner-fieldset-group div.remove:active {
  background-color: #fafafa;
  box-shadow: none;
  border: 1px solid #eaeaea;
}
#client-table-container td .toggle.disabled, #client-table-container td .detail:disabled, #client-table-container td .history:disabled, #client-table-container td .remove:disabled, .edit:disabled, #inner-fieldset-group div.save:disabled, #inner-fieldset-group div.remove:disabled {
  box-shadow: none;
  border: 1px solid rgb(calc(var(--R)), calc(var(--G)), calc(var(--B)));
  background-color: rgb(225, 225, 225);
  color: rgb(125, 125, 125);
  text-shadow: 1px 1px 0px rgb(239, 239, 239);
  cursor: default;
}
#client-table-container td .toggle:not(.error)::before, #inner-fieldset-group div.save::before {
  content: '\2713';
  display: inline-block;
  font-size: 20px;
  margin: 4px 0 0 5px;
  color:#005fb8;
}
#client-table-container td .toggle.error::before {
  content: '\26A0';
  display: inline-block;
  font-size: 20px;
  color:#b8005f;
}
#client-table-container td .toggle:not(.disabled):hover::before, #inner-fieldset-group div.save:hover::before {
  color:lightgreen !important;
}
#client-table-container td .toggled:not(.disabled) {
  background-color: lightgreen !important;
  border: 1px solid green !important;
  border-bottom: 1px solid darkgreen !important;
}
#client-table-container td .photo { 
  grid-area: photo;
  min-width: 32px;
  max-width: 32px;
  min-height: 32px;
  max-height: 32px;
  border: none;
}
#client-table-container td .yellow {
  background-color: rgba(255, 255, 69, 0.55) !important;
  border: 1px solid rgba(255, 255, 69, 0.7) !important;
  border-radius: 4px;
  padding: 0.25rem;
}
#client-table-container td .name { 
  align-self: center;
  margin-left: 3px;
  position: relative;
  background-color: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 4px;
  padding: 0.25rem;
}
#client-table-container td .female::after {
  content: '\2640';
  position: absolute;
  right: 0;
  padding-right: 2px;
  font-size: large;
}
#client-table-container td .male::after {
  content: '\2642';
  position: absolute;
  right: 0;
  padding-right: 2px;
  font-size: large;
}
#client-table-container td .detail::before {
  content: '\26B2';
  display: inline-block;
  transform: rotate(-45deg);
  font-size: 30px;
  color:#0000b8;
  z-index: 1;
}
#client-table-container td .detail:hover::before {
  color:rgb(0, 225, 255);
}
#client-table-container td .history::before {
  content: "";
  transform: translate(10%, 16%);
  display: inline-block;
  width: 22px;
  height: 22px;
  background-color: rgb(107, 107, 107);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
#client-table-container td .history:hover::before {
  background-color: white;
}
#client-table-container td .edit::before {
  content: '\270E';
  display: inline-block;
  transform: rotate(90deg);
  font-size: 25px;
  color:#00b800;
  z-index: 1;
}
#client-table-container td .edit:hover::before {
  color:rgb(0, 255, 0);
}
#client-table-container td .remove::before, #inner-fieldset-group div.remove::before {
  content: '\232B';
  display: inline-block;
  font-size: 20px;
  margin: 4px 0 0 0px;
  color: #b80000;
  z-index: 1;
}
#client-table-container td .remove:hover::before, #inner-fieldset-group div.remove:hover::before {
  color:rgb(255, 0, 0);
}
#client-table-container::-webkit-scrollbar {
  display: none;
}
#client-table-container td .photo, #client-detail .photo {
  background-image: url('data:image/jpeg;base64,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Y2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IlhNUCBDb3JlIDQuNC4wLUV4aXYyIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6aXB0Y0V4dD0iaHR0cDovL2lwdGMub3JnL3N0ZC9JcHRjNHhtcEV4dC8yMDA4LTAyLTI5LyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOnBsdXM9Imh0dHA6Ly9ucy51c2VwbHVzLm9yZy9sZGYveG1wLzEuMC8iIHhtbG5zOkdJTVA9Imh0dHA6Ly93d3cuZ2ltcC5vcmcveG1wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9ImdpbXA6ZG9jaWQ6Z2ltcDpiZTZmZGE2Zi04YzA2LTQxY2UtOGZiNy0yNGY1YzQxNzVmNmEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6YWNmNjc4YjItMzExYy00YjdkLWI0ZmMtYTQyOWViNjYwYWM1IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZTA0ODg4ZjUtYzBjNC00ZWFjLWFlZmUtYzJlZjI0NTQzMjY0IiBHSU1QOkFQST0iMi4wIiBHSU1QOlBsYXRmb3JtPSJXaW5kb3dzIiBHSU1QOlRpbWVTdGFtcD0iMTY5ODczNjg5ODMxMjYxOSIgR0lNUDpWZXJzaW9uPSIyLjEwLjIyIiBkYzpGb3JtYXQ9ImltYWdlL2pwZWciIHhtcDpDcmVhdG9yVG9vbD0iR0lNUCAyLjEwIj4gPGlwdGNFeHQ6TG9jYXRpb25DcmVhdGVkPiA8cmRmOkJhZy8+IDwvaXB0Y0V4dDpMb2NhdGlvbkNyZWF0ZWQ+IDxpcHRjRXh0OkxvY2F0aW9uU2hvd24+IDxyZGY6QmFnLz4gPC9pcHRjRXh0OkxvY2F0aW9uU2hvd24+IDxpcHRjRXh0OkFydHdvcmtPck9iamVjdD4gPHJkZjpCYWcvPiA8L2lwdGNFeHQ6QXJ0d29ya09yT2JqZWN0PiA8aXB0Y0V4dDpSZWdpc3RyeUlkPiA8cmRmOkJhZy8+IDwvaXB0Y0V4dDpSZWdpc3RyeUlkPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6Y2hhbmdlZD0iLyIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDplNGJkZGJiMy1mYmMyLTRlMTQtYjBlYi0yNDk2NDIyZTA4ZDIiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkdpbXAgMi4xMCAoV2luZG93cykiIHN0RXZ0OndoZW49IjIwMjMtMTAtMzFUMTc6MjE6MzgiLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDxwbHVzOkltYWdlU3VwcGxpZXI+IDxyZGY6U2VxLz4gPC9wbHVzOkltYWdlU3VwcGxpZXI+IDxwbHVzOkltYWdlQ3JlYXRvcj4gPHJkZjpTZXEvPiA8L3BsdXM6SW1hZ2VDcmVhdG9yPiA8cGx1czpDb3B5cmlnaHRPd25lcj4gPHJkZjpTZXEvPiA8L3BsdXM6Q29weXJpZ2h0T3duZXI+IDxwbHVzOkxpY2Vuc29yPiA8cmRmOlNlcS8+IDwvcGx1czpMaWNlbnNvcj4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+ICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAg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');
  background-size: contain;
  background-repeat: no-repeat;
}
#client-table-container .client .notes {
  min-width: 50%;
}
#client-table-container .previous {
  color: red;
}
.ct-label.ct-horizontal {
  transform: rotate(-45deg);
  transform-origin: top left;
  text-anchor: end;
  margin-top: 3rem;
}
#client-history {
  height: 500px;
  background-color: white;
}
.ct-svg-legend text {
  font-size: 12px;
  fill: #444;
}
.ct-svg-legend rect.ct-series-a {
  fill: #d70206
}
.ct-svg-legend rect.ct-series-b {
  fill: #f05b4f
}
.ct-svg-legend rect.ct-series-c {
  fill: #f4c63d
}
.ct-point {
  pointer-events: auto;
}
#history-report-render {
  background-color: white;
  overflow: hidden;
  margin: auto;
  border:rgb(87, 87, 87) 2px inset;
}

#history-report-render tbody td {
  padding: 0.5rem 1rem;
}