TTT_Role_Overview/css/styles.css

html {
  background: url("https://img4.goodfon.com/wallpaper/nbig/2/39/tokho-toukhou-devushka-fon-mech.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

    --scrollbarBG: #CFD8DC;
    --thumbBG: #90A4AE;
}
body::-webkit-scrollbar {
  width: 11px;
}
body {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
body::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}
body::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}

.card {
    opacity: 0.9;
}
.blurry {
  backdrop-filter: blur(7px) !important;
}

.sidenav-overlay {
    backdrop-filter: blur(10px) !important;
}

pre {
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
overflow-x: auto;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}

pre code {
  color: #fff;
  background-color: #aaa;
  border: 1px solid #999;
  display: block;
  padding: 5px;
  overflow-x: auto;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
}

.background img {
  width: 100%;
}