* {
  color: #cdd6f4;
}
#main-content {
  margin: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#bg-img {
	background: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fget.wallhere.com%2Fphoto%2Fcatpuccin-bridge-digital-art-2275394.jpg&f=1&nofb=1&ipt=dfc01895bd2de4241621f6093aceb7a64fa61833023aaadc9ff576a58f131140&ipo=images");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
}

button {
  padding: 4px;
  background: #181825;
  border: none;
	width: 69%;
	border-radius: 8px;
}

button:hover {
  color: #181825;
  background: #cdd6f4;
}

#mods {
  float: left;
  display: flex;
  margin: 0 auto;
  flex: 1;
  justify-content: center;
  margin-right: 2px;
}
#members {
  float: right;
  display: flex;
  margin: 0 auto;
  flex: 1;
  justify-content: center;
  margin-left: 2px;
}

#main-div {
	font-family: "Comic Sans MS", "Comic Sans";
  margin: 0 auto;
  height: 69%;
	width: 69%;

	border: 2px solid;
	border-color: #b4befe;
	border-radius: 8px;
  background: #b4befe8f;

	justify-content: center;
  text-align: center;
  vertical-align: middle;

  position: relative;
  top: 50%;
  transform: translateY(-50%);

  backdrop-filter: blur(8px);
}

#scrolling-regions {
	width: 69%;
  height: 69%;
  margin: 0 auto;
  display: flex;
  backdrop-filter: blur(16px);
}

.scrollable {
	border: 2px solid;
	border-color: #b4befe;
	border-radius: 16px;
  backdrop-filter: blur(32px);
}