@font-face {
font-family: 'Figtree';
src: url('/static/fonts/Figtree-VariableFont_wght.ttf') format('truetype');
font-weight: 100 900;
font-style: normal;
}
@font-face {
font-family: 'Figtree';
src: url('/static/fonts/Figtree-Italic-VariableFont_wght.ttf') format('truetype');
font-weight: 100 900;
font-style: italic;
}
body {
  font-family: 'Figtree', sans-serif;
  font-weight: 400;
  margin: 0;
}
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
.login-split { display: flex; min-height: 100vh; }
.login-split .splash {
  flex: 1 1 auto;
  background: url('/static/images/login_splash_cw.png') no-repeat center center/cover;
  background-color: rgb(56, 73, 94); /* Solid dark blue background */
  position: relative; /* Needed for absolute positioning of pseudo-element */
}

.login-split .splash::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(56, 73, 94, 0.8); /* Dark blue with 80% opacity, making image 20% visible */
  z-index: 1; /* Ensure it's above the background image */
}
.login-split .sidebar {
  width: 30vw;
  min-width: 320px;
  max-width: 520px;
  background-color: #E5EDF2; /* light blue brand */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem 2rem;
}
.login-card { width: 100%; max-width: 420px; }
.ms-logo {
width: 20px;
margin-right: 10px;
}
.logo-text { color: #34495E; font-size: 16px; font-weight: 700; }
a.text-light {
text-decoration: none;
}
a.text-light:hover {
text-decoration: underline;
}