:root {color-scheme: light dark;}
* {box-sizing: border-box;}
body {
  width:auto;
  height:100%;
  overflow-x: hidden;
  -webkit-text-size-adjust:100%;
  font-family: "SF Display", "Helvetica Neue", Helvetica, arial, sans-serif;
  font-weight: 480;
  font-size:6vw;
  margin:0;
  padding:0;
  border:0;
  color:#002b36;
  background-color:#fcfcfc;
}
pre {
   font-family: "courier new", courier, monospace;
   font-size: 20px;
   font-weight:bold;
   margin:0;
   word-wrap: break-word;
}
.printdiv {
  color:#0087ff;
  width:auto;
  height:100%;
}

.divprint {
  background-color:#FFFFFF;
  font-size: 12px;
  transform: rotate(90deg);
  -webkit-transform-origin: 100% 0%;
  transform:  translateX(-43%) translateY(0%) rotate(-90deg);
}

.printdiv2 {
  /*color:#0087ff;*/
  /*width:auto;*/
  /*height:100%;*/
  background-color:#FFFFFF;
  transform: rotate(90deg);
  /*-webkit-transform: rotate(-90deg);*/
  -webkit-transform-origin: 100% 0%;
  transform:  translateX(-43%) translateY(0%) rotate(-90deg);
}

div {
  display:inline-block;
  vertical-align:top;
  width:auto;
  height:100%;
  margin:0; 
  padding:0;
  border:0;
}
.divtitle {
  width:100%;
  /*border-top:1px solid #93a1a1;*/
  /*border-bottom:1px solid #93a1a1;*/
  text-align:left;
  background-color:#efefef;
  /*font-family: "SF Display";*/
  font-weight:480;
  font-size:6vw;
  /*color:#002b36;*/
  color:#7d8e94;
  padding:2.5%;
}
.regtitle {
  width:100%;
  /*border-top:1px solid #93a1a1;*/
  text-align:left;
  background-color:#efefef;
  /*color:#808080;*/
  color:#7d8e94;
  font-weight:480;
  padding:2.5%;
}

/*Old search*/
#searchbox {
  width:70%;
  /* border-top:1px solid #93a1a1; */
  /*  border:1px solid #93a1a1;*/
  border: 0;
  border-radius: 8px;
  -webkit-appearance: none;
  /*-webkit-border-radius: 8px;*/
  margin-left:2.5%;
  margin-top:1%;
  margin-bottom:1%;
  text-align:left;
  color:#808080;
/*  background-color:#d7d7d7;*/
  background-color:white;
  padding:2.5%;
  font-size:20px;
  placeholder:"Search";
}
.searchcancel {
  width:10%;
  border: 0;
  /* border-top:1px solid #93a1a1; */
  /*  border:1px solid #93a1a1;*/
  border-radius: 8px;
/*  margin-left:2.5%;*/
  margin:0;
  margin-top:1%;
  margin-bottom:1%;
  text-align:center;
/*  color:#808080;*/
/*  color:#cb4b16;*/
  color:grey;
/*  background-color:#d7d7d7;*/
  background-color:white;
  padding:2.5%;
  font-size:20px;
}
.searchclear {
  width:10%;
  border: 0;
  /* border-top:1px solid #93a1a1; */
  /*  border:1px solid #93a1a1;*/
  border-radius: 8px;
/*  margin-left:2.5%;*/
  margin:0;
  margin-top:1%;
  margin-bottom:1%;
  text-align:center;
/*  color:#808080;*/
/*  color:#cb4b16;*/
  color:grey;
/*  background-color:#d7d7d7;*/
  background-color:white;
  padding:2.5%;
  font-size:20px;
}
.searchclearon {
  color:white;
  background-color:grey;
}
.searchcancelon {
  color:white;
  background-color:grey;
}
.divlabel {width:50%; text-align:left; padding-left:2.5%;}
.divamt   {width:50%; text-align:right; padding-right:2.5%;}

.divbudget1  {width:50%; text-align:left; padding-left:2.5%;}
.divbudget2  {width:50%; text-align:right; padding-right:2.5%;}

.divregister {width:100%; margin:0; padding:0; border:0;}
.divdate {
  width:40%;
  color:#93a1a1;
  padding-left:2.5%;
  border-top:1px solid #93a1a1;
}
.divclear {
  width:8%;
/*  color:#93a1a1;*/
  border-top:1px solid #93a1a1;
  text-align:center;
}

.divcheck {
  width:17%;
  color:#93a1a1;
  overflow:scroll;
  white-space:nowrap;
  border-top:1px solid #93a1a1;
  text-align:center;
}
.divbudget {
  width:35%;
  color:#93a1a1;
  padding-right:2.5%;
  text-align:right;
  overflow:scroll;
  white-space:nowrap;
  border-top:1px solid #93a1a1;
}
.divdesc     {
  width:65%;
  padding-left:2.5%;
  overflow:scroll; white-space:nowrap;
}
.divamount {
  width:35%;
  text-align:right;
  padding-right:2.5%;
  overflow:scroll;
  white-space:nowrap;
}
.splitlabel {
  width:40%;
  padding-left:2.5%;
  border-top:1px solid #93a1a1;
}

.splittotal {
  width:60%;
  text-align:right;
  padding-right:2.5%;
  overflow:scroll;
  white-space:nowrap;
  border-top:1px solid #93a1a1;
}
.viewall {
  color: blue;
  width: 100%;
  text-align: center;
  border-top: 1px gray solid;
}
.databoxdiv {
  width:100%;
  color:#93a1a1;
  margin-top:3%;
  text-align:center;
}
#databox {
  font-family: "Courier New";
  /*font-weight: 300;*/
  font-size:16px;
  width:95%;
  text-align:center;
}

input[type='text'] {vertical-align: top;}
.menubutton-left, .databutton-left {
  width:22.5%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
/*  background-color:white;*/
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
  margin:1% 2% 1% 2%;
  border-radius:8px;
}
.menubutton-middle, .databutton-middle {
  width:22.5%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
/*  background-color:white;*/
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
  margin:1% 2% 1% 0;
  border-radius:8px;
}
.menubutton-right, .databutton-right {
  width:22.5%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
/*  background-color:white;*/
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
  margin:1% 2% 1% 0;
  border-radius:8px;
}

.splitbutton-left {
  width:25%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
}
.splitbutton-middle {
  width:25%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
}
.splitbutton-right {
  width:25%;
  padding-top:3%;
  padding-bottom:3%;
  color:#0087ff;
  background-color:#efefef;
  font-size:5.4vw;
  text-align:center;
}
.printarea {
  width,height:auto;
  font-size:12px;
  font-family:"courier new", courier, monospace;
  contenteditable:true;
}
.color-white {background-color:white;}
.color-red {color:#cb4b16;}
.color-grey {color:#7d8e94;}
.color-blue {color:#0087ff;}
.bcolor-split {background-color:#DEE2D6;}