.userbox{
	border-collapse: collapse;
	border-width: 1px;
	border-style: solid;
	height: 4rem;
	margin-bottom: 1px;
}
.userbox-left{
	float: left;
	clear: left;
	margin-right: 1rem;
}
.userbox-right{
	float: right;
	clear: right;
	margin-left: 1rem;
}
.userbox-label{
	text-align: center;
	vertical-align: middle;
	font-size: 1.4rem;
	font-weight: bold;
	width: 4rem;
}
.userbox-info{
	text-align: start;
	vertical-align: middle;
	font-size: 0.83rem;
	line-height: normal;
	padding: 0.4rem;
	background: var(--ma-custom-accent-color);
	width: 226px;
}

/* Red */
body[data-theme="dark"] .userbox-red .userbox-label{
	background-color: hsl(0, 100%, 20%);
}
body[data-theme="dark"] .userbox-red{
	border-color: hsl(0, 100%, 20%);
}
body[data-theme="light"] .userbox-red .userbox-label{
	background-color: hsl(0, 100%, 80%);
}
body[data-theme="light"] .userbox-red{
	border-color: hsl(0, 100%, 80%);
}

/* Yellow */
body[data-theme="dark"] .userbox-yellow .userbox-label{
	background-color: hsl(60, 100%, 20%);
}
body[data-theme="dark"] .userbox-yellow{
	border-color: hsl(60, 100%, 20%);
}
body[data-theme="light"] .userbox-yellow .userbox-label{
	background-color: hsl(60, 100%, 80%);
}
body[data-theme="light"] .userbox-yellow{
	border-color: hsl(60, 100%, 80%);
}

/* Green */
body[data-theme="dark"] .userbox-green .userbox-label{
	background-color: hsl(120, 100%, 20%);
}
body[data-theme="dark"] .userbox-green{
	border-color: hsl(120, 100%, 20%);
}
body[data-theme="light"] .userbox-green .userbox-label{
	background-color: hsl(120, 100%, 80%);
}
body[data-theme="light"] .userbox-green{
	border-color: hsl(120, 100%, 80%);
}

/* Cyan */
body[data-theme="dark"] .userbox-cyan .userbox-label{
	background-color: hsl(180, 100%, 20%);
}
body[data-theme="dark"] .userbox-cyan{
	border-color: hsl(180, 100%, 20%);
}
body[data-theme="light"] .userbox-cyan .userbox-label{
	background-color: hsl(180, 100%, 80%);
}
body[data-theme="light"] .userbox-cyan{
	border-color: hsl(180, 100%, 80%);
}

/* Blue */
body[data-theme="dark"] .userbox-blue .userbox-label{
	background-color: hsl(240, 100%, 20%);
}
body[data-theme="dark"] .userbox-blue{
	border-color: hsl(240, 100%, 20%);
}
body[data-theme="light"] .userbox-blue .userbox-label{
	background-color: hsl(240, 100%, 80%);
}
body[data-theme="light"] .userbox-blue{
	border-color: hsl(240, 100%, 80%);
}

/* Magenta */
body[data-theme="dark"] .userbox-magenta .userbox-label{
	background-color: hsl(300, 100%, 20%);
}
body[data-theme="dark"] .userbox-magenta{
	border-color: hsl(300, 100%, 20%);
}
body[data-theme="light"] .userbox-magenta .userbox-label{
	background-color: hsl(300, 100%, 80%);
}
body[data-theme="light"] .userbox-magenta{
	border-color: hsl(300, 100%, 80%);
}

/* [[Category:Memory Alpha CSS]] */