:root {
  --spinner-size: 24px;
  --spinner-thickness: 2px;
  --spinner-color: #3498db;
  --spinner-speed: 0.8s;
}
@keyframes spin { to { transform: rotate(360deg); } }
@-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .spinner {
    animation: none;
    -webkit-animation: none;
  }
}


html {
  background: linear-gradient(to right,rgba(0,0,0,.9) 0%,rgba(0,96,196,.8) 50%,rgba(0,0,0,.9) 100%),transparent url(https://gfaccounting.greatfloors.com/css/bkg-pattern.png) repeat scroll left top;
  height: 100%;
}

body {
  font-family: Trebuchet,arial,verdana;
  font-size: 100%;
  margin: 0;
  overflow-y: scroll;
}

.formfield {
  display: flex;
  align-items: end;
}

.spinner {
  --size: var(--spinner-size);
  --thickness: var(--spinner-thickness);
  width: var(--size);
  height: var(--size);

  display: inline-block;
  box-sizing: border-box;
  border-radius: 50%;

  /* base track */
  border: var(--thickness) solid rgba(0,0,0,0.08);
  /* visible segment */
  border-top-color: var(--spinner-color);

  /* animation */
  animation: spin var(--spinner-speed) linear infinite;
  -webkit-animation: spin var(--spinner-speed) linear infinite;

  /* improve animation performance */
  will-change: transform;
  vertical-align: middle;
}


.countdown {
  background-color: #cec000;
  width: 100%; 
  /* text-align: center; */
  border-collapse: collapse;
  padding-top: 3px
}
.navbar {
  float:left; font-size: 0.8em; padding: 3px 10px; height: 20px;
}
.navbar a {
  color: #000; text-decoration: none;  
}
.navbar a:hover {
  text-decoration: underline;
  color:#3498db
}

.content {
  position: relative;
  margin: auto;
  width: 90%;
  background-color: #fff;
  padding: 10px;
  min-height: 300px;
  margin-top: 20px;
  border-radius: 10px;
}
/* #selections {
  float: left;
  width: 59%;
  border: 1px blue solid;
}

#progress {
  float: right;
  width: 40%;
  border: 1px red solid;
} */
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.error
{
  color: #f00;
  font-weight: bold;
}
table .custom {
  background-color: #FFF;
  overflow-x: hidden;
  overflow-y: auto;
  border: none;
  margin: auto;
  border-collapse: collapse;
  border: 1px black dotted;
}

thead td .custom {
  text-align: center;
  border: none;
}

tbody td .custom {
  border: none;
  font-size: .85em;
}

tbody td a .custom {
  text-decoration: none;
}


div.centered
{
  text-align: center;
}
div.centered table
{
  margin: 0 auto;
  text-align: left;
}


.no-border  {
  border: none;
  background-color: #FFFFFF;
}
