@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

html body {
  font-family: Roboto, sans-serif !important;
  background-color: #27363c !important;
  background: #27363c !important;
}

html body div[class*="MuiBox"],
html body div[class*="css-"] {
  background-color: transparent !important;
}

html body div[class*="MuiPaper"],
html body .MuiPaper-root,
html body div[class*="MuiCard"] {
  background-color: #1e2b30 !important;
  border-radius: 20px !important;
}

html body button[class*="MuiButton"][class*="Primary"],
html body .MuiButton-containedPrimary {
  background-color: #bf8e8d !important;
  color: #f5f5f0 !important;
}

html body button[class*="MuiButton"][class*="Primary"]:hover {
  background-color: #a87a79 !important;
}

html body [class*="MuiTypography"],
html body p, html body span,
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body label {
  font-family: Roboto, sans-serif !important;
  color: #f5f5f0 !important;
}

html body a,
html body [class*="MuiLink"] {
  color: #aeedf8 !important;
}

html body a:hover {
  color: #92a3a3 !important;
}

html body #inchoate-header a {
  color: #f5f5f0 !important;
}

html body #inchoate-header a:hover {
  text-decoration: none !important;
}

html body #inchoate-header h2 {
  color: #f5f5f0 !important;
}

html body [class*="MuiInputBase"],
html body [class*="MuiOutlinedInput"],
html body input {
  color: #f5f5f0 !important;
}

html body [class*="MuiOutlinedInput"] fieldset {
  border-color: #92a3a3 !important;
}

html body [class*="MuiOutlinedInput"]:hover fieldset {
  border-color: #aeedf8 !important;
}

html body [class*="Mui-focused"] fieldset {
  border-color: #bf8e8d !important;
}

html body [class*="MuiInputLabel"] {
  color: #92a3a3 !important;
}

html body [class*="MuiInputLabel"][class*="focused"] {
  color: #bf8e8d !important;
}

html body [class*="MuiCheckbox"] {
  color: #92a3a3 !important;
}

html body [class*="Mui-checked"] {
  color: #bf8e8d !important;
}

html body footer,
html body a[href*="authelia.com"],
html body [class*="PoweredBy"] {
  display: none !important;
  visibility: hidden !important;
}

html body #UserSvg,
html body img[src*="logo.png"],
html body img[alt="Logo"] {
  display: none !important;
}

html body [class*="MuiAppBar"],
html body header[class*="MuiAppBar"] {
  display: none !important;
}

#inchoate-header {
  max-width: 900px;
  margin: 0 auto;
  padding: 20px 20px 0 20px;
  box-sizing: border-box;
}
