/* .main-bg moved to Spa/styles/shell.css (its geometry) and Spa/styles/app.css (its plate). It was
   100vw x 100vh, which overshoots the viewport by the width of a scrollbar. */

#Nav {
  position: absolute;
  left: 0;
  top: 0;
  width: 20%;
  height: 100%;
  border: 1px solid black;
}

/* #Content moved to Spa/styles/shell.css. It is still position:absolute there - the percentage top: offsets
   on the out-of-scope authenticated screens resolve against it - but sized with min-height, so the page can
   grow past the viewport and the document can scroll. */

.main-logo {
  position: relative;
  display: block;
  width: 80%;
  height: 30%;
}

.main-logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20%;
}

.square-frame {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.square-frame-content-container {
  position: relative;
  margin: 3.8%;
  background: rgba(192, 0, 0, 0.2)
}

/* .circle-frame, .circle-frame-content-container and its five stepped width queries, and
   .begin-inquiry-textbox with its four max-height queries, all moved to Spa/styles/inquiry.css. Two of the
   three ladders were already inert - see the comment at the top of that file for the measurements - and the
   one that was not was painting the answer box over its own character counter.

   The CKB note that used to stand here said the circle-frame background was taken out "since it gets really
   complicated trying to fit the content for multiple screen sizes". That is the same problem this pass is
   solving; the background never came back. */

/* .nav-container, .nav-item, .nav-item-link, .nav-button, .nav-menu and .t were here. All six belonged to a
   left-hand sidebar that no longer exists; the two of them that survive - .nav-item and .nav-menu - do so
   only because Bootstrap's navbar happens to use the same class names, and are now restated scoped in
   Spa/styles/nav.css. The other four match nothing in Spa/, App.aspx or Reporting/. */

.focus-frame:focus-within {
  border: 1px solid;
  border-color: var(--btn-primary);
}

#Left {
  position: absolute;
  left: 0;
  top: 0;
  width: 20%;
  height: 100%;
  background-color: white;
}

#Right {
  position: absolute;
  right: 0;
  top: 0;
  width: 80%;
  height: 100%;
}


/* .begin-inquiry-caption deleted. Dead by grep over Spa/, App.aspx and Reporting/. */